Una Prueba Minuciosa de la Herramienta Pingdom

Actualizado October 27, 2017

Hoy queremos sumergirnos en cómo usar y entender mejor los datos de la popular herramienta de prueba de velocidad de sitios web Pingdom. Usted puede utilizarla para hacer lo que llamamos un análisis de cascada de su sitio web de WordPress. Esto le ayuda a diagnosticar con mayor facilidad problemas de rendimiento y no hacer una diagnosis errónea. Vemos muchas veces que los usuarios de WordPress están malinterpretando los datos de la herramienta Pingdom y esto les conlleva a configurar a veces su sitio a un estado que era incluso peor que antes.

Conocer como @Pingdom funciona es información que no tiene precio para los dueños de sitios… Haga clic para Tweet

Pingdom

Pingdom es una empresa con sede en Suecia que ofrece servicios de supervisión del tiempo de actividad y servicios de gestión del rendimiento web. Probablemente una de las cosas que son más conocidas es su herramienta de prueba de velocidad de sitio web. Es una de las más populares herramientas de prueba de rendimiento en la comunidad de WordPress. ¿Por qué? Bueno, para empezar es muy fácil de usar! No todo el mundo es un experto en rendimiento web así para el usuario típico de WordPress, algunas de las otras herramientas alternativas por ahí en realidad pueden ser bastante agobiante. A veces menos es más como dicen.

Herramienta Pingdom

Herramienta Pingdom

Pingdom le permite probar la velocidad del sitio web de cualquier sitio web desde 5 lugares diferentes:

  • Dallas, Texas, EUA.
  • Melbourne, Australia
  • New York City, New York, EUA.
  • San José, California, EUA.
  • Estocolmo, Suecia

La ubicación física que elija es realmente muy importante, ya que se refiere a donde su sitio web está en realidad alojado. Pero vamos a entrar en esto en más detalle a continuación.

Análisis de Cascada Mediante la Herramienta Pingdo

Una página web está formada por diferentes activos, como HTML, JavaScript, CSS e imágenes. Cada uno de estos genera solicitudes para procesar lo que ve en su sitio web. Normalmente, cuanto más solicitudes tenga, más lenta será su página web. Ése no es siempre el caso, pero es verdad en la mayor parte del tiempo. A continuación, vamos a dividir cada sección de la herramienta Pingdom y explicar más detalladamente lo que la información significa con respecto al rendimiento general de su sitio web y cómo hacer un análisis de cascada.

Resumen de Pingdom

Cuando ejecute su sitio web de WordPress a través de la herramienta Pingdom, este genera un grado de rendimiento, un tiempo de carga total, el tamaño total de la página y el número de solicitudes que tiene en su sitio web. En nuestro ejemplo estamos utilizando nuestro dominio de estudio de caso perfmatters.io, que está alojado en Kinsta. Como puede ver, ejecutamos nuestra primera prueba y calificamos un 100/100 en Pingdom y el tiempo de carga total es inferior a 900 ms. Según Pingdom, nuestro sitio web carga más rápido que el 92% de los sitios probados y también nos permite conocer el tamaño total de nuestros activos combinados y el número de solicitudes.

Pingdom test de velocidad antes de DNS

Pingdom test de velocidad antes de DNS

Después ejecutamos una prueba adicional y ahora nuestro tiempo de carga total es de 491 ms! ¿Qué es todo eso? Es posible que note esto también si está ejecutando su sitio web a través de la herramienta Pingdom varias veces. Una de las razones por las que esto ocurre es por la cache, tanto de DNS como de servidor. Descubra el porque más abajo en nuestro análisis de cascada.

Pingdom test de velocidad después de DNS

Pingdom test de velocidad después de DNS

