Tras la última remodelación de mi web y aprovechando el hecho de que está corriendo sobre un VPS empecé a investigar y aplicar distintas técnicas WPO (Web Performance Optimization) que me permitieran aumentar la velocidad del site en WordPress.

Optimización de Apache

Hablaré en este caso de Apache pues es el servidor web que utilizo. Cuando se tiene acceso a la configuración del servidor web podemos ajustar mejor su funcionamiento de acuerdo a nuestras necesidades y el tipo de máquina que disponemos. En el caso de un VPS aunque suelen tener un buen rendimiento según nuestro plan contratado tendremos más o menos potencia. Debemos de tener siempre en mente que debe de primar la velocidad y para ello deberemos de reducir el gasto de memoria al mínimo y tener muy claro cual es el tráfico que soporta nuestro servidor.

Módulos

Para optimizar el funcionamiento de Apache una de las primeras tareas a realizar es deshabilitar los módulos de Apache que no vayamos a utilizar para ahorrar recursos. Podemos obtener un listado de los módulos funcionando con el comando apache2ctl -M desde consola. Debereis de estudiar cuales son los módulos que tenéis cargados y cuales podrías deshabilitar. Tened en cuenta que puede que estéis corriendo otros sitios web que utilizan otros lenguajes o módulos.

Por ejemplo, si no utilizais CGI, Pyhton, etc podéis deshabilitar dichos módulos. Si quereis conocer qué módulos son los necesarios para ejecutar WordPress aquí tienes un buen enlace en el que comenzar: Minimum Apache modules required for WordPress.

Te recomiendo que comiences deshabilitando módulos e ir probando las diferencias de rendimiento cada vez que desactives uno. Y sobre todo comprueba que funcione correctamente.

Módulo pagespeed

Naturalmente si estás utilizando algún tipo de caché en tu servidor deberás de habilitar los módulos necesarios como mod_cache y mod_memcache (por ejemplo). En mi experiencia propia he de decir que comencé utilizando plugins de caché como Supercache o W3 Total Cache en mi propia página. Estos módulos hacen un magnífico trabajo en los siguientes aspectos:

  • Gestión de caché de páginas, objetos y consultas en conjunción de módulos de apache como mod_cache y mod_memcache.
  • Minificar código HTML, CSS y JS
  • Compresión de páginas
  • Soporte de CDNs (hablaremos más adelante)
  • Optimización de cabeceras (headers) y tiempos de expiración

Sin embargo una vez tienes la posibilidad de trabajar a un nivel más bajo en tu propio servidor os recomiendo utilizar un módulo como PageSpeed. PageSpeed es un módulo desarrollado por Google tanto para Apache como para servidores web Nginx. En un sólo módulo de Apache automáticamente se aplican la mayoría de las optimizaciones de código que nos proveen los plugins más populares en WordPress.

¿Pero cual sería la ventaja? Es muy sencilla. Cuanto más arriba realicemos una tarea, en este caso optimización, más costosa y lenta será dado que se realiza en un lenguaje o capa de más alto nivel. Al contrario, si realizamos una tarea a un nivel más bajo la operación será más rápida. Si hablamos de servicios web y dejamos al módulo PageSpeed esta tarea no deberá de realizarla muchas capas más arriba nuestra instalación de WordPress y PHP. De este modo nos evitamos utilizar ningún plugin de optimización en WordPress.

Su instalación y configuración es extremadamente sencilla. Os invito a probarlo sino lo conoceís. Simplemente con activarlo en Apache ya estará funcionando y optimizando las páginas que sirva vuestro servidor web. Todas ellas, dado que es un módulo operativo para todas las páginas.

Optimizando los procesos de Apache

En general los VPS o servidores dedicados suelen utilizar una configuración de base pensada para dar servicio a bastantes clientes a la vez. Sin embargo según el número de visitas simultáneas que reciba nuestra página es más que probable que podamos reducir el número de procesos y memoria utilizada por Apache.

¿Por qué es tan importante esta configuración? Por la sencilla razón de que un servidor sobredimensionado será mucho más lento en dar respuesta y comenzar el envío de datos. En mi caso esta es la configuración en apache2.conf que según las pruebas que he realizado y las visitas recibidas en mi caso esta es la que me permite una mayor velocidad de respuesta.

    StartServers          3
    MinSpareServers       3
    MaxSpareServers       5
    MaxClients            30
    MaxRequestsPerChild   0

Os dejo un par de enlaces que os permitirán ampliar esta información y cómo mejorar el rendimiento de Apache: How to optimize Apache for WordPress? y más genérico How To Optimize Apache Web Server Performance

Optimización de imágenes

