Lo prometido es deuda. La semana pasada te contaba cómo optimizar tu web o blog para mejorar su velocidad de carga paso a paso y te prometía que en el próximo post explicaría cómo reducir el tiempo de carga de WordPress con dos ejemplos reales.

Este post se compone de dos partes:

  1. ¡Optimiza tu web o blog! Cómo mejorar la velocidad de carga de WordPress
  2. Cómo reducir el tiempo de carga de WordPress (2 ejemplos reales) 

En el primer post me centraba en los factores que afectan en la carga de un sitio web, las herramientas para medir su velocidad, los plugins que utilizo para reducir el tiempo de carga de WordPress y en cómo comprimir imágenes para disminuir su peso y tamaño.

Hoy me toca poner en práctica todos esos consejos y herramientas, en concreto en los blogs de dos de mis clientas, para qué veas cómo funciona el proceso completo de optimización de WordPress.

Por lo tanto, te voy a explicar paso a paso los plugins que voy instalado, la velocidad de carga con cada una de las acciones y especialmente los resultados finales tras todo el proceso.

Además, he seleccionado dos proyectos que requieren de una gran cantidad de imágenes en sus posts: un blog de moda y otro de viajes.

 

Reducir el tiempo de carga de WordPress (ejemplo 1): Cuélate en mi vestidor


Cuélate en mi vestidor es un blog de moda, streetstyle y nuevas tendencias. Como puedes imaginar, en ese tipo de blogs las imágenes son fundamentales y en cada una de sus entradas su autora sube una media de diez.

cuelateenmivestidor.com

De modo que ¡empezamos!

 

1. Datos antes de la optimización

Reducir el tiempo de carga de WordPress (ejemplo 1): Cuélate en mi vestidor

Analizando los primeros datos que muestra Pingdom, puedes ver que los resultados no son del todo malos:

  • Grado de rendimiento: 68 de 100 (según el nivel de rendimiento de Google PageSpeed).
  • Tiempo de carga: 3.50 segundos. Una cifra que considero alta. Todo lo que esté por encima de 3 segundos hay que intentar reducirlo.
  • Tamaño de la página: 5.2 MG.
  • Solicitudes a servidores externos: 143 llamadas.

 

2. Plugins que tiene instalados el blog

Ahora es el momento de revisar qué plugins tiene instalados el blog antes de la optimización:

  1. Aviso de Cookie
  2. CPO Shortcodes
  3. Force Regenerate Thumbnails
  4. Optimize Database after Deleting Revisions
  5. Redux Framework
  6. Smooth Scroll Up
  7. W3 Total Cache
  8. WP Google Fonts
  9. WP Instagram Widget
  10. WP Smush
  11. WP-SpamShield
  12. Yoast SEO

En total, 12 plugins instalados. En realidad no es una cifra alta.

¿Qué datos arroja el análisis de los plugins instalados?

En primer lugar, que cuando diseñé el blog, ya dejé instalado algún que otro plugin para reducir el tiempo de carga de WordPress, como WP Smush y Optimize Database after Deleting Revisions.

En segundo lugar, que hay plugins como WP Instagram Widget o WP Google Fonts, que son los que realizan muchas solicitudes a otros servidores.

Y en tercer lugar, que hay algunos que vamos a sustituir, como es el caso de W3 Total Cache.

 

3. Instalación de WP Rocket

Lo primero que hago es desactivar y eliminar W3 Total Cache para sustituirlo por WP Rocket para la optimización de los archivos HTML y las Google Fonts.

Reducir el tiempo de carga de WordPress (ejemplo 1): Cuélate en mi vestidor

Hecho esto, vuelvo a analizar el blog con Pingdom y ya puedes ver cómo he conseguido reducir el tiempo de carga de WordPress casi un segundo.

 

4. Instalación de BJ Lazy Load

El siguiente paso es instalar el plugin BJ Lazy Load para que las imágenes carguen bajo demanda (carga perezosa), es decir, que no carguen hasta que el usuario vaya desplazándose por la página y necesite visualizarlas.

Reducir el tiempo de carga de WordPress (ejemplo 1): Cuélate en mi vestidor

Tras instalar este plugin, analizo de nuevo la página y ahora puedes ver como el tiempo de carga ha bajado un poco más, hasta los 2.28 segundos.

 

5. Instalación de WP-Optimize

Es el momento de llevar a cabo optimización de la base de datos, limpiar las revisiones de entradas antiguas o eliminar los comentarios de la carpeta spam con el plugin WP-Optimize.

Reducir el tiempo de carga de WordPress (ejemplo 1): Cuélate en mi vestidor

Y tras estas acciones, el resultado es…

Reducir el tiempo de carga de WordPress (ejemplo 1): Cuélate en mi vestidor

Por lo tanto, el tiempo de carga ahora mismo está en 2.17 segundos y todavía me queda una acción por ejecutar.

 

6. Instalación de WPO Alejandro Novás

Para terminar, instalo el plugin WPO para reducir las cadenas de código sobrantes.

Vuelvo a analizar el blog y ya he acabado el proceso completo de optimización para reducir su tiempo de carga.

 

7. Resultado final

