La velocidad de carga de la web es uno de los temas que más consultas me generan. Es un tema que nos preocupa a todos, incluso a veces llega a nivel de obsesión. Y no es para menos: la velocidad a la que cargan las páginas de tu web no sólo favorecerá o perjudicará tu posición en los resultados de búsqueda de Google, sino que además una carga lenta te hará perder visitas o, lo que es lo mismo, ventas o clientes.

Porque somos así de impacientes. Nos hemos acostumbrado a lo inmediato, y si una web tarda más de tres o cuatro segundos en cargar nos vamos a otro sitio. Pero eso se va a terminar, porque vamos a ver cinco plugins que te van a ayudar (y mucho) a mejorar la velocidad de tu web WordPress. Pero cuidado, no se trata de instalarlos todos y a correr, sino de ver cuál o cuáles de ellos son necesarios en tu caso. ¡Vamos a ello!

Lo primero: saber qué plugins deberías quitar o cambiar

Aunque, para empezar, lo mejor es siempre identificar qué está causando el problema. Porque (quítate la venda de los ojos) si la web va lenta hay un culpable. O varios. Las causas pueden ser varias, pero ya que estamos hablando de plugins vamos a centrarnos en este aspecto.

Así que, para empezar, veamos si alguno o algunos de los plugins que tienes instalados es culpable de parte del desaguisado. Para eso podemos contar con la inestimable ayuda de P3 (Plugin Performance Profiler).

Este plugin, desarrollado por GoDaddy, lo que hace es medir el impacto sobre la velocidad de carga de cada uno de los plugins que tienes instalados, además de la del theme y del propio WordPress.

Para ello (Herramientas > P3 Plugin Profiler) carga varias páginas de tu sitio web mientras mide factores como el tiempo de carga de los scripts, las peticiones a la base de datos, etcétera, para darte una medida global del impacto de los plugins en la carga de tu web, y un informe de cada uno de ellos de forma individual.

Como puedes ver en el gráfico, lo primero que tienes que tener en cuenta de este plugin es que deberías usarlo para ver cuánto está retrasando cada uno de los plugins la carga de la página y después deberías desactivarlo, desinstalarlo e incluso quemarlo. Como ves, el 75% del la velocidad de carga se la lleva él mismo.

Es normal: es un plugin que debe ir interfiriendo con la carga de todos los elementos para medir el impacto, debe funcionar así. Pero ten mucho cuidado con eso y no dejes este plugin activado. Por supuesto, mientras no esta haciendo un escan no ralentiza tanto la carga, pero aún así sus scripts siguen ahí, y si tienes un problema de necesidad eso es lo último que necesitas.

Pero la información verdaderamente útil la encontrarás en la pestaña Detailed Timeline, en la que podrás ver, de forma detallada, cuánto tiempo significa cada plugin en la carga de las diversas URLs testeadas. Échale un vistazo a todas las pestañas, e identifica al culpable.

En este vídeo puedes ver cómo hacer una prueba completa y cómo interpretar los resultados:

Mejorar la velocidad en la carga de imágenes

Uf, las imágenes. Anda que no hay tela con esto. Aproximadamente una cuarta parte de las veces que me dicen Mi web tarda mucho en cargar, no sé qué puede ser me encuentro con imágenes de varios cientos de kilobytes redimensionadas por HTML o CSS. De locos…

En realidad hay tanto que hablar sobre optimizar la carga de las imágenes en una web que ya le dediqué un artículo entero al tema, puedes echarle un vistazo:

WP Smush

Pero como hoy vamos a lo que vamos, te hablaré de WP Smush, un plugin que optimiza el tamaño de las imágenes de tu web.

Su uso es muy fácil: lo instalas, lo activas, y listo. Desde ese momento todas las imágenes que subas a la biblioteca de medios serán optimizadas (ojo, que esto causará una ligera pérdida de calidad). Así la carga de las paginas con imágenes se acelera: menos datos, más rapidez.

¿Y las que ya tenías subidas? Pues puedes hacer dos cosas. En Medios > WP Smush tendrás una herramienta para optimizar en lote, y aparte en la propia biblioteca tendrás, en el detalle de medios, un botón mediante el que podrás optimizar la imagen si ésta lo necesita:

Recuerda que WordPress, por defecto, ya reduce la calidad de las imágenes en un 18%. Ten cuidado de no sobreoptimizar si no quieres tener unas imágenes pobres en calidad. Si quieres evitar que WordPress reste calidad puedes utilizar este plugin.