¿Desea obtener una mejor puntuación de la herramienta Pingdom en su sitio web WordPress? Dependiendo de su sitio y configuración no siempre puede ser capaz de obtener un perfecto 100/100, pero simplemente pasar algún tiempo en la mejora de su puntuación es un buen lugar para empezar. Y, a veces, la experiencia del usuario podría superar algunos de los trucos de rendimiento que lee en la web. ¡No puede olvidar la experiencia del usuario! Pero tenga la garantía vamos a compartir con ustedes algunos consejos y trucos más abajo sobre cómo conseguimos el resultado del sitio anterior, así que siga leyendo!

Análisis de Rendimiento de Pingdom

La sección de análisis de rendimiento de la herramienta Pingdom también es muy útil. Este se basa en las reglas de análisis de Google PageSpeed. Generalmente, si mejora esto en su sitio, debería ver una disminución en sus tiempos de carga totales.

pingdom percepción del rendimiento

Pingdom percepción del rendimiento

Leverage Browser Caching

Una lucha muy común de la gente con esto es la advertencia de leverage browser caching. Esto se genera debido a no tener las cabeceras de cache HTTP correctas en su servidor web. Vea nuestro post en profundidad sobre cómo Cómo resolver los errores de “Leverage Browser Caching en WordPress.

Quitar Cadenas de Consulta

Otro problema común es tratar con cadenas de consulta. Normalmente, los archivos CSS y JavaScript tienen la versión de archivo al final de sus URL, como https://domain.com/file.min.css?ver=4.5.3. Algunos servidores y servidores proxy no pueden almacenar en la cache cadenas de consulta. Así que mediante la eliminación de ellos a veces puede mejorar su caching. Hay plugins gratuitos como Query Strings Remover que puede hacer esto para usted automáticamente en WordPress. También es importante tener en cuenta que si está utilizando una CDN, como KeyCDN, en realidad pueden usar la cache con cadenas de consulta, que a su vez significa que no necesita preocuparse por esto. Vea nuestro tutorial en profundidad sobre cómo eliminar cadenas de consulta de los URLs.

Eliminar cadenas de consulta

Eliminar cadenas de consulta

Servir contenido estático de un dominio sin cookies

Tenemos un post en profundidad sobre qué hacer con la advertencia de Servir contenido estático de un dominio sin cookies. Muchas veces se puede ignorar esta advertencia ya que nuevos protocolos como HTTP/2 ahora hacen esto menos importante. El costo de una nueva conexión suele ser más costoso que transmitir todo a través de la misma conexión. Sin embargo, dos maneras de resolver esto es usar un proveedor de CDN que quita las cookies o cree un dominio y / o un subdominio separado.

Advertencia de Servir contenido estático de un dominio sin cookies

Advertencia de Servir contenido estático de un dominio sin cookies

Paralelizar descargas entre nombres de host

Esta advertencia se debe a que una limitación de HTTP/1.1 y navegadores web está limitada al número de conexiones simultáneas que pueden realizar a un host; que es típicamente 6 conexiones. Esta advertencia se suele ver en sitios web con un gran número de solicitudes. En el pasado, la única manera de superar esta limitación era implementar lo que llaman sharding de dominio. Sin embargo, si está utilizando un web host o CDN que admita HTTP/2, puede ignorarlo ahora ya que ahora se pueden cargar varios recursos en paralelo a través de una sola conexión. Pero también puede consultar nuestro tutorial sobre Cómo arreglar el aviso  de “paralelizar descargas a través de nombres de hosts” mediante la implementación de sharding de dominio.

Advertencia Paralelizar descargas entre nombres de host

Advertencia Paralelizar descargas entre nombres de host

Specify a Vary: Accept-Encoding header

Tenemos un post en profundidad sobre Cómo Arreglar “Specify a Vary: Accept-Encoding Header”. Se trata de una cabecera HTTP y se debe incluirla en cada respuesta del servidor de origen, ya que indica al navegador si el cliente puede o no manejar versiones comprimidas del contenido.

Advertencia Specify a Vary Accept-Encoding header

Advertencia Specify a Vary Accept-Encoding header

