Cómo afectan los plugins de WordPress al tiempo de carga de tu sitio

¿Te has preguntado alguna vez cómo afectan los plugins de WordPress al tiempo de carga de tu sitio? Los plugins de WordPress te permiten añadir funciones a tu sitio, pero también pueden afectar a la velocidad de tu sitio web. En este artículo, te mostraremos cómo afectan los plugins de WordPress al tiempo de carga de tu sitio, y cómo puedes controlarlos de forma más eficiente

¿Cómo funcionan los plugins de WordPress?

Los plugins de WordPress son como aplicaciones para tu sitio web de WordPress. Puedes instalarlos para añadir más funciones a tu sitio web, como formularios de contacto, galerías de fotos o una tienda de comercio electrónico.

Cuando alguien visita tu sitio web, WordPress carga primero sus archivos principales y luego carga todos tus plugins activos

Para más detalles, echa un vistazo a nuestro artículo sobre ¿Qué son los plugins de WordPress? ¿Y cómo funcionan?

¿Cómo pueden afectar los plugins al tiempo de carga del sitio?

Cada plugin de WordPress ofrece diferentes funciones y características. Para ello, algunos plugins realizan llamadas a la base de datos en el backend, mientras que otros cargan activos en el front-end, como hojas de estilo CSS, archivos JavaScript, imágenes, etc

Hacer consultas a la base de datos y cargar activos aumenta el tiempo de carga de tu sitio. La mayoría de los plugins hacen una petición HTTP para cargar activos como scripts, CSS e imágenes. Cada petición aumenta el tiempo de carga de la página de tu sitio.

Cuando se hace correctamente, el impacto en el rendimiento no suele ser demasiado perceptible

Sin embargo, si utilizas varios plugins que realizan demasiadas peticiones http para cargar archivos y activos, esto afectará al rendimiento de tu sitio y a la experiencia del usuario

¿Cómo comprobar los archivos cargados por los plugins de WordPress?

Para ver cómo los plugins están afectando al tiempo de carga de tu página, tienes que comprobar los archivos cargados por los plugins de WordPress

Hay muchas herramientas que puedes utilizar para averiguar esto

Puedes utilizar las herramientas de desarrollo de tu navegador (Inspeccionar en Google Chrome e Inspeccionar elemento en Firefox)

Simplemente visita tu sitio web y haz clic con el botón derecho para seleccionar Inspeccionar. Esto abrirá el panel de herramientas para desarrolladores

Tienes que hacer clic en la pestaña "Red" y luego recargar tu sitio web. Mientras la página se recarga, podrás ver cómo tu navegador carga cada archivo.

También puedes utilizar herramientas de terceros como Pingdom y GTmetrix para ver esto. Entre otra información útil, estas herramientas también te mostrarán todos los archivos cargados y el tiempo que tardaron en cargarse

¿Cuántos plugins son demasiados?

Cuando veas que se cargan estos archivos, puede que empieces a preguntarte cuántos plugins deberías usar en mi sitio ¿Cuántos plugins son demasiados?

La respuesta depende realmente del conjunto de plugins que estés utilizando en tu sitio web

Un solo plugin malo puede cargar 12 archivos, mientras que varios plugins buenos sólo añadirán un par de archivos adicionales

Todos los plugins bien codificados intentan mantener al mínimo los archivos que cargan. Sin embargo, no todos los desarrolladores de plugins son tan cuidadosos. Algunos plugins cargan archivos en cada carga de la página, incluso cuando no los necesitan

Si utilizas demasiados plugins de este tipo, esto empezará a afectar al rendimiento de tu sitio

¿Cómo mantener los plugins bajo control?

Lo más importante que puedes hacer en tu sitio de WordPress es utilizar únicamente plugins que estén bien codificados, tengan buenas críticas y estén recomendados por fuentes de confianza

Consulta nuestra guía sobre cómo encontrar qué plugins de WordPress

Si ves que un plugin de WordPress está afectando a la carga de tu sitio, busca un plugin mejor que haga el mismo trabajo pero mejor

A continuación, tienes que empezar a utilizar la caché y la CDN para mejorar aún más el rendimiento y la velocidad de tu sitio

Otro factor que debes tener en cuenta es el alojamiento de tu sitio web. Si tus servidores de alojamiento no están bien optimizados, aumentará el tiempo de respuesta de tu sitio

Esto significa que no sólo los plugins, sino el rendimiento general de tu sitio será más lento. Asegúrate de que utilizas una de las mejores empresas de alojamiento de WordPress

Como último recurso, puedes desinstalar los plugins de los que puedas prescindir. Revisa cuidadosamente los plugins instalados en tu sitio web, y mira si puedes desinstalar algunos de ellos. Esta no es una solución ideal, ya que tendrás que renunciar a funciones a cambio de velocidad

Optimizar manualmente los activos de los plugins de WordPress

Los usuarios avanzados de WordPress pueden intentar gestionar cómo los plugins de WordPress cargan los archivos en su sitio. Hacerlo requiere algunos conocimientos de codificación y algunas habilidades de depuración

