Te ofrecemos esta traducción automática para facilitar la lectura.
En caso de que haya discrepancias entre la versión en inglés y la versión traducida, se entiende que prevalece la versión en inglés. Visita esta página para obtener más información.
Página AJAX: Identifique llamadas que consumen mucho tiempo
Diagnosticar fallas de AJAX es difícil cuando solo tiene metadatos como la URL, el código de estado y la duración. Los framework modernos como GraphQL hacen que esto sea aún más difícil — los errores pueden ocultarse dentro del cuerpo de la respuesta incluso cuando una solicitud parece exitosa.
Nuestra UI de AJAX le brinda visibilidad completa de los requests de AJAX desde los navegadores hasta los extremos HTTP o HTTPS externos. Puede identificar llamadas que consumen mucho tiempo o que fallan, capturar las cargas completas de solicitud y respuesta, y trazar problemas en todo su stack. También puede revisar los problemas por tipo de dispositivo, incluidos los navegadores de escritorio, los dispositivos móviles y las tablets.
Qué solucionar
A continuación se ofrecen algunos consejos de resolución de problemas para identificar problemas de rendimiento con su aplicación:
Resolución de problemas de llamadas AJAX
Ejemplos
Problemas en toda la solicitud
Si no está seguro de dónde está el problema o si desea trazar sus solicitudes de principio a fin, haga clic en el enlace rastreo distribuido en la UI AJAX.
Problemas de tiempo
Los porcentajes de tiempo total, las solicitudes de rendimiento por minuto (rpm) y las tasas promedio de transferencia de datos por solicitud pueden ayudar a identificar problemas de sincronización.
Busque picos grandes en el gráfico Average data transfer per request de la página de resumen AJAX .
Analice las tendencias de sus datos utilizando el menú desplegable Group By para evaluar su rendimiento de AJAX mediante URL de solicitud, nombres de operaciones GraphQL y muchos otros campos.
En la pestaña AJAX performance de la llamada individual, busque correlaciones entre los valores elevados de tiempo de devolución de llamada y las tasas de transferencia de datos.
Problemas extremos
Busque cualquier valor atípico extremo e investigue las solicitudes individuales realizadas por ellos.
El gráfico Status codes en la página de resumen AJAX proporciona información sobre el comportamiento de devolución de la llamada. Si ve una gran cantidad de códigos de estado fuera del rango 200 , esto puede indicar un problema con su extremo AJAX.
Problemas específicos de ubicación de páginas web
Examine posibles problemas de AJAX dentro del contexto de la página donde se cargan. Seleccione una transacción AJAX, luego seleccione cualquier traza de la tabla Session traces with AJAX .
Investigar requests de AJAX
Para solucionar problemas con solicitudes AJAX para su aplicación:
Seleccione el tipo de dispositivo: escritorio (predeterminado), móvil y tableta.
Haga clic en una solicitud AJAX.
Una vez que se haya concentrado en una solicitud de AJAX, es hora de investigar. Pruebe algunas de estas estrategias:
La página de resumen proporciona varios cuadros para ayudarle a solucionar problemas de llamadas AJAX.
Página de resumen de AJAX
Comentarios
Grupos y filtros
Use cualquiera de las opciones de Sort by disponibles en la UI. Todos los requests AJAX que tardan más de dos minutos se filtran automáticamente.
Utilice la opción Group by para seleccionar requestUrl o groupedRequestUrl para obtener más flexibilidad al ver sus datos.
Extremo
El gráfico Throughput muestra los cinco extremos con mayor rendimiento. Si la llamada tiene más de cinco extremos, se consolidarán en el gráfico como Other.
Llamadas de New Relic
Es posible que vea nuestro propio monitoreo de llamadas AJAX del navegador a su aplicación. Esto es normal porque toda la actividad se captura durante la sesión browser .
Faltan datos del navegador
Los detalles de sincronización de AJAX no están disponibles en IE 7, IE 8 o Chrome para el navegador iOS. Si no ve los datos esperados de otros navegadores, siga nuestros procedimientos de resolución de problemas AJAX.
Después de seleccionar una llamada específica en la página de resumen AJAX , puede profundizar en información detallada con el enlace AJAX performance . Esto incluye un enlace directo a los detalles del rastreo de sesión.
Desde aquí también puede seleccionar la pestaña para obtener datos de rendimiento por páginas vistas. (Si las solicitudes del servidor de su aplicación superan con creces la transacción PageView de su browser , esto se debe a que algunas solicitudes a su backend se realizan a través de AJAX. Para obtener más información, consulte nuestros procedimientos de resolución de problemas).
one.newrelic.com > All capabilities > Browser > (select an app) > AJAX > (select an AJAX call): este ejemplo muestra detalles de rendimiento para una llamada AJAX específica. También puede ver los detalles del rendimiento por páginas vistas.
AJAX extremo en el gráfico Average response time aparece como cuatro o dos períodos de tiempo. Esto depende de si existen cabeceras de rastreo multiaplicación.
Cuatro períodos de tiempo (Application time, Queue time, Network time y Callback time): Estas llamadas AJAX se realizan contra el monitor de aplicaciones por parte de agente que proporciona encabezados de seguimiento de múltiples aplicaciones.
Dos períodos de tiempo (Response time y Callback time): Estas llamadas AJAX se realizan contra aplicaciones que no están monitoreadas por el agente APM o que están monitoreadas por un agente que no proporciona encabezados de seguimiento de aplicaciones múltiples.
Importante
La captura de carga requiere la versión 1.317.0 o superior del agente del browser.
Cuando los metadatos como la URL, el código de estado y la duración no son suficientes para diagnosticar una falla, la opción de captura de carga le brinda una imagen completa. Agrega cuatro atributos nuevos a cada evento de AjaxRequest, cada uno truncado a 4 KB y consultable en NRQL. También puede usar el botón View payload para ver la carga en la UI de detalles de AJAX:
one.newrelic.com > All capabilities > Browser > (select an app) > AJAX > (select an AJAX call): este ejemplo muestra los detalles de la solicitud para una llamada de AJAX específica. También puede ver los detalles de la solicitud por vistas de página.
Cómo interactúa la captura de carga con la lista de denegación
Si la URL está en la lista de denegación, el evento se descarta por completo y no se capturan metadatos ni carga.
Si la URL no está en la lista de denegación, según su configuración de captura de carga, el agente captura las cargas de solicitud y respuesta y aplica reglas de ofuscación antes de enviar los datos a New Relic.
Protección de PII
El agente del browser ofusca automáticamente los patrones comunes de datos confidenciales en las cargas capturadas antes de la ingesta, incluidos los números de tarjetas de crédito, los números de Seguro Social y las claves comunes como password y token. También puede configurar reglas de expresiones regulares personalizadas para enmascarar datos confidenciales específicos del negocio. Para obtener más información, consulte Ofuscar datos del navegador.
Para trazar tus solicitudes de principio a fin, también puedes hacer clic en el enlace rastreo distribuido en la UI AJAX.
Para ver una lista de rastreo distribuido, haga clic en el enlace en la UI AJAX en el nivel de resumen de AJAX.
Para ver toda la traza filtrada por su aplicación y un tipo de solicitud específico, haga clic en el enlace rastreo distribuido para la solicitud que seleccione en la UI AJAX.
Cuando ordena la lista de categorías AJAX por Total time percentage, la lista muestra el porcentaje de cada categoría AJAX. Además, el gráfico muestra las principales solicitudes con los porcentajes de tiempo más altos.
Para presentar esta información, browser toma el tiempo de solicitud acumulativo para cada categoría AJAX y lo divide por el tiempo de solicitud acumulativo para todas las solicitudes AJAX. Esto ayuda a identificar dónde optimizar el tiempo de respuesta, porque las solicitudes de alto rendimiento se verán favorecidas sobre las solicitudes de bajo rendimiento.
Example: Calculating time percentages for two AJAX categories
Este ejemplo utiliza dos categorías AJAX: api1.example.com y api2.example.com.
Tu api1.example.com recibe una visita y tarda 1 segundo (1000 ms) en responder (1 x 1 segundo = 1 segundo).
Tu api2.example.com recibe 500 visitas y tarda 1 ms en responder (500 x 1 ms = 500 ms o 0,5 segundos).
El tiempo de solicitud acumulativo para todas sus categorías AJAX es 1500 ms o 1,5 segundos. Para obtener los porcentajes de tiempo, divida cada categoría AJAX por el tiempo de solicitud acumulado y luego multiplique por 100 para obtener el porcentaje.
Entonces, api1.example.com es el 67 % (1000 dividido por 1500, multiplicado por 100) y api2.example.com es el 33 % (500 dividido entre 1500, multiplicado por 100) del porcentaje de tiempo total.
Time calculations
api1
api2
Número de visitas
1
500
Hora de responder
1 segundo (1000 ms)
1 golpe x 1000 ms = 1000 ms (1 segundo)
1 milisegundo (1 ms)
500 visitas x 1 ms = 500 ms (0,5 segundos)
Tiempo de solicitud acumulado para todas las categorías AJAX
1000 ms + 500 ms = 1500 ms (1,5 segundos)
1000 ms + 500 ms = 1500 ms (1,5 segundos)
Porcentaje de tiempo = Categoría / 1500 ms de tiempo de solicitud acumulativo x 100 para porcentaje
1000 ms/1500 x 100 = 67%
500 ms/1500 x 100 = 33%
Que sigue
Además de la UI AJAX, también puedes utilizar estos recursos:
Ayude a evitar que ocurran problemas mediante el uso de alertas para sus indicadores de rendimiento clave.
Utilice el monitoreo de aplicaciones de una sola página (SPA). Esto es valioso para cualquier aplicación que utilice solicitudes AJAX para extraer contenido de forma dinámica y crear una experiencia fluida para el usuario.