En este post no vamos a hablar de como tunear el apache para que cargue más rápido, ni de como modificar el htaccess para que cachear assets e imágenes, ni siquiera vamos a hablar de Varnish o de niveles de caché. Vamos a hablar de todo lo que rodea a la optimización web, del entorno que tenemos alrededor de nuestra web y que es necesario tener en cuenta para optimizar la carga de nuestro sitio web.
Tanto si trabajamos con un ecommerce y lo que queremos son más ventas, como si lo hacemos con un blog y lo que queremos son más visitas o mejorar nuestro sea, es necesario tener unos tiempos de carga pequeños y para ello no solo tenemos que fijarnos en nuestro servidor web, sino en todo lo que lo rodea.
¿Has comprobado la velocidad de carga de tu web? Seguro que ya has pasado por gmetrix o por pagespeed insights y te has dado cuenta de que uniendo los css en uno solo o minimizando los archivos javascripts ganamos bastante performance. Pero no solo eso es importante, muchas veces tenemos mejoras visuales (cargar el contenido antes que los css por ejemplo) con las que no ganamos velocidad de carga pero si ganamos velocidad de percepción. Esta velocidad es importantísima a la hora de convertir a usuarios en clientes o a primeros usuarios en usuarios recurrentes.
¿Para qué optimizar?
La respuesta a esta pregunta es sencilla, para reducir el tiempo de carga. Pero quedarnos solo en esa respuesta sería simplista. No solo es reducir el tiempo de carga, también mejora el SEO, ya que Google ha admitido que su algoritmo de posicionamiento tiene en cuenta la optimización de la web y el tiempo de carga.
Además no solo por SEO, sino que mejorando los tiempos de carga conseguiremos vender más si tenemos un ecommerce, conseguiremos más visitas si tenemos un medio de comunicación online y como hemos dicho antes conseguiremos mejor posicionamiento en nuestra web.
Del mismo modo con mejoras en la percepción conseguiremos que nuestro sitio parezca más rápido y además podremos sacar el máximo rendimiento a las máquinas que tenemos, incluso si hacemos una buena optimización podremos ahorrar en maquinas, ya que quizás ganemos tanto que podamos mudarnos a una instancia más pequeña.
¿Qué debemos tener en cuenta?
Hosting
Navegando por la web podemos encontrarnos muchísimas empresas de hosting, lo ideal es comparar y fijarnos cual nos ofrece mayor ancho de banda o menos limitaciones de tráfico,…
Analizar como son sus planes de administración, cual es la versión por defecto de PHP (si es 5.3 pero con habilitando nosequé, se pasa a 7,… yo elegiría otro hosting), preguntar por los backups, cuando se hacen, como y una vez que tengamos el hosting pedir que restauren los backups en la maquina de preproducción una vez cada 15 días o así. Con esto conseguiremos no solo trabajar con los datos más reales posibles, sino que nos estaremos cerciorando de que los backups funcionan a la perfección.
También, a mi me gusta fijarme en la atención al usuario, si nos resuelven las dudas que tengamos de manera sencilla,… o donde están físicamente los servidores. Aunque pueda parecer un poco paranoia, es importante conocer donde están los servidores, ay que si nuestros usuarios son locales, es decir tenemos una tienda online que en un primer momento solo vende en España, no tendría mucho sentido contratar un hosting en India, por muy económico que fuera.
Servidor
El típico problema de un desarollador es «en mi ordenador funciona», ahora no tenemos excusa, podemos utilizar Vagrant, Docker, o lo que queramos para tener las mismas versiones en de los componentes en donde sea. Por ello es importante tener apuntadas que versiones de todo están en nuestros servidores, un Excel con la versión exacta de Debian, la versión de NGINX, la versión de PHP, la versión de todo y mantener el Excel actualizado, así nos será más fácil provisionar las máquinas de preproducción y nuestro Docker con todo lo necesario para que no tengamos «ese típico problema» de en mi ordenador funciona.
Del mismo modo debemos tener en cuenta los archivos que siempre se ejecutan, por ejemplo con WordPress el htaccess es un fichero muy especial y lo ideal es tenerlo limpio, ordenado y lo más pequeño posible.
Logs
Cuando tenemos un problema en algún sitio de nuestra aplicación siempre recurrimos a los logs, pero ¿son todos los logs necesarios? ¿todos deben ser errores? ¿warnings? ¿Si logs logs dejan de funcionar deja de funcionar el sistema? ¿Se leen o son «print_r» a loco?
Tamaños
Todas nuestras páginas web tiene CSS y Javascripts y por ello es importante darles un poco de cariño, minimizarlos, combinarlos y hacer cuentas. Me explico, si tenemos un archivo de JS, por ejemplo de validación de un formulario, este archivo ocupa muy poco 5Kb y lo cargamos en todas las páginas, pues estaremos haciendo que páginas que no deberían pesar nada, pesen 5Kb más.
Lo mismo pasa con las imágenes si tenemos que nuestro tráfico es un 60% a través del móvil, pues poner imágenes de 4K con 3Mb cada imagen hará que nuestros usuario gasten su tarifa de datos en menos de un día. Analizar nuestro sitio usando las herramientas de desarrollador es crucial.
Resumen
No solo el código de nuestra aplicación es importante, es cierto que debemos tener tests, ejecutarlos frecuentemente, debemos aprender patrones de diseño y aplicarlos cuando sea necesario. Pero no debemos olvidar todo lo que rodea a una aplicación web. Es necesario tener en cuenta las máquinas, el proveedor de hosting, las versiones instaladas,… porque todo ello suma a la hora de mejorar la performance de nuestra web.
El WPO (Web Performance Optimization, o lo que es lo mismo optimización de rendimiento web) sí, pero creo que es mucho más importante tener sentido común y analizar nuestra aplicación web dando un paso atrás y no centrándonos tanto en el código, o la el servidor, sino viendo todo el conjunto. Y para conseguir todo esto no hay más que medir, medir y medir para tener datos suficientes en los que basarnos para tomar las decisiones con la mayor información posible.
Imagen: a close success
Jesús L.C. - Apuntes de un aprendiz 