Vídeo de carga diferida en WordPress

¿Necesita Lazy Load Video en WordPress?

Los medios son una estrategia tan impactante para hacer que su contenido sea emocionante.

Cosas como imágenes y videos realmente pueden dar vida a lo que tiene que decir en su sitio web.

El único inconveniente de esto es que los archivos multimedia son grandes y tardan más en cargarse que solo el texto.

Si ha estado usando WordPress por un tiempo y ha puesto énfasis en la optimización de la velocidad y en asegurarse de que todas sus páginas web se carguen lo más rápido posible, probablemente haya oído hablar de la carga diferida.

¿Qué diablos es Lazy Loading?

La carga diferida es el proceso de retrasar la carga real de contenido hasta que se vuelve visible en la ventana gráfica del visitante. La ventana gráfica es el área del navegador que el visitante está viendo mientras se desplaza por su página web.

Hay muchos complementos de WordPress disponibles que le permiten cargar de forma diferida las imágenes dentro de cada página de su sitio web. Esto significa que si tiene imágenes que están más abajo en una página web, no se cargarán por completo hasta que el visitante entre en contacto con esa área de la página.

Este proceso es extremadamente poderoso para acelerar el tiempo de carga de una URL en su sitio web.

Hay dos factores principales cuando una página web se carga en relación con el tiempo real que tarda. Este es el tiempo de carga y el tiempo de carga completa.

Consulte la explicación a continuación de cuál es la diferencia entre cada uno.

¿Qué es el tiempo de carga?

Onload Time calcula la velocidad cuando se completa el procesamiento de la página y todos los recursos de esa página en particular, como imágenes, CSS y otras funciones, han terminado de descargarse.

Una vez completada, la página activará window.onload para completar los resultados de velocidad. Onload Time es una verdadera representación de la rapidez con la que su sitio web se cargará correctamente.

Sin embargo, una falla importante que se encontró con Onload Time es que algunos elementos de la carga de la página pueden no llegar a tiempo antes de que se dispare el evento desencadenante, como los archivos Javascript, los carruseles de imágenes o la funcionalidad/contenido se establece en un retraso de tiempo, por lo que cargas en un orden particular.

Estas variables causarán tiempos de carga de página inconsistentes e incluso pueden informar falsamente que su sitio web es más rápido o más lento de lo que realmente es.

¿Qué es el tiempo de carga completa?

Tomando lo que hemos aprendido sobre 'Tiempo de carga', 'Tiempo de carga completa' adopta exactamente el mismo proceso para registrar la velocidad de la página, pero agregará dos segundos adicionales después de que se haya disparado el disparador 'En carga' para asegurarse de que no haya más actividad en la red. El razonamiento detrás de esto es garantizar una mayor coherencia con las pruebas.

Un posible problema con la prueba de tiempo de carga completa es que este evento se activa solo cuando una página deja de cargar contenido por completo, incluidos anuncios y otras funciones.

Por lo tanto, si su sitio web se cargó antes del punto de corte y aún se puede utilizar, la herramienta de prueba aún esperará a que todo el sitio deje de cargar datos, lo que nuevamente podría conducir a resultados de prueba de velocidad inconsistentes.

¿Tiene el control total de su tiempo de carga?

A continuación se muestra un gráfico simple y agradable para ilustrar las cosas que debe tener en cuenta cuando se visita un sitio web y todas las piezas que se unen para decidir qué tan rápido se carga.

Como puede ver en esta imagen de arriba, hay algunas cosas que están fuera de su control. Por ejemplo, la velocidad del proveedor de servicios de Internet de la persona que visita su sitio web está completamente fuera de su control.

Si está buscando exprimir la mayor velocidad posible de su sitio web de WordPress, debe concentrarse en las cosas sobre las que tiene control.

Cosas de optimización de velocidad de WordPress sobre las que tienes control

1. Entorno de alojamiento
2. Actualizaciones de software
3. Tema activo
4. Complementos activos
5. Optimización de Contenido

Volvamos a Lazy Load Video en WordPress

Entonces, en la lista anterior sobre la optimización de la velocidad de WordPress, las cosas sobre las que tiene control, el último elemento de la lista es la optimización del contenido.

Esto significa asegurarse de que todo el contenido de su sitio web se haya optimizado para cargarse lo más rápido posible sin cambiar ninguna de las funciones o la visualización del contenido.

Veamos esto en detalle y permítanos mostrarle la diferencia en la velocidad de un video que se incrustó tradicionalmente como lo hace la mayoría de las personas en su sitio web y un video que se configuró para carga diferida.

El experimento comienza aquí