Aunque puede parecer que este apartado está más que superado (y no sea sobre optimización de servidores) me parece importante seguir insistiendo en el hecho de existen técnicas que nos pueden hacer reducir el tiempo de carga de las imágenes espectacularmente. O utilizar otras técnicas que evitan el uso de imágenes.

  • Utilizar el formato adecuado. Aunque pueda parecer repetitivo, pero por favor. Optimizar vuestras imágenes a un formato (PNG, GIF, JPG) adecuado para la web. Y por supuesto con un porcentaje de calidad adecuado. No hacemos nada si utilizamos imágenes JPG con un perfil optimizado a 100 o con una resolución inadecuada. Cuidemos eso por favor. Un plugin muy interesante es EWWW Image Optimizer.
  • CSS Sprites. Si vamos a utilizar un número elevado de imágenes de pequeño tamaño y similares características (estoy pensando en logotipos de ropa, coches, bebidas, etc) en una tienda electrónica. ¿Cuanto podríamos ahorrar en los tiempos de carga si para esos logotipos utilizamos sprites?
  • Webfonts. Sin lugar a dudas mi solución favorita en el caso de utilizar logos, redes sociales, etc. Sabemos que existen algunas muy famosas como FontAwesome. Sin embargo no olvidemos que con unos pocos conocimientos de diseño gráfico podemos realizar nuestras propias webfonts , optimizadas para nuestro site.

Utilización de CDNs

Según Wikipedia un CDN (Content Delivery Network en inglés) es una red superpuesta de computadoras que contienen copias de datos, colocados en varios puntos de una red con el fin de maximizar el ancho de banda para el acceso a los datos de clientes por la red. Si bien los consejos de este apartado se pueden aplicar a cualquier instalación de WP, incluso servidores compartidos, me gustaría tratarlo ya que su implementación libera enormemente de tarea a nuestro servidor.

Hoy en día en servicios web es muy frecuente realizar la carga de recursos estáticos de forma distribuida. Recordemos que cuando conectamos a un servidor web tenemos un número limitado de conexiones simultáneas por lo que se da una situación de cuello de botella. Tenemos más peticiones de recursos de la que podemos gestionar simultáneamente por lo que debemos de establecer turnos.

Esto se reduce sensiblemente utilizando para ello CDNs para la carga de librerías JavaScript como jQuery, la carga de las webfonts desde un proveedor como Google Fonts, ficheros CSS, etc.

Por supuesto las imágenes tienen un lugar destacado en este apartado y que no he mencionado previamente. Cualquier web hoy en día tiene un importante contenido gráfico y que generalmente es el más costoso de descargar. Por ello es prioritario configurar un espacio en un CDN donde albergar estos ficheros.

En mi caso utilizo CloudFront de Amazon el cual tiene un rendimiento muy notable y me permite mantener unos tiempos de carga realmente bajos. Simplemente todo el contenido multimedia de mi página en WordPress es subido y se sirve desde el espacio de Amazon. Si estás interesado deberás utilizar el plugin Amazon S3 and Cloudfront te ayudará en la tarea.

En este interesante tutorial podrás configurar tu WordPress para el uso con CloudFront: How To Use Amazon S3 And Cloudfront With WordPress

Pero no sólo utilizo un CDN para almacenar mis ficheros más pesados en la nube y servirlos más rapidamente. También utilizo otro CDN, en este caso CloudFlare, para optimizar todo aquello que se me puede escapar, servir como cortafuegos a ciertos ataques, etc. Aquí podéis comprobar algunas de sus características.

El servicio básico de CloudFlare ya provee de búsquedas por DNS más rápidas, optimización de código (minimización, caché de contenido, etc), mejoras en seguridad. Y además el cambio es muy sencillo. Simplemente cambiando las DNS de nuestro site en 24h nos encontraremos detrás de CloudFlare.

Uso de plugins y temas

Si hay algo que me dejaron muy claro cuando empecé a investigar en WordPress es lo siguiente: si quieres que algo sea rápido en WP hazlo tú. La verdad es que intento no utilizar apenas plugins, pues enlentecen enormemente el rendimiento de la web. Así que quita todo aquello que no necesites y si necesitas algo intenta primero realizarlo por tí mismo con alguna función sencilla de PHP en tu functions.php investigando en el Codex WP

En el caso de los temas lo mismo. En mi caso utilizo roots.io (ahora Sage) Es un completo starter theme para WordPress que con unos algunos conocimientos de PHP y Bootstrap permite construir sites bastante optimizados pues permite personalizar los componentes de Bootstrap, así como el empleo de LESS, uso de Grunt, etc.

Optimización de MySQL para WordPress

De cara al uso normal de WP en un servidor compartido recomiendo la instalación de algún plugin como WP-Optimize que permite borrar el contenido de borradores, vaciar papeleras y optimizar nuestra base de datos para el rendimiento óptimo.

En el caso de la optimización del servidor MySQL la verdad es que existen numerosos tutoriales de optimización y realmente es un procedimiento costoso y depende mucho de la máquina y el uso de la Base de Datos. En mi caso esta es la configuración que utilizo en my.cnf para el caché de consultas en un VPS con 2GB:

query_cache_limit       = 16M
query_cache_size        = 256M

Conclusión

Como podeís ver la optimización de un site con WordPress no sólo finaliza con la instalación de un par de plugins. Sobre todo si tenemos la oportunidad de trabajar varios niveles más abajo operando con Apache y MySQL. Espero os resulte de utilidad y sobre todo me podais corregir y/o descubrir nuevos modos de optimización.

Enlaces

Comparte si te ha gustado

Autor:
Última actualización:

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.