Lazy Load

¿Para qué cargar las imágenes que no se van a ver? Cada imagen retrasa la carga de la página, disminuyendo su velocidad. Y si luego esa imagen está en un lugar que el usuario no va ni a ver, porque queda muy abajo, ¿qué sentido tiene?

Lazy Load XT es un plugin que carga las imágenes dinámicamente sólo cuando es necesario, es decir, según aparecen en pantalla.

De esta forma las imágenes “aparecen” según vas bajando el scroll. Si se cargan todas ellas al principio la página tardaría más tiempo en estar disponible. Así se cargan dinámicamente sólo en el momento en que son necesarias: cuando tú vayas a verlas.

Mejorar la velocidad en la carga de recursos

Otras veces la culpa de los retrasos en la carga no es de las imágenes, sino de otros recursos, fundamentalmente las hojas de estilos (CSS) y los javascripts. Pero tranquilo, también hay plugins que pueden ayudarnos a resolver esa situación.

WP Super Minify

El primero de ellos es WP Super Minify, un plugin que minimiza los CSS y los JS.

Y ¿qué es eso de minimizar (en este contexto)? Pues que le quita todo lo sobrante: espacios en blanco, comentarios… Es decir, convierte esto:

/* Cabecera y menú */

p.site-title {
  border-bottom:0;
}

.site-title a {
  font-family: 'Indie Flower', cursive, sans-serif;
  text-transform:uppercase;
  font-size:42px;
  margin-bottom:-25px;
}

p.site-description {
  font-family:'Roboto Slab', serif;
  font-size:13px;
  letter-spacing:5px;
  text-transform:uppercase;
  color:#333333;
}

en esto otro:

p.site-title{border-bottom:0}.site-title a{font-family:'Indie Flower',cursive,sans-serif;text-transform:uppercase;font-size:42px;margin-bottom:-25px}p.site-description{font-family:'Roboto Slab',serif;font-size:13px;letter-spacing:5px;text-transform:uppercase;color:#333}

Eso los vuelve prácticamente ilegibles para un desarrollador que necesite hacer cambios, claro, y por eso no se escriben así, pero WP Super Minify lo hace de forma dinámica, sin cambiar los archivos originales, sólo los que se cargan.

El resultado es un plus de velocidad, arañar unas décimas de segundo en la carga de la página gracias a todos esos kilobytes (se, sumando todos los scripts, hacen un pico) que se ahorran.

Mejorar la velocidad con un sistema de caché

No soy muy amigo de los sistemas de caché, pero este artículo no podía estar completo sin mencionarlos, evidentemente.

Ya sabrás en qué consiste: un sistema de caché coge todos esos archivos PHP que tienen que realizar consultas a la base de datos y ser interpretados por el servidor y los convierte en archivos HTML estáticos, mucho más rápidos de servir pero, claro, perdiendo todas las ventajas que PHP otorga.

WP Super Cache

Plugins de caché hay muchos. Muchísimos. Pero en fin, por quedarme con uno elegiría WP Super Cache por su sencillez y su eficacia.

Eso siempre y cuanto tu web no esté implementada en un multisitio bajo WordPress, ya que WPSC es incompatible con esa funcionalidad. Si es tu caso puedes utilizar WP Super Cache, que además es de Automattic, la empresa detrás de WordPress.com.

Unos últimos consejos

Ahí tienes esos cuatro plugins que, sin duda, te ayudarán a arañar unas décimas de segundo en la carga de tu sitio, y uno (el primero) que te ayudará a encontrar a algunos de los culpables en caso de que tengas problemas de velocidad de carga.

Pero ojo, no se trata de ponerse a instalar los plugins para intentar resolver problemas de velocidad. Si tu web es lenta, deberías encontrar la causa y actuar sobre ella. De nada servirá hacer un lazy load de las imágenes o minimizar los estilos si tu plantilla tarda ocho segundos en cargar.

La optimización de la velocidad de carga o del rendimiento es más un proceso casi diría “artesanal” que de instalar plugins. Medir, localizar (el origen de un retraso en la carga, de datos que pesan mucho, de peticiones extra) y optimizar. Y vuelta a medir… El objetivo, es conseguir pasar de la imagen de la izquierda, a la de la derecha (caso real):

Si tienes un problema de velocidad de carga y no encuentras al responsable, no dudes en contactarme. Juntos podemos ver qué lo está causando y remediarlo de raíz, no mediante parches. Ya sabes que, como siempre, tienes a tu disposición el formulario de contacto.