Seguimos adelante y creamos una instalación predeterminada de WordPress y dentro de ella para separar páginas.

Una página tiene un video de YouTube incrustado que se incrustó usando la opción de incrustación del núcleo nativo de WordPress simplemente colocando el enlace al video de YouTube en el editor de Gutenberg. Esto genera el video de YouTube incrustado en la página.

La segunda página es el mismo video pero con una carga demasiado diferida, lo que significa que el código de video real no se activará ni comenzará a ejecutarse hasta que el visitante presione el botón de reproducción.

Eche un vistazo a continuación a las asombrosas diferencias entre los dos procesos de visualización de un video en su contenido de WordPress.

Ejemplo de página de video incrustado

La imagen a continuación es la prueba de visualización de velocidad realizada en GTmetrix de la página que tenía el video tradicional de YouTube incrustado.

Preste mucha atención al tiempo de carga y al tiempo de carga completa a continuación.

La imagen a continuación es una lista de los procesos que ocurrieron durante la carga de esta página. Por favor tome nota de la cantidad total de solicitudes.

Ejemplo de página de video de carga diferida

La siguiente imagen es la prueba de visualización de velocidad realizada en GTmetrix de la página que tenía el video incrustado de carga diferida.

Preste mucha atención al tiempo de carga y al tiempo de carga completa a continuación. Esto es menos de 1 segundo para el tiempo de carga y se compara con más de 1 segundo para el video incrustado tradicionalmente.

El tiempo de carga completa también es inferior a 1 segundo en comparación con el tiempo de carga completa de más de 3 segundos del video incrustado tradicional.

Puede ver en la cascada de prueba de velocidad a continuación que hay 21 solicitudes menos que se solicitan cuando la página se está cargando porque cargamos de forma diferida el video incrustado.

Una de las mejores cosas que puede hacer para acelerar cualquier página web es reducir la solicitud. Cuantas más solicitudes necesite una página para cargar, significa que llevará más tiempo.

Las secuencias de comandos y los estilos necesarios para cargar el reproductor de video aún se llevarán a cabo, pero no hasta que el visitante presione el botón de reproducción en el video.

Esto es extremadamente poderoso porque imagine que si un visitante llega a su página y ni siquiera reproduce el video, significa que está cargando recursos que el visitante nunca utilizará.

Ahora sabes que Lazy Load Video en WordPress es bueno... ¿QUÉ SIGUE?

Ya explicamos anteriormente que hay muchos complementos de WordPress que le permiten cargar de forma diferida las imágenes en su sitio web, pero no hay muchos complementos que le permitan hacer esto para videos.

Los únicos complementos GRATUITOS reales centrados en la carga diferida de videos en su sitio web de WordPress son el complemento Lazy Load for Videos y a3 Lazy Load, sobre los cuales puede obtener más información haciendo clic en las imágenes a continuación.

Hay algunos complementos de optimización de velocidad adicionales que incluyen esta funcionalidad que le permitirá cargar videos de YouTube o iFrames de forma diferida. Vea los nombres de estos complementos a continuación.

1. Rendimiento rápido profesional
2. Cohete WP

Los complementos hacen que el video no sea perezoso en WordPress

En la mayoría de los casos, podrá usar uno de estos complementos mencionados anteriormente para cargar videos de forma diferida en WordPress. Sin embargo, hay situaciones en las que lo que intenta cargar de forma diferida no es compatible con las funciones que ofrecen estos complementos.

Estos complementos de WordPress de carga diferida para videos a menudo solo se integran con YouTube y Vimeo. Existen muchas otras soluciones de alojamiento de videos que podría estar utilizando.

Aquí es donde tenemos una solución alternativa que le permitirá tomar cualquier fragmento de código iFrame y convertirlo en una obra maestra de carga diferida en su sitio web.

SUPER COOL Herramienta GRATUITA para Lazy Load Video en WordPress

Hay una herramienta en línea súper genial, fácil de usar y gratuita donde puede tomar cualquier URL habilitada para iFrame y configurar un fragmento de código que se cargará de forma diferida.

Este peaje se llama IFRAMELY y se puede usar de forma gratuita en https://iframely.com/embed

La imagen a continuación es una captura de pantalla de la herramienta de inserción IFRAMELY que lo ayudará a generar el código de inserción necesario para colocar en su sitio web y cargar videos en WordPress.

acabando de terminar

Esperamos que esta publicación haya sido útil y lo ayude a comprender el aumento de velocidad que se puede lograr en su sitio web de WordPress cuando decide cargar de forma diferida los videos que está utilizando en su contenido.

Si tiene alguna pregunta sobre lo que se discutió aquí, no dude en comentar a continuación.