7 days of WordPress plugins, themes & templates - for free!* Unlimited asset downloads! Start 7-Day Free Trial
Advertisement
  1. Code
  2. Performance

Raygun RUM: Conoce la experiencia de tus usuarios

Read Time: 7 mins
This post is part of a series called Raygun Tools for Performance and Error Monitoring.
How to Use Raygun to Identify and Diagnose Web Performance Problems
Error and Performance Monitoring for Web & Mobile Apps Using Raygun
Sponsored Content

This sponsored post features a product relevant to our readers while meeting our editorial guidelines for being objective and educational.

Spanish (Español) translation by Gary López (you can also view the original English article)

No hace falta decir que la creación de aplicaciones web requiere de mucho trabajo. No solo hay que diseñar, depurar y entregar una aplicación rápida del lado del servidor, sino que hay que dedicar la misma cantidad de tiempo y cuidado a diseñar, depurar y entregar una aplicación rápida del lado del cliente. Esto significa que todos los implicados en el proceso de desarrollo deben trabajar juntos para garantizar que sus aplicaciones funcionen con el máximo rendimiento.

Por supuesto, hay un montón de herramientas de desarrollo orientadas al rendimiento que los desarrolladores pueden utilizar para asegurar que el código del lado del cliente es lo más rápido posible, pero los datos recogidos por esas herramientas son teóricos en el mejor de los casos. Solo después de que una aplicación se lance y sea utilizada por usuarios reales se puede obtener una imagen real del rendimiento de la aplicación. Es por eso que usted y su equipo necesitan Raygun Real User Monitoring.

Raygun Real User Monitoring proporciona una monitorización del rendimiento web front-end para aplicaciones web, móviles y de escritorio. Te permite medir y analizar el rendimiento de tu software para usuarios reales. Si no lo puedes creer, míralo. Raygun tiene varios años de experiencia en la monitorización del rendimiento de las aplicaciones, proporcionando herramientas de clase mundial en las que los desarrolladores confían para encontrar y analizar errores y problemas de rendimiento.

Seguimiento del rendimiento de su aplicación

Tras incorporar la monitorización de usuarios reales a su aplicación, un proceso tan sencillo como incluir dos elementos de script en la plantilla de su aplicación, el servicio comienza a recibir datos sobre la experiencia de sus usuarios: las páginas/vistas que visitan, los activos descargados para esas páginas/vistas, la cantidad de tiempo que tardaron en transferirse y renderizarse, e información sobre el propio usuario.

En la página principal del tablero de mandos, te encuentras con el rendimiento general de la aplicación.

Main DashboardMain DashboardMain Dashboard

El gráfico principal visualiza el rendimiento general de tu aplicación, detallando la media, la mediana, el percentil 90 y el percentil 99 para las siguientes métricas del rendimiento de tu aplicación:

  • First Paint: el tiempo que transcurre entre la navegación y el momento en que el navegador muestra los primeros píxeles en la pantalla.
  • First Contentful Paint: este navegador renderiza la primera parte del contenido.
  • Tiempo de carga: el tiempo que tarda en cargarse toda la página.

A partir de ahí, se obtiene una lista de las páginas más frecuentadas por los usuarios. Se trata de una información muy importante, ya que te proporciona las páginas/vistas en las que debes centrarte más. Sí, todas las páginas son importantes, pero seamos realistas: algunas son más importantes que otras.

En el tablero, se ofrece una rápida visualización de los tiempos de carga de las páginas más solicitadas.

Most requested pages tableMost requested pages tableMost requested pages table

El tiempo de carga de una página se divide en varios valores:

  • Consultas DNS
  • Latencia: el tiempo que tarda el host en recibir, procesar y responder
  • SSL handshake time
  • Servidor: el tiempo que tarda el servidor en procesar. Esto también se vincula con Raygun Application Performance Monitoring (APM), para que pueda obtener una visión detallada de qué código procesó la solicitud.
  • Transferencia: el tiempo que la página tiene que esperar para que los activos se descarguen
  • Renderizador
  • Niños: el tiempo de procesamiento de los activos asíncronos

Naturalmente, se trata de mucha información para meter en un gráfico tan pequeño, por lo que la monitorización de usuarios reales le permite profundizar en cada página individual y ver información detallada sobre el rendimiento de la página.

De entrada, Real User Monitoring le ofrece un histograma que detalla la distribución del rendimiento de la página. Con Real User Monitoring, puedes ver fácilmente el rendimiento de la página para todos tus usuarios.

Histogram view of a pages performanceHistogram view of a pages performanceHistogram view of a pages performance

Una de las mejores características de esta vista es el propio histograma. Al hacer clic en cualquiera de las barras se obtiene una visión detallada de las sesiones individuales de los usuarios que visitaron la página en ese periodo de tiempo. A partir de aquí, puede identificar fácilmente las tendencias de los usuarios: el navegador y el sistema operativo que utilizan, así como su ubicación general obtenida por la IP de la sesión. También puedes acceder al recorrido de un usuario individual a través de tu aplicación (más adelante).

Sessions that viewed a specific pageSessions that viewed a specific pageSessions that viewed a specific page

