Lazy Loading: ¿Debería Implementarlo?

Hay una obsesión por tener una web veloz que sea digna de un buen resultado y del agrado de las pruebas de Google Page Insights y GTMetrix.

Algunas de las medidas para mejorar los resultados van dirigidas a la optimización de imágenes.

Las imágenes se puede optimizar de muchas formas:

  • Reducir el peso de las imágenes
  • Adaptar el tamaño
  • Servirlas desde otro servidor
  • Pasarlas al formato WEBP
  • Hacer una carga diferida de imágenes. (Lazy loading)

Antes de hablar más sobre el lazy loading, recuerden que no todas las web son iguales, lo que le sirve a Pedro, no necesariamente le sirve a Pablo y la optimización de imágenes no es la excepción.

Tipos de Lazy Loading

Hay dos tipos de Lazy loading, uno de ellos es por medio de la implementacioń de un código javascript bastante liviano.

La otra opción de lazy loading es la opción nativa donde la implementación de Lazy Loading esta a cargo del navegador.

El detalle es que no todos los navegadores permiten la carga diferida nativa por lo que esta función no garantiza que el lazy loading se implemente en el 100% de los casos por la variedad de navegadores disponibles para los usuarios.

Plugins como Flying Images y PerfMatters tiene ambas opciones en caso de querer probar lo mencionado.

¿Debería Usar Lazy Loading?

Yo no te voy a decir a ciegas si debes usar Lazy Loading o no pero si te voy a decir sobre cómo averiguarlo.

  1. Haz una prueba de una página de tu sitio en Google Page Insights. Revisa los resultados y las indicaciones de mejora dadas.
  2. Descarga Lazy Load – Optimize Images por WP-Rocket y activa el Lazy Loading.
  3. Limpia el cache del sitio o de la página usada en el paso #1.
  4. Ahora realiza una nueva prueba en Google Page Insights y verifica si hubo una mejora en los resultados o recomendaciones.

Si no ves mejora, entonces no pienses tanto en el Lazy Loading. Un sitio que no usa muchas imágenes, quizas no deberia de preocuparse tanto por implementarlo.

Palabras de un Experto

WPJohhny en uno de sus artículos sobre velocidad de WordPress dice lo siguiente sobre Lazy Loading:

  • No uses Lazy Loading por simplemente aumentar el resultado de Google Page Insights.
  • No uses Lazy Loading si tienes un CDN.
  • No uses Lazy Loading si tienes pocas imágenes en tu sitio.
  • No uses Lazy Loading si tu pagina no tiene problemas de velocidad.

Si tienes muchas imagenes o si estas son muy pesadas, quizas deberías considerar la implementación del Lazy loading.

Cómo Implementar el Lazy Loading

En mi caso específico, no veo prudente hacerlo debido a que las imágenes ya están optimizadas, son livianas, tamaños pequeños y están en la parte superior del blog.

Estos son algunos plugins que debes considerar:

Piensalo bien y recuerda que el Lazy Loading será muy pronto una función nativa en WordPress. 5.5

Lazy Loading para Videos

Recuerda que podemos aplicar Lazy Loading para los videos, es decir los videos mostraran una miniatura y estos cargarán únicamente si el visitante hace click en el video

Esta opción la encuentras:

Artículos Relacionados