OndaCero
Episodio 80: Córdoba Future 2024
OndaCero
Episodio 80: Córdoba Future 2024
El tiempo es el recurso más escaso en nuestras vidas. Siempre vamos con prisas porque hay cosas que hacer. Lo queremos todo lo antes posible, sin esperar y en tiempo record. Con las páginas webs ha pasado algo parecido. Cuánto más tarda en cargar una página web, menos visitas obtendrá el site. Esto es un hecho y siento decirte que tienes que aceptarlo.
Tras detectar esta tendencia y, como respuesta expresa a la misma, nació el concepto del Web Performance Optimization u Optimización de Rendimiento Web (más conocido por las siglas WPO). El WPO hace referencia a una serie de técnicas destinadas a mejorar la velocidad de carga de una página web logrando una mejor experiencia al usuario.
A su vez, la velocidad de carga es uno de los principales factores que contempla Google al posicionar una web debido al Crawl Budget (o presupuesto de rastreo). Pero, ¿qué es eso del Crawl Budget?
Aunque parezca una locura, los recursos de Google no son infinitos (no son Disney que parece dispuesta a dominar el mundo XD). Por este motivo, Google asigna a sus robots un tiempo determinado para rastrear cada sitio web en función a la autoridad, accesibilidad, calidad y velocidad de cada sitio y, dependiendo de estos factores, Google determinará más o menos tiempo a dicho proceso. De ahí la importancia de la velocidad de carga de una web.
Para mejorar la velocidad de una página, es necesario acometer una serie de aspectos a implementar o decidir y que mejor encajen con el proyecto. Estos son los principales.
Como si de un buen vino se tratase, hay que tener claro dónde quieres sembrar las uvas. El primer paso es elegir correctamente el servidor que alojará la web. De igual forma, hay que revisar las características de la página eligiendo un servidor acorde donde alojarla. Lo primero es lo primero, ¿dedicado o compartido? Un servidor dedicado ofrece mejor resultado que uno compartido.
No obstante, según las visitas que esperas para la página web puede resultar un poco como matar moscas a cañonazos y un buen servidor compartido puede dar un buen resultado.
En cuestión de hardware debes revisar el disco duro que aportado (espacio, formato SSD y otros), la tasa de transferencia que asignada, la RAM del mismo, etcétera.
En términos de software se recomienda hacer especial hincapié en 2 puntos:
Siempre es recomendable trabajar sobre las últimas versiones estables de PHP debido a que proporciona más seguridad y velocidad. No obstante, si nuestro proyecto no lo permite deberemos utilizar la última versión posible.
Es recomendable NGinx. Su uso nos da una mayor velocidad que Apache, aunque lo más extendido es éste último y puede darnos el suficiente rendimiento como para optimizar una web.
Lógicamente cuánto menos pese la web más rápido cargará. Por este motivo, es clave que los recursos estén lo más optimizados posibles. A saber:
Tras aplicar estas recomendaciones podremos enfocar nuestros esfuerzos en el siguiente punto a considerar.
Es imperativo que una web tenga una caché de página adicional a la caché que proporcione el propio servidor (OPCache). Sirve más rápido todos los recursos de nuestra web. Normalmente esta caché depende mucho desde si utilizas un CMS (como por ejemplo WP, Magento, Prestashop) donde existen plugins que se encargar de esta funcionalidad, hasta si posees una aplicacion personalizada basada en algún frameworks (como Láravel, Symphony), donde elementos específicos suplen este cometido.
CDN
Por último, pero no por ello menos importante, está el Content Delivery Network o Red de Entrega de Contenidos, más conocido como CDN. Según Wikipedia, una red de entrega de contenidos:
…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
La propia definición lo explica pero, ¿qué nos reporta a nosotros implantar un CDN en nuestra web? La respuesta es sencilla: velocidad. Al tener repartida la web por toda esta red, la navegación es más rápida al acceder a la copia disponible más cercana a la ubicación del cliente.Existen varias opciones al contratar un CDN. Sin embargo, me centraré en dos:
Al considerar todas estas recomendaciones, el avance para conseguir una buena velocidad de carga para una página web será considerable pero, ¿cómo puedes medirla?
Existen varios sites para medir la velocidad de una web. Personalmente recomiendo tres por su utilidad y efectividad:
Con estas herramientas comprobarás todos los parámetros relacionados con la carga de nuestra web, destacando el Time to First Byte (o TTFB) que muestra el tiempo empleado por nuestro servidor para servir el primer byte de información.
Toda esta información está muy bien pero es bastante teórica. Ha llegado el momento de meterse en faena analizando la página de ExpacioWeb (sí, ésta que estás viendo). Se trata de un Wordpress en el que todas las imágenes subidas están optimizadas gracias a herramientas tales como TinyPNG o Compressor.io pero con una nota no muy alentadora en velocidad.
Más de 9 segundos en GTMetrix y una puntuación bastante baja en PageSpeed Insights, algo que parecía bastante difícil de remontar. No obstante, no estaban habilitadas la caché de página ni la caché de servidor. La compresión de los ficheros CSS y JavaScript tampoco era la mejor. ¡Había que ponerse las pilas!
Lo primero fue implementar una caché de página con el plugin WP Rocket que a su vez optimiza la carga de CSS y JavaScript. Este plugin aún siendo Premium es muy recomendable. Entre todas sus distintas opciones destaca que nos permite Lazy Load, una carga especial de imágenes para que aparezcan conforme se vaya haciendo scroll. Así como permitir la integración con cualquier CDN.
A su vez, habilité la caché de servidor así como el gzip junto a otras mejoras. Los resultados actuales hablan por sí solos:
La velocidad ha triplicado y la puntuación en PageSpeedInsights ha subido una barbaridad. Como ves, un tiempo de carga muy elevado es de las peores cosas que puede sufrir una web porque pierdes visitas, posicionamiento, clientes y usabilidad. No dejes que tus usuarios malgasten su tiempo esperando por tu web. Cómo dijo Teofrasto:
El tiempo es la cosa más valiosa que una persona puede gastar.
Web developer con más de 10 años de experiencia, siempre investigando para mejorar y descubrir nuevas tecnologías.
Se ha recibido un incentivo de la Agencia de Innovación y Desarrollo de Andalucía IDEA, de la Junta de Andalucía por un importe de 42.118,79 €, cofinanciado en un 80% por la Unión Europea a través del Fondo Europeo de Desarrollo Regional, FEDER para la realización del Proyecto de innovación de procesos u organización de EXPACIOWEB DIGITAL MARKETING SL con el objetivo del programa de apoyo a la I+D empresarial
He leído y acepto el Aviso Legal y la Política de Protección de Datos
Utilizamos cookies propias y de terceros para mejorar nuestros servicios y mostrarte publicidad relacionada con tus preferencias, mediante el análisis de tus hábitos de navegación. Puedes obtener más información, o bien conocer cómo cambiar la configuración, en nuestra página Política de Cookies