Repasamos las principales herramientas para analizar el rendimiento de un sitio web

Para los desarrolladores que nos preocupamos por el rendimiento de nuestros proyectos web (que somos todos, la verdad), vamos a ver en este artículo cómo realizar un análisis completo y detallado del correcto funcionamiento de un site, algo que repercute en la Experiencia de Usuario y, por tanto, en su Posicionamiento Web. Para ello, nos apoyaremos en diversas herramientas con funcionalidades que nos permitirán analizar la carga y rendimiento de los sitios que gestionamos.

Desde hace tiempo sabemos que el rendimiento es uno de los criterios que sirven para ordenar los resultados en motores de búsqueda como Google. El buscador enviará más usuarios a los sitios que ofrecen una mejor experiencia de uso y la velocidad de carga es uno de los factores más importantes. Sólo por este motivo, merece la pena revisar periódicamente el rendimiento de cualquier página web.

Herramientas de análisis de rendimiento

El recurso más importante que podemos usar para analizar el rendimiento son las herramientas de análisis. Son muy interesantes porque nos ofrecen reportes con cantidades enormes de criterios interesantes. Pero lo más importante es que, cuando el sitio analizado no se encuentra optimizado para ese criterio, nos ofrece una pequeña guía para solución su correspondiente y optimización.

Es decir, estas herramientas no tratan de sacarnos los colores cuando algo va mal, sino que intentan ofrecer guías para mejorar su funcionamiento . Existen muchas herramientas de este estilo en la web, la mayoría completamente gratuitas. No hace falta usarlas todas, porque al final son un poco redundantes. Las más destacables son estas:

• Lighthouse.  Google nos ofrece una de las principales herramientas para analizar el rendimiento de un sitio web. Lighthouse es una extensión para Chrome. Una vez instalada se crea un icono en el navegador que nos sirve para lanzar el análisis de rendimiento del sitio visitado.
  Lo más interesante de Lighthouse es que nos ofrece muchos criterios, no solamente de rendimiento, sino de otros factores como buenas prácticas, accesibilidad, optimizaciones englobadas en Progressive Web Apps o SEO.
  Podemos encontrar más información sobre cómo usar Lighthouse en el sitio de documentación para desarrolladores de Google. 

• WebPageTest. Otra herramienta bastante interesante para obtener más información sobre el rendimiento del sitio. Su aspecto es un poco rústico, pero lo importante es que nos ofrece información muy jugosa.
  En esta herramienta se otorga mucha importancia al denominado Waterfall (cascada en inglés), el gráfico que nos muestra cómo se van cargando los recursos de una web a lo largo del tiempo. Este gráfico es muy importante porque nos ayuda a entender qué recursos pueden resultar en un cuello de botella para la carga del sitio, pero además facilitan entender y visualizar los eventos más importantes que ocurren durante la carga: El inicio de la renderización del documento, el momento en el que el contenido es interactivo o el final de la carga, entre otros.
  Otra cosa interesante de WebPageTest es que realiza el análisis en varias repeticiones. Esto es clave para apreciar cómo funciona la configuración de cacheo de assets en una página web, pues una buena estrategia en este sentido produce que los siguientes accesos a la web sean mucho más rápidos que el primero.

• Webmaster Tools. No nos podemos olvidar de otra herramienta fundamental para obtención de datos sobre nuestra página. Son las herramientas para desarrolladores que existen dentro de cada navegador. En las distintas pestañas encontramos mucha información útil del sitio web, siendo especialmente importante en este caso la llamada Network o Red (dependiendo del idioma en que tengamos configurado el navegador). Aquí podemos saber cómo se realiza la carga de recursos y el tiempo que nos lleva, las cabeceras del HTTP, si el recurso estaba cacheado, etc.
  Otra ayuda muy interesante de la pestaña de Network es la posibilidad de variar de manera simulada las condiciones de red, haciendo que el navegador descargue recursos con más lentitud, como ocurriría en una red 3G por ejemplo. Técnicamente, esta herramienta se conoce como throttling. Desde aquí también podemos desactivar la caché del navegador, para saber cuánto tarda en cargar un sitio por primera vez y cada uno de sus recursos por separado.

En DYD SERVEIS INFORMÀTICS te asesoramos, te ayudamos y conseguimos sacar el máximo partido a tu página web. Contacta con nosotros!

Fuente: arsys.es