Specify a cache validator
Esta advertencia refiere a las cabeceras de HTTP caching que faltan y deberían ser incluidas en todas las respuestas de servidores de origen ya que validan y configuran la longitud de la cache. Si no se encuentran las cabeceras eso generará unas solicitudes nuevas para los recursos cada vez que aumenta la carga en su servidor. Estas cabeceras incluyen last-modifiedETagCache-Control y Expires. Lea nuestra publicación detallada sobre el arreglo de la advertencia “Specify a Cache Validator”.

Advertencia de specify a cache validator

Advertencia de specify a cache validator

Códigos de Respuesta de Pingdom

La siguiente sección en la herramienta Pingdom se trata de los códigos de respuesta. Los códigos de respuesta, también conocidos como códigos de estado HTTP, son como una nota corta del servidor web que se pega en la parte superior de una página web. Es un mensaje del servidor web que le permite saber cómo salieron las cosas cuando se recibió la solicitud para ver la página. Algunos comunes son:

  • 200: “Todo está OK.” Este es el código que se entrega cuando una página web o un recurso actúa exactamente de la manera que se espera.
  • 301: “El recurso solicitado se ha movido permanentemente.” Este código se entrega cuando una página web o un recurso ha sido sustituido permanentemente por otro recurso. Se utiliza para la redirección permanente de URL.
  • 404: “No se encontró el recurso solicitado.” El mensaje de error más común de todos ellos. Este código significa que el recurso solicitado no existe y que el servidor no sabe si alguna vez ha existido.
pingdom códigos de respuesta

pingdom códigos de respuesta 200

pingdom código de respuesta 404

Pingdom código de respuesta 404

Puede leer más sobre todos los diferentes códigos de respuesta en nuestro post en profundidad en HTTP status codes.

Tamaño del contenido y solicitudes por tipo de contenido

Las siguientes secciones son el tamaño del contenido por tipo de contenido y las solicitudes por tipo de contenido. Cada una de estas es útil para ver rápidamente qué está ocupando la mayor cantidad de recursos en su página web. De acuerdo a HTTP Archive, las imágenes representan generalmente el 64% del tamaño total de una página web regular. Nosotros también vemos que esto suele ser el caso. Sin embargo, como se puede ver a continuación en este sitio, no siempre es el caso. En caso de que se pregunte qué tipo de contenido “Otros” está a continuación, que está siendo generado por nuestra fuente web de Google y fuentes Font Awesome. Las fuentes web se agrupan en la otra categoría.

pingdom tipo de contenido

Pingdom tipo de contenido

Para optimizar sus imágenes, le recomendamos leer nuestro post en profundidad en cómo optimizar imágenes para la web. Hay muchas herramientas y plugins estupendos por ahí para comprimir aún más sus imágenes y asegurarse de que no ocupen la mayor parte de la carga de página de su sitio web. Y en nuestro caso anterior, el sitio perfmatters.io está aprovechando el uso de grandes iconos de Font Awesome en lugar de imágenes. Esta puede ser una gran estrategia que hace gran diferencia. Y por supuesto, tenemos algunos consejos adicionales en nuestra guía de velocidad de página sobre cómo reducir aún más el tamaño de su contenido.

Tamaño del contenido y solicitudes por dominio

El tamaño del contenido y las solicitudes por sección de dominio es una buena manera de ver rápidamente qué servicios y scripts externos están en su sitio web. En nuestro ejemplo, puede ver que todos nuestros activos se cargan desde nuestra CDN. Luego está la carga HTML DOC inicial para el sitio web desde el servidor web y una llamada externa al dominio de Google Analytics. Dependiendo de su sitio, es posible que tenga muchos más servicios externos, como Facebook, Twitter, Hotjar, SumoMe, AdRoll, New Relic, CrazyEgg, etc.

