El aumento del tráfico web de usuarios móviles y personas de todo el mundo con capacidades de conexión limitadas ha obligado a las empresas y desarrolladores a optimizar en gran medida la velocidad de carga de los sitios web. Tradicionalmente, cuando se navega por una página web, esta descarga y muestra todo el contenido disponible: imágenes, iconos, GIF, estilos, scripts, etc. Como se puede imaginar, la carga de todo eso provoca un retraso en el inicio del sitio web, especialmente para los usuarios con conexiones lentas. Google ha estado tratando de eliminar este problema durante un tiempo. El año pasado, añadieronla función de carga diferida de imágenesen Google Chrome 76. Ahora, Google está incorporando la misma funcionalidad a los iframes.
La carga diferida carga el contenido de la página web a pedido, lo que significa que no se descargará ni se mostrará hasta que te desplaces hacia abajo y lo tengas en la vista, lo que reduce la velocidad de inicio inicial del sitio web. Como se mencionó, la carga diferida de imágenes ha estado disponible en Chrome desde el año pasado, pero ahora los desarrolladores también pueden usar el mismo método en iframes. Para implementarlo en tu propio sitio web, todo lo que tienes que hacer es agregar el atributoloading="lazy"a tus imágenes y/o elementos iframe. Los navegadores como Firefox y Safari ya han implementado la función nativa de carga diferida de imágenes. En cuanto a los iframes, todavía están trabajando para corregir un par de errores. Google también mencionó que Chrome para Android en modo Lite carga automáticamente de forma diferida las imágenes y los iframes fuera de la pantalla.
Irónicamente, durante la prueba de cómo las incrustaciones de videos de YouTube (que están basadas en iframes) influirían en la velocidad de carga de la página web cuando se cargan de forma diferida, el equipo de Chrome descubrió que "ahorraron10 segundos en el tiempo que nuestras páginas podrían ser interactivas en dispositivos móviles". No hace falta decir que la carga diferida tiene ventajas reales sobre el método tradicional de descargar todo el contenido de la página web tan pronto como la visita.
Fuente:web.dev
Vía:Techdows