Real User Monitoring también enumera todos los activos descargados (y sus correspondientes valores de tiempo de carga) para una página individual, y cataloga las solicitudes XHR y su información de rendimiento de tiempo de carga.

El rendimiento global es solo una parte del panorama que te ofrece Real User Monitoring; ¡también puede ver las sesiones independientes de sus usuarios!

Sesiones de visualización

La monitorización de usuarios reales le permite comprender exactamente el rendimiento de su aplicación para cada usuario, ofreciéndole un diagnóstico detallado de cada solicitud de página mediante un gráfico de cascada. En resumen, puede seguir el recorrido de un usuario a través de tu aplicación.

A users journey through the applicationA users journey through the applicationA users journey through the application

Esto es realmente sorprendente, ya que le proporciona una visión detallada de cómo sus usuarios experimentan tu aplicación. No solo se aprende cómo un usuario visitó tu aplicación (por ejemplo, el navegador, el sistema operativo y el dispositivo), sino que cada paso a través del viaje proporciona información detallada sobre cómo el usuario experimentó la página. Se trata de datos a nivel de instancia. Se puede ver cómo una página individual, y sus activos, se cargan para un usuario individual para una visita de página individual.

Displaying stats for an instance of a users visit to a pageDisplaying stats for an instance of a users visit to a pageDisplaying stats for an instance of a users visit to a page

Aunque la experiencia del usuario es vital para entender el rendimiento de su aplicación, a veces se necesita una visión más amplia, centrada en los navegadores y las plataformas. Real User Monitoring te tiene cubierto.

Estadísticas del sistema

En un mundo perfecto, el navegador y/o el sistema operativo que alguien utiliza no afectaría al rendimiento de una aplicación, pero todos sabemos que los navegadores y los sistemas operativos se comportan de forma diferente y afectan al rendimiento en consecuencia. Por eso, Real User Monitoring le ofrece información detallada y basada en el rendimiento de los sistemas de sus usuarios.

Browser usage dataBrowser usage dataBrowser usage data

No solo obtendrá una mejor imagen de los sistemas que utilizan sus usuarios, sino que recibirá los tiempos de carga medios de cada navegador y sistema operativo. Podrá detectar fácilmente los problemas de rendimiento con determinadas versiones de los navegadores, lo que le permitirá saber a qué navegadores debe dirigirse y realizar más pruebas.

Comparación de datos

Uno de los aspectos más interesantes de la monitorización de usuarios reales es la posibilidad de comparar diferentes dimensiones promediadas. Por ejemplo, ¿quieres ver la diferencia de rendimiento entre Windows 10 y macOS, o entre Chrome y Firefox? Puedes hacerlo.

Comparing performance in Chrome and FirefoxComparing performance in Chrome and FirefoxComparing performance in Chrome and Firefox

Pero el sistema operativo es solo una dimensión; puedes comparar las estadísticas entre navegadores, dispositivos, ciudades, estados, países y diferentes versiones de tu aplicación. Esta última dimensión es extremadamente útil, ya que puede darte una idea de cómo se comparan las versiones más nuevas en cuanto a rendimiento con las más antiguas.

Seguimiento en directo

Pero quizás la característica más interesante es la monitorización en directo. Sí, puedes obtener, y ver, datos de rendimiento mientras tus usuarios acceden y navegan por tu aplicación. Esto le proporciona a usted y a su equipo información procesable sobre los problemas de rendimiento que afectan a su aplicación.

Live monitoring mapLive monitoring mapLive monitoring map

La pestaña Live le ofrece una visión general del rendimiento de su sitio en tiempo real, junto con las solicitudes en vivo, la distribución geográfica y las tendencias de las sesiones durante un periodo de 24 horas. Con un mapa interactivo, puedes ver las ubicaciones de las sesiones activas y el número de sesiones.

Mi experiencia

Probé brevemente Raygun Real User Monitoring en un sitio en vivo, no demo que construí (la misma aplicación que utilicé para probar Raygun Application Performance Monitoring). La configuración básica fue una brisa. Simplemente añadí dos elementos de script a la plantilla del sitio; sin embargo, podría haber dedicado más tiempo a incorporar la monitorización de usuarios reales a mi aplicación para recibir datos más completos, como informes de errores e información sobre los usuarios.

Empecé a ver los datos de la experiencia del usuario casi de inmediato y me horrorizó la baja puntuación que recibió mi aplicación (en realidad no: ya sabía que tenía problemas). Pero lo que más me sorprendió fue el recorrido del usuario: poder seguir los pasos de un usuario a través de mi aplicación y ver su experiencia fue realmente sorprendente.

La monitorización de usuarios reales es, sin duda, una herramienta que querrás utilizar en tus aplicaciones para analizar el rendimiento y la experiencia de usuario de tu app.

Conclusión

Raygun Real User Monitoring es un servicio fantástico que puede utilizar para supervisar el rendimiento de su aplicación. Muestra una imagen perfecta de cómo tus usuarios experimentan tu aplicación, señalando claramente las páginas y vistas que ralentizan su aplicación.

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Advertisement
Scroll to top
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.