Por lo general, mientras menos solicitudes externas pueda hacer, mejor, porque cada servicio externo introduce su propia latencia, demoras de TLS, búsquedas de DNS, etc. Asegúrese de leer nuestro post sobre cómo identificar y analizar servicios externos en su sitio de WordPress. En general, es mejor reducir el número de solicitudes tanto como sea posible y alojar los activos en un solo lugar, como moverlos al servidor web o CDN. Un ejemplo sería Font Awsome. En lugar de enlazar al script externo para font awesome, descárguelo y sírvalo directamente.

Solicitud de Pingdom por dominio

Solicitud de Pingdom por dominio

Gráfico de Cascada de Pingdom

Y por último, pero no menos importante, tenemos la sección de solicitues de la herramienta Pingdom que genera un gráfico de cascada de todas las solicitudes individuales en su página web (como se muestra a continuación). A continuación, puede analizar cada solicitud para ver qué está causando retrasos y problemas de rendimiento en su sitio. Esto es lo que queremos decir cuando decimos que estamos haciendo un análisis de cascada. A continuación, se muestra un resumen y/o definición más en detallado de lo que significa cada color de estado.

Gráfico de Cascada de Pingdom

Gráfico de Cascada de Pingdom

DNS (Rosada)

Entonces, ¿qué es DNS? Bueno, piensa en ello como en una guía telefónica. Existen servidores denominados Servidores de nombres de dominio que contienen la información sobre su sitio web y la IP en la que se debe encaminar. Cuando ejecuta por primera vez su sitio web a través de la herramienta Pingdom, este realiza una nueva búsqueda, y tiene que consultar los registros DNS para obtener la información de IP. Esto da como resultado un tiempo de búsqueda adicional.

pingdom demora de DNS

Pingdom demora de DNS

Cuando ejecute su sitio web a través de Pingdom más de una vez, almacena en la cache del DNS porque ya conoce la información de IP y no tiene que realizar la búsqueda de nuevo. Esta es una de las razones por las que puede ser que su sitio web aparezca más rápido después de ejecutarlo a través de la herramienta Pingdom varias veces. Como se puede ver en la pantalla de abajo, en la segunda prueba que ejecutamos, el tiempo de búsqueda de DNS en la carga DOC inicial es de 0 ms. Esta es una área que mucha gente malinterpretda!

pingdom DNS cacheado

Pingdom DNS cacheado

También hay otras razones por las que su sitio web puede aparecer más rápido después de múltiples pruebas. Una de ellas es si usted está usando una Red de Entrega de Contenido (CDN). Para aquellos que no están familiarizados con una CDN, es una red de servidores globales que almacenan en la cache su contenido (JS, CSS, Imágenes, etc.) en ubicaciones más cercanas al visitante. Cuando ejecuta por primera vez su sitio web a través de la herramienta Pingdom, podría tener que agarrar los activos de la CDN fresca. Una cache de CDN funciona como DNS, una vez que se almacena en la cache, es mucho más rápido en cargas consecutivas.

Otro consejo sobre la aceleración de DNS es el uso de prefetching de DNS. Esto permite al navegador realizar búsquedas de DNS en una página en segundo plano. Puede hacerlo agregando algunas líneas de código a la cabecera de su sitio de WordPress. Vea algunos ejemplos a continuación.

<!– Prefetch DNS for external assets –>

 <link rel="dns-prefetch" href="//fonts.googleapis.com">
 <link rel="dns-prefetch" href="//www.google-analytics.com"> 
 <link rel="dns-prefetch" href="//cdn.domain.com">

O si está ejecutando WordPress versión 4.6 o posterior, es posible que desee utilizar precarga de recursos (resource hints). Los desarrolladores pueden usar el filtro wp_resource_hints para agregar dominios y URL personalizados para dns-prefetchpreconnectprefetchprerender.

SSL (Lila)