Reducir el tiempo de carga de WordPress (ejemplo 1): Cuélate en mi vestidor

En resumen, tras todo este proceso he conseguido reducir el tiempo de carga de WordPress de forma muy considerable, pasando de los 3.50 segundos iniciales hasta los 1.95 de ahora.

Además, ha mejorado el rendimiento de Google PageSpeed, pasando de 68 a 73, se ha reducido el tamaño de la página en 1MB y ha descendido el numero de peticiones a otros servidores (de 143 a 117).

 

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers


Pekebikers es el blog de Ana y Laura, dos mamás que comparten experiencias viajeras con su público, otros papás con hijos, a los que dan consejos y recomendaciones para viajar con bicicleta y en familia.

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers

¡Empezamos!

 

1. Datos antes de la optimización

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers

Los primeros datos de Pingdom muestran que los resultados tampoco son del todo malos:

  • Grado de rendimiento: 88 de 100 (según el nivel de rendimiento de Google PageSpeed).
  • Tiempo de carga: 2.61 segundos. También, es mejorable, pero aceptable para ser un blog prácticamente sin optimizar.
  • Tamaño de la página: 5.4 MG, un peso considerable.
  • Solicitudes a servidores externos: 204 llamadas, un número que hay que intentar bajar.

 

2. Plugins que tiene instalados el blog

Aquí puedes ver los plugins que tiene instalados este blog antes de la optimización:

  1. Akismet Anti-Spam
  2. Aviso de Cookie
  3. BackWPup
  4. CPO Shortcodes
  5. Instagram Feed
  6. Monarch Plugin
  7. TinyMCE Advanced
  8. WP Rocket
  9. WP Smush
  10. Yet Another Related Posts Plugin
  11. Yoast SEO

Un total de 11 plugins, una cifra pequeña.

Como puedes ver, ya dejé instalados un par de plugins para reducir el tiempo de carga de WordPress cuando rediseñé el blog hace unos meses (WP Rocket y WP Smush). Después te cuento más sobre esto.

 

3. Compresión de las imágenes

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers

La primera tarea que realizo para reducir el tiempo de carga de WordPress es comprimir con WP Smush las imágenes pendientes, en este caso 32.

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers

Una vez comprimidas esas 32 imágenes, vuelvo a analizar el blog con Pingdom y ya se ha reducido un poco el tiempo de carga: de 2.61 a 2.39 segundos.

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers

 

4. Plugins de caché

Llegados a este punto, quiero hacer una prueba (más aún).

En concreto, voy a desactivar WP Rocket, para que veas como el tiempo de carga se dispara hasta los 6.05 segundos.

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers

Ese era el tiempo de carga medio (incluso mayor) cuando hice el rediseño del blog hace unos meses.

Como no podía dejar esa espantosa cifra y entregarle así el blog a las clientas, instalé WP Rocket.

Antes de pasar al siguiente paso, una prueba más.

Ahora vuelvo a activar WP Rocket e instalo también BJ Lazy Load, que es como lo tengo configurado en este blog y lo que he hecho en el primer ejemplo:

  • WP Rocket para la optimización de los archivos HTML y las Google Fonts.
  • BJ Lazy Load para la carga de las imágenes

Y el resultado es…

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers

Con la combinación de estos dos plugins ¡el tiempo de carga vuelve a aumentar!

Es decir, la combinación que me funciona muy bien en este blog, no sirve para un blog que tiene una cantidad de fotografías mucho mayor.

Entonces, vuelvo a desinstalar BJ Lazy Loady dejo WP Rocket como único plugin de caché para todos los tipos de archivos.

 

5. Instalación de WP-Optimize

Después de los jueguecitos con los pugins de caché, es el momento de limpiar y optimizar la base de datos, para lo cual instalo en plugin WP-Optimize.

Tras optimizar las tablas de la base de datos, limpiar todas las revisiones de entradas, limpiar la papelera de posts, los comentarios spam o los pingbacks, el tiempo de carga se ha reducido más.

Recuerda desactivar este plugin, pues recomiendo activarlo siempre que quieras optimizar tu base de datos y volverlo a desactivar cuando lo hayas hecho.

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers

Ahora ha pasado de 2.39 a 2.23 segundos.

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers

 

6. Instalación de WPO Alejandro Novás

Por último, instalo el plugin WPO de Alejandro Novás para eliminar las cadenas innecesarias de código.

Reducir el tiempo de carga de WordPress (ejemplo 2): Pekebikers

 

7. Resultado final

El blog ha pasado de 2.61 a 1.90 segundos, por lo que se ha cumplido el objetivo de reducir el tiempo de carga de WordPress.

También hay que tener en cuenta que ya estaba instalado WP Rocket antes del análisis, y que, cuando lo he desactivado, la velocidad de carga se ha disparado a más de 6 segundos.

Aprende a reducir el tiempo de carga de WordPress con 2 ejemplos reales - TWEET

Hasta aquí estos dos ejemplos reales para enseñarte cómo reducir el tiempo de carga de WordPress. Espero que te haya sido muy útil y consigas mejorar la velocidad de tu web o blog 😉

Pin It on Pinterest

Share This