Cómo mejorar el rendimiento del sitio web - guía detallada de optimización

Optimizar una página web está estrechamente relacionado con la aplicación, en la mayoría de los casos. Sin embargo, hay algunos inconvenientes que pueden afectar igualmente a la mayoría de los sitios sean WordPress, Joomla! 3.x, Drupal, etc. Puedes encontrar detalles sobre estos problemas y cómo resolverlos en este artículo.

Leverage Browser Caching

Lo que hace la caché de un navegador es memorizar los recursos que éste ya ha cargado. Cuando un usuario va a otra página de tu web, y esta utiliza los mismos recursos que la anteriormente visitada (por ejemplo tu logo, archivos CSS, etc.), estos no necesitan ser cargados de nuevo.

Esto significa que el navegador no empezará una nueva conexión para hacer la búsqueda de esos recursos, al contrario, los cargará desde la caché local. Esto se debe a que el navegador ya los ha memorizado y guardados. Esto es muy útil para la velocidad de carga de la web ya que cuando usas el “leverage browser cache”, los archivos necesarios se guardan localmente.

Esta función está activa por defecto en nuestros servidores.

Compresión gZIP

gZIP disminuye el tamaño de los datos que están siendo transferidos entre el servidor y tus visitantes comprimiendo las imágenes y los archivos JavaScript. Cuando el navegador del usuario recive el elemento comprimido, lo descomprime antes de presentarlo. Esto reduce significativamente el tamaño de la información que se está transfiriendo y así mismo el tiempo que toman las webs en cargar.

gZIP está activado por defecto en todos nuestros servidores.

Usar la versión más reciente disponible de PHP

Las versiones más recientes de PHP otorgan mejoras de rendimiento y por ende, siempre es recomendable utilizar la última disponible para tu web. Puedes cambiar fácilmente la versión PHP de tu sitio, desde Desarrolladores > Gestor PHP.

Una imagen escalada es aquella cuyo tamaño ha sido reducido para igualarse al tamaño en el que será mostrada. Evitar usar imágenes más grandes de lo que se necesita. Esto no es eficiente dado que los navegadores tendrían que descargar una imagen grande para luego convertirla al tamaño necesario. Por ejemplo, si tienes una imagen que es mostrada a 40×40 en tu sitio, no hay necesidad de tener un archivo de 400×400. Asegúrate que el tamaño del archivo haya sido reconvertido a la dimensión en la que se mostrará.

Diferir el análisis de las líneas de JavaScript

Esto significa que tus archivos JavaScript deben ser movidos de la parte del ENCABEZADO del HTML al final del mismo, justo antes de cerrar la etiqueta HTML. Haciendo esto, permites que todo el resto del contenido sea cargado en el navegador antes de los archivos JS, lo que hará que tu sitio se vea mucho más rápido.

Minimizar archivos CSS y JS

Minimizar los archivos CSS y JS significa que todos los datos innecesarios que tengan como doble espacio, líneas nuevas vacías, comentarios, etc., serán removidos del archivo disminuyendo su tamaño. Esto hace que la cantidad de información que necesita ser transferida al navegador de tu visitante es menor, y la web cargará más rápido.

Para WordPress puedes usar el plugin Speed Optimizer para activar fácilmente la función de minimizar elementos CSS y JS.

Usar una red de entrega de contenidos (CDN por sus siglas en inglés)

Cargar tu contenido a través de una CDN va a reducir tanto el tiempo de carga del servidor y el tiempo de carga del sitio. Las redes de entrega de contenido (CDN) son redes de servidores que clonan tu sitio en todos sus nodos de ubicación. Esto significa que cuando tus visitantes soliciten tu sitio, será atendido por la ubicación del servidor más cercana, en lugar de la ubicación de tu servidor. Hemos desarrollado un servicio CDN interno para nuestros clientes y habilitarlo en tu sitio web es un proceso bastante fácil, solo necesitas habilitarlo a través de tu Site Tools. También tenemos un artículo sobre cómo habilitar CDN aquí.

Evitar las cadenas de redirección

Una cadena de redirección ocurre cuando hay más de una redirección entre la URL inicial y la de destino. Tener más de una redirección entre las URLs adicionalmente hará que se haga más lenta la web y se alarguen los tiempos de espera.

En la mayoría de los casos, tales cadenas ocurren cuando hay una del dominio sin www al dominio con www (ambos sin HTTPS), y luego otra redirección del dominio sin HTTPS www al dominio HTTPS y www. Lo mejor que se puede hacer es combinarlas y luego crear una sola redirección del dominio sin HTTPS sin www (http://dominio.com) al dominio HTTPS www (https://www.dominio.com).

Evitar errores HTTP

Si tu página web carga una URL con errores 403, 404, 500, 503 o algún error HTTP, puede hacer mucho más lenta la carga de la totalidad de la web. Tu web intentará cargar el recurso con la falla por un cierto período de tiempo hasta recibir finalmente una respuesta de error. Podrías verificar si tu web tiene tales links en la pestaña de Red de la consola tu navegador preferido o usando una herramienta de prueba de velocidad. Por ejemplo – con GTmetrix puedes verificar los recursos en la pestaña Waterfall, y en Pingdom – en la sección Response codes.

Evitar páginas iniciales de gran tamaño

Tener una página de inicio grande puede impactar mucho en la velocidad de carga de tu sitio web. Por ende, asegúrate de mantener únicamente los recursos necesarios y como se comenta anteriormente – usar imágenes escaladas y bien optimizadas. Otro consejo para mantener la página optimizada es añadir videos “embed” desde un recurso externo (como YouTube), en lugar de cargarlos directamente desde tu web.