Chrome ahora admite la carga diferida de iframes

Agregar “carga diferida” de elementos iframe a sitios web móviles puede acelerarlos hasta 10 segundos.

El aumento del tráfico de Internet procedente de usuarios de dispositivos móviles y personas de todo el mundo con conexiones móviles limitadas ha obligado a las empresas y desarrolladores a optimizar significativamente las velocidades de carga de los sitios web. Tradicionalmente, cuando visita un sitio web, el navegador descarga y muestra todo el contenido disponible: imágenes, iconos, GIF, estilos, scripts, etc. Como puede imaginar, cargar todo esto provoca un retraso cuando se inicia el sitio, especialmente para los usuarios con conexiones lentas.

Google lleva algún tiempo intentando eliminar este problema. El año pasado se añadió una función. carga diferida de imágenes en Google Chrome versión 76. Ahora Google está introduciendo la misma funcionalidad carga retrasada para 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 usted se desplace hacia abajo y los muestre en su pantalla, lo que reduce la velocidad de inicio inicial de su sitio web.

Como se mencionó, la carga diferida de imágenes está disponible en Chrome desde el año pasado, pero ahora los desarrolladores también pueden usar el mismo método en iframes. Para implementar esto en su propio sitio, simplemente agregue el atributo loading=”lazy” a sus imágenes: y elementos de iframe:

Ejemplo:

Navegadores como Firefox y Safari ya tienen una función para retrasar la carga de imágenes nativas. En cuanto a los iframes, todavía están trabajando para corregir algunos errores. Google también mencionó que el navegador móvil Chrome para Android en la versión liviana carga automáticamente imágenes e iframes fuera de la pantalla.

Irónicamente, mientras probaba cómo la incrustación de vídeos de YouTube (que se basan en iframes) afectaría la velocidad de carga de un sitio web en carga diferida, el equipo de Chrome descubrió que “guardado 10 segundos sobre la rapidez con la que nuestros sitios web pueden ser interactivos en dispositivos móviles”. No hace falta decir que la carga retrasada tiene ventajas reales sobre el método tradicional de descargar todo el contenido de un sitio web cuando lo visitas.

fuente: Github | Web.DEV| Desarrolladores XDA