Seguramente habrás escuchado en algún rincón de Internet a algún gurú hablando de la importancia del WPO. Además de ir corriendo a consultar el significado de estas siglas, habrás pensado que los consejos de ese gurú son la clave para optimizar tu web y que despegue finalmente hacia el estrellato.
No seré yo el que lo ponga en duda. El WPO es importante, pero también hay que ir con extremo cuidado a la hora de poner en práctica algunos de los consejos que nos dan por ahí, por muy experta que sea la persona que nos los da.
En WordPress es habitual leer que hay una serie de plugins que debes instalar sí o sí para mejorar el rendimiento de tu web. Que si un plugin de SEO por aquí, otro de caché por allá, uno de seguridad que tampoco falte… En definitiva, la típica charla para principiantes que puede acabar como un videojuego de Pokémon: ¡hazte con todos los plugins!
El sentido común, aunque es el menos común de los sentidos, nos dice que en WordPress debemos utilizar el menor número posible de plugins para conseguir cubrir el máximo número de funcionalidades que necesitemos. No es necesario instalar todos los plugins habidos y por haber, y de echo es una práctica nada recomendable. Optimizar tu web es más complejo que instalar un simple plugin.
Cuidado con los plugins milagrosos en WordPress
Pero siguiendo con el tema anterior del WPO, un tipo de plugins estrella en WordPress para mejorar la velocidad de tu web son los de minificación y agregación de scripts y estilos. En la mayoría de casos, estos plugins se venden como la panacea para conseguir el 100 en los medidores de rendimiento de webs. Entre sus supuestas ventajas tenemos lo siguiente:
- Minifican estilos CSS y scripts en JavaScript para reducir su tamaño y que tu web tarde menos en descargarlos.
- Agregan todos los estilos CSS y scripts en JavaScript de forma que sólo cargues un único archivo CSS y un único script JavaScript, reduciendo el número de peticiones que has de hacer al servidor.
- Meten etiquetas
asyncydeferpara que la web no espere a cargar los scripts y la ejecución siga. - Eliminan elementos innecesarios, como por ejemplo los emojis.
- Permiten aplicar carga diferida (lazy loading) de imágenes para reducir aún más el tiempo de carga de tu web.
Todo esto es perfecto, pero si eres de los que instala y activa el plugin para auto-optimizar que te recomiendan sin leer la letra pequeña, siento decirte que las probabilidades de que tu web se rompa son muy altas.
Los plugins de auto-optimización pueden parecer la panacea, pero también pueden acabar convirtiendo tu web en un campo de minas. Y sí, no saldrás de ahí sin pisar una y reventar alguna parte de tu web.
El motivo es sencillo de explicar. Los plugins para WordPress que combinan y minifican scripts JavaScript en un sólo archivo, no mantienen el orden de ejecución de estos scripts, lo que hace que surjan errores.
Si repasamos la forma correcta de encolar scripts en WordPress, tenemos que ir a ver la definición de la función wp_enqueue_script():
wp_enqueue_script(
string $handle,
string $src = '',
string[] $deps = array(),
string|bool|null $ver = false,
bool $in_footer = false
)El tercer parámetro de esta función es una lista de dependencias, que no es más que el nombre de otros scripts que el script que estamos encolando necesita que estén presentes antes de él para su correcto funcionamiento.
Pues bien, el orden en el que se encolan los scripts es importante, y las dependencias también. WordPress se encarga de crear un orden correcto si usamos la función wp_enqueue_script, asegurándose que los scripts se cargan en la página como toca.
El problema es que si utilizamos un plugin que minifique y combine archivos JavaScript, el archivo JavaScript resultante de la combinación que ese tipo de plugins carga y que incluye el código de los otros JavaScripts en su interior no respeta el orden de ejecución y de dependencias que hayamos definido. Y esto es lo que hace que tu código JavaScript no funcione.
Si tenemos en cuenta que cada día encontramos más JavaScript en nuestras webs en WordPress para implementar funcionalidades, instalar este tipo de plugins y activarlos a lo loco puede ser muy problemático.
Mi web no funciona. ¿Quién es el culpable?
Como desarrolladores de plugins para WordPress, es nuestro deber ser cuidadosos e intentar tener el mínimo impacto en la funcionalidad de otros plugins. Sin embargo, con bastante frecuencia nos encontramos con usuarios de nuestros plugins que se quejan de que al instalar un plugin nuestro se rompe su web.
Después de una investigación concienzuda, muchas veces el problema viene dado porque tienen activo alguno de estos plugins que combina los scripts a saco y hace que el JavaScript se rompa. Ten en cuenta, además, que al estar todo el JavaScript de la web junto en un único script, si hay un fallo que pare la ejecución de ese script, ningún otro script funcionará tampoco.
La consecuente pérdida de tiempo intercambiando mensajes hasta conseguir que el usuario nos dé acceso a su instalación para finalmente ver que el problema es un plugin de auto-optimizado de scripts es terrible. Es por ello que hoy me gustaría que si estás leyendo esto y tienes una web en WordPress seas consciente de que los plugins de auto-optimización de scripts y estilos son un arma de doble filo si no los configuras apropiadamente.
La solución pasa por excluir del proceso de minificado y combinación a los scripts de aquellos plugins que se rompen debido al plugin de auto-optimizado. Algo que no es difícil de hacer si sabes qué scripts has de incluir. Pero el problema es que los usuarios de estos plugins de auto-optimizado rara vez hacen esto.
Como medida de protección, los desarrolladores de plugins hemos de incluir filtros de compatibilidad en nuestro código para excluir por defecto nuestros scripts de los procesos de combinado y minificado de estos otros plugins. Algo que además de llevar tiempo, no siempre es posible o está bien documentado.
Nelio Unlocker
Pásate a WordPress manteniendo tus diseños y contenidos
Mejora hoy mismo el SEO de tu web y acelera su velocidad de carga convirtiendo tus páginas a estándares HTML, CSS y WordPress. No necesitas conocimientos técnicos y solo pagarás por aquello que necesites.
Usa los plugins de auto-optimización con mucho ojo
Después de este artículo no quiero que te llevas la falsa apariencia de que soy un hater de los plugins para auto-optimizar. Su éxito es un claro identificador de que son útiles y de que a la gente les soluciona un problema. Incluso nosotros mismos en nuestra web tenemos activado el plugin de auto-optimización que SiteGround proporciona.
Eso sí, lo que hay que hacer es tener en cuenta que si usamos este tipo de plugins, no nos podemos quedar en su simple activación. Hemos de probarlos a conciencia en nuestra web para poder configurarlos correctamente según nuestras condiciones concretas. Y cada vez que instalamos un plugin nuevo, debemos volver a comprobar que nuestro proceso de minificado/combinado no rompe al pobre plugin.
Siendo un poco responsables y teniendo cuidado, los problemas que te vas a encontrar minificando y combinando scripts y estilos CSS con plugins de auto-optimizado se pueden reducir considerablemente.
Imagen destacada de Markus Spiske en Unsplash.
Deja una respuesta