La forma correcta de cargar los scripts y las hojas de estilo en WordPress es utilizando la función wp_enqueue_style y wp_enqueue_script funciones

La mayoría de los desarrolladores de plugins de WordPress las utilizan para cargar los archivos de los plugins. WordPress también dispone de funciones sencillas para dar de baja esos scripts y hojas de estilo

Sin embargo, si sólo desactivas la carga de esos scripts y hojas de estilo, entonces esto romperá tus plugins, y no funcionarán correctamente. Para solucionarlo, tendrás que copiar y pegar esos estilos y scripts en los archivos de hoja de estilos y JavaScript de tu tema

De esta forma podrás cargarlos todos a la vez, minimizando las peticiones http y disminuyendo efectivamente el tiempo de carga de tu página

Veamos cómo dar de baja fácilmente las hojas de estilo y los archivos JavaScript en WordPress.

Desactivar las hojas de estilo de los plugins en WordPress

En primer lugar, tendrás que encontrar el nombre o el manejador de la hoja de estilos que quieres dar de baja. Puedes localizarla utilizando la herramienta de inspección de tu navegador

Después de encontrar el manejador de la hoja de estilos, puedes anular su registro añadiendo este código al archivo functions.php de tu tema o a un plugin específico del sitio

add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
function my_deregister_styles() {
wp_deregister_style( 'gdwpm_styles-css' );
}

Puedes anular el registro de tantos manejadores de estilo como quieras dentro de esta función. Por ejemplo, si tienes más de un plugin para el que desregistrar la hoja de estilos, entonces lo harías así:

add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
function my_deregister_styles() {
wp_deregister_style( 'gdwpm_styles-css' );
wp_deregister_style( 'bfa-font-awesome-css' );
wp_deregister_style( 'some-other-stylesheet-handle' );
}

Recuerda que anular el registro de estas hojas de estilo afectará a las funciones de los plugins en tu sitio web. Tienes que copiar el contenido de cada hoja de estilo que desregistres y pegarlo en la hoja de estilos de tu tema de WordPress o añadirlo como CSS personalizado

Desactivar los JavaScripts de los plugins en WordPress

Al igual que en el caso de las hojas de estilo, tendrás que averiguar el "handle" utilizado por el archivo JavaScript para darlo de baja. Sin embargo, no encontrarás el handle utilizando la herramienta de inspección

Para ello tendrás que profundizar en los archivos de los plugins para averiguar el manejador utilizado por el plugin para cargar un script

Otra forma de averiguar todos los manejadores utilizados por los plugins es añadir este código en el archivo functions.php de tu tema

function wpb_display_pluginhandles() { 
$wp_scripts = wp_scripts(); 
$handlename .= "<ul>"; 
    foreach( $wp_scripts->queue as $handle ) :
      $handlename .=  '<li>' . $handle .'</li>';
    endforeach;
$handlename .= "</ul>";
return $handlename; 
}
add_shortcode( 'pluginhandles', 'wpb_display_pluginhandles'); 

Después de añadir este código, puedes utilizar [pluginhandles] shortcode para mostrar una lista de los manejadores de los scripts de los plugins

Ahora que tienes manejadores de scripts, puedes darlos de baja fácilmente usando el siguiente código

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript() {
wp_deregister_script( 'contact-form-7' );
}

También puedes utilizar este código para desactivar varios scripts, así

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript() {
wp_deregister_script( 'contact-form-7' );
wp_deregister_script( 'gdwpm_lightbox-script' );
wp_deregister_script( 'another-plugin-script' );
}

Ahora bien, como hemos mencionado anteriormente, al desactivar estos scripts tus plugins dejarán de funcionar correctamente

Para evitarlo, tendrás que combinar los JavaScripts, pero a veces no funciona bien, así que debes saber lo que estás haciendo. Puedes aprender por ensayo y error (como hacemos muchos de nosotros), pero te recomendamos que no lo hagas en un sitio en vivo.

El mejor lugar para probar es en una instalación local de WordPress o en un sitio de ensayo con proveedores de alojamiento gestionado de WordPress.

Cargar scripts sólo en páginas específicas

Si sabes que vas a necesitar que un script de un plugin se cargue en una página específica de tu sitio web, entonces puedes permitir un plugin en esa página en particular

De este modo, el script permanece desactivado en todas las demás páginas de tu sitio y se carga sólo cuando es necesario

Así es como puedes cargar los scripts en páginas específicas.

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript() {
if ( !is_page('Contact') ) {
wp_deregister_script( 'contact-form-7' );
}
}

Este código simplemente desactiva el script del formulario de contacto-7 en todas las páginas excepto en la de contacto

Eso es todo por ahora

Esperamos que este artículo te haya ayudado a saber cómo afectan los plugins de WordPress al tiempo de carga de tu sitio. Quizás también quieras ver nuestra guía definitiva para mejorar la velocidad y el rendimiento del sitio de WordPress

Si te ha gustado este artículo, suscríbete a nuestro Canal de YouTube para los videotutoriales de WordPress. También puedes encontrarnos en Twitter y Facebook.