El color de estado lila significa el tiempo que su navegador tarda en hacer un handshake SSL / TLS. Cada vez que ejecuta un sitio web a través de HTTPS significa que hay un certificado SSL implicado y tiempo adicional debido al proceso de cifrado (protocolo de handshake SSL / TLS). En nuestro ejemplo tenemos un certificado en nuestro servidor web en Kinsta y nuestra CDN, KeyCDN. Por lo tanto, hay un tiempo de negociación de SSL tanto en la carga de doc en HTML inicial del servidor web como en nuestros activos.

Tiempos de carga de SSL

Tiempos de carga de SSL

Si bien hay ligera sobrecarga para ejecutar HTTPS, es muy insignificante ahora gracias a HTTP/2, que es un nuevo protocolo que ayuda a acelerar la web! Debido al soporte del navegador HTTPS es necesario utilizar HTTP/2. Echa un vistazo a nuestro última guía a HTTP/2. También es importante tener en cuenta que aún no todos los proveedores soportan HTTP/2. Esto incluye participantes tanto desde el lado de los web hosts como del lado de las CDN. Así que cuando usted está de compras de hosting y CDN, asegúrese de que ambos lo apoyen! Kinsta está orgulloso de apoyar HTTP/2 para todos sus clientes de WordPress.

Otra cosa a tener en cuenta es que la herramienta Pingdom en sí no es compatible con HTTP/2 porque actualmente está usando Chrome 39 para ejecutar sus pruebas. Chrome no apoyó HTTP/2 hasta la versión 49. Por lo tanto, tenga en cuenta que su rendimiento podría incluso ser mejor porque Pingdom no le está mostrando las ventajas HTTP/2 completas. Aunque lo hará una vez que actualice sus máquinas de prueba.

Conectar (Turquesa)

El tiempo de conexión en Pingdom se refiere a la conexión TCP, o el tiempo total necesario para crear una conexión TCP. Realmente no es necesario entender cómo funciona esto, pero esto es simplemente un método de comunicación entre el host / cliente y el servidor que tiene que tener lugar.

pingdom tiempo de conexión

Pingdom tiempo de conexión

Esperar (Amarillo)

El tiempo de espera en Pingdom se refiere en realidad al tiempo al primer byte, también conocido como el TTFB en algunas herramientas. TTFB es una medida utilizada como una indicación de la capacidad de respuesta de un servidor web u otro recurso de red. Generalmente, cualquier cosa menos de 100 ms es un TTFB aceptable y bueno. Si se está acercando al rango de 300-400 ms puede haber algo mal configurado en su servidor o puede ser hora de actualizar a una mejor pila web.

ttfb

TTFB

La forma más fácil de disminuir su TTFB? Si usted tiene sitio web que está sirviendo a los visitantes en diferentes partes del país, o en todo el mundo, la forma más fácil de reducir drásticamente su TTFB es utilizar una CDN. Hicimos una pequeña prueba para mostrar la diferencia.

TTFB Sin CDN

Primero ejecutamos una prueba con nuestra CDN deshabilitada y como puede ver nuestro tiempo de carga total fue de 1.45 s y nuestro TTFB promedio en un activo fue alrededor de 136 ms.

TTFB Sin CDN

TTFB Sin CDN

TTFB Con CDN

Después habilitamos nuestra CDN y ejecutamos la prueba de nuevo. Como puede ver, nuestro tiempo total de carga bajó a 788 ms y nuestro promedio de TTFB ahora es de 37 ms! Qué diferencia una CDN puede hacer. Otra cosa importante a tener en cuenta es que elegimos el lugar de Estocolmo para realizar esta prueba. ¿Por qué? Porque queríamos mostrarle la verdadera mejora que se puede tener. Nuestro sitio de WordPress en este ejemplo está alojado por Kinsta en Google Cloud y se encuentra en una ubicación central en los EE.UU. Al realizar la prueba contra Estocolmo, podemos mostrar cómo la cache de la CDN aumenta la velocidad y reduce el TTFB.

TTFB Con CDN

TTFB Con CDN

Y, por supuesto, tener un buen host de WordPress con una arquitectura cuidadosamente pensada también es crucial para reducir su TTFB.

Enviar (Naranja) y Recibir (Gris)

El estado de enviar y recibir en la herramienta Pingdom realmente no necesita mucha explicación. El tiempo de envío es simplemente el tiempo que tarda el navegador web en enviar datos al servidor. Y el tiempo de recepción es el tiempo que tarda el navegador web en recibir datos del servidor. Ambos suelen ser muy bajos o inexistentes en sus pruebas.

Cabeceras de Respuesta HTTP

También puede hacer clic en una solicitud individual mientras realiza el análisis de cascada y ver las cabeceras de respuesta HTTP. Esto proporciona información valiosa. En la pantalla de abajo podemos ver instantáneamente cosas como gzip está habilitado en el servidor web, se está ejecutando sobre HHVM, se está sirviendo desde la memoria cache (HIT, de lo contrario mostraría MISS), las cabeceras de control de cache, las cabeceras de expiración, el usuario-agente del navegador y mucho más.

pingdom cabecera de respuesta HTTP

Cabecera de respuesta HTTP

Estudio de Caso Configuración de Dominio

Si usted logró llegar hasta acá abajo en nuestro post del análisis de cascada entonces usted pasará buenos momentos. Siempre es molesto ver a la gente compartir consejos y estudios de casos, pero luego no compartir cómo llegaron allí. Así que, abajo está nuestra configuración exacta para el dominio de estudio de caso utilizado anteriormente! Siéntase libre de replicarlo.

Arquitectura

  • El dominio del estudio de caso (perfmatters.io) está alojado con Kinsta en la plataforma Google Cloud en los Estados Unidos (ubicación central). Kinsta utiliza HTTP/2, Nginx, MariaDB, que contribuyen a los tiempos de carga rápida
  • Este sitio está usando HHVM. HHVM y PHP 7 son conocidos por su rendimiento impresionante.
  • Kinsta le permite alternar entre los dos con un solo clic.
  • El sitio no está usando ningún cache plugin. Kinsta incluye la cache a nivel de servidor lo que simplifica mucho las cosas!

WordPress Plugins

Y aquí hay una lista de los plugins que se utilizan en el sitio de WordPress. Como puede ver, muchos de los plugins son realmente gratuitos.

Nota: Para algunos de los plugins más pequeños como Disable Embeds Disable Emojis, etc. Siempre puede poner en línea el JS embebido minificado en lugar de instalar el plugin. Pero de cualquier manera, estos plugins son muy pequeños y ligeros.

Tutoriales Adicionales de Información Adicional:

Resumen

Como puede ver, saber cómo funciona la herramienta Pingdom un poco mejor y lo que significan todos los gráficos puede ayudarle a tomar una decisión más impulsada por los datos cuando se trata de rendimiento. Un análisis de cascada como lo llamamos es crucial para saber cómo sus activos individuales se cargan. ¿Tiene algún consejo adicional de Pingdom?

Si desea ver más artículos en profundidad como el anterior, por favor, ¡háganoslo saber a continuación en los comentarios!

Este artículo fue escrito por Brian Jackson

Brian enfoca en nuestros esfuerzos de marketing a través de las redes sociales: desde el desarrollo de la nueva estrategia de crecimiento online, creación de contenido, optimización técnica de buscadores hasta nuestra expansión en la comunidad WordPress. Es apasionado por Wordpress lleva usándolo desde hace más de 8 años e incluso está desarrollando su propio plugin exclusivo. A Brian le encanta el blogueo, películas, montar en bici y trabajar con sitios web.

Artículos relacionados

Deja un comentario

kinsta newsletter

¿Utilizas WordPress?

¡Únete a más de 20.000 lectores que ya reciben nuestro newsletter semanal GRATUITO con consejos de WordPress sobre cómo generar más tráfico e ingresos para tu negocio!

You have Successfully Subscribed!

Send this to a friend