Pruebas de carga en aplicaciones AJAX
Cree scripts de escenarios de usuario para sus aplicaciones AJAX para examinar el comportamiento del usuario
bajo carga, identificar problemas y validar el rendimiento.
Resumen del Contenido
Quienes hayan tenido que enfrentarse a las pruebas de carga de aplicaciones web AJAX (JavaScript Asíncrono y XML) saben que esto puede ser a menudo un desafío complicado de desarrollo y automatización. Este artículo proporcionará información adicional sobre la técnica de desarrollo AJAX, las ventajas y desventajas de AJAX, y un enfoque recomendado para las pruebas de rendimiento AJAX.
Hace décadas, las páginas y aplicaciones web eran aburridas, aunque extremadamente ligeras, fáciles de mantener, y su testabilidad era fantástica en comparación con los frameworks de aplicaciones web usados hoy en día. Los usuarios a menudo pasaban más tiempo esperando frente a una pantalla en blanco que interactuando con esas primeras aplicaciones web. Debido a esta limitada usabilidad, las empresas evitaban invertir dinero en nuevos servicios basados en web.
A partir de 2005, una nueva tecnología llamada AJAX permitió a los desarrolladores construir sitios web modernos, que minimizaban el tiempo que los usuarios pasaban frente a una pantalla en blanco esperando que una página cargara. AJAX es una abreviatura y es más que una tecnología porque consiste en HTML, CSS, JavaScript, XMLHttpRequest y un lenguaje de scripting del lado del servidor como PHP.
En los comienzos de la era de Internet, la popularidad de las páginas web ricas en contenido e interactivas era mala porque no existía la opción de actualizar una página web sin recargarla por completo. A medida que nuevas tecnologías y técnicas evolucionaron, AJAX ayudó a cerrar esta brecha e introdujo el concepto de carga de datos asincrónica, permitiendo que un usuario final interactuara con la página mientras los datos se cargaban en segundo plano. Hoy en día, este concepto se usa ampliamente porque permite implementar aplicaciones web interactivas y dinámicas, lo que ayuda a mejorar la experiencia general del usuario.
Una solicitud AJAX típica consiste en el siguiente proceso:
- El usuario navega a través de la página web o aplicación web.
- El controlador de esta página crea un objeto XMLHttpRequest.
- El objeto XMLHttpRequest solicita un documento al servidor.
- El servidor recupera los datos apropiados y los envía de vuelta.
- XMLHttpRequest dispara un evento para notificar a la página o aplicación que los datos han llegado.
- El controlador procesa y muestra los datos.
Actualización 2026: El comportamiento asincrónico al estilo AJAX sigue usándose ampliamente en aplicaciones web modernas, especialmente junto con APIs y frameworks dinámicos en el frontend. Las pruebas de carga deben simular interacciones reales de navegador para capturar con precisión cómo se comportan las solicitudes en segundo plano y las acciones del usuario bajo carga.
¿Qué desafíos presentan las aplicaciones AJAX?
Existen algunas trampas comunes en las aplicaciones web dinámicas basadas en AJAX que ya son bien conocidas en la comunidad de desarrolladores. A continuación, cubriremos algunas de las áreas problemáticas de AJAX.
Primero, como mencionamos antes, uno de los componentes que conforman AJAX es JavaScript. Si desactivas JavaScript en tu navegador, tu aplicación o sitio web será inutilizable. Hace varios años, era común que las organizaciones bloquearan los navegadores de sus empleados y desactivaran JavaScript por razones de seguridad. Aquellos días ya pasaron, pero aún es bueno tenerlo en cuenta ya que incluso cambios como estos pueden tener consecuencias no deseadas.
En segundo lugar, los datos cargados y mostrados dinámicamente no forman parte de la página, especialmente para páginas creadas como SPA (Aplicación de Una Sola Página). Si un motor de búsqueda ha indexado tu página web basada en AJAX, el resultado, desde una perspectiva SEO, puede ser insatisfactorio porque gran parte del contenido no es visible para esos motores de indexación.
Tercero, las actualizaciones dinámicas continuas de la página pueden molestar a usuarios con poca capacidad de atención. Cuantos más elementos dinámicos aparezcan en esas páginas, mayor es la probabilidad de que el usuario se interrumpa y no pueda terminar su trabajo en un tiempo aceptable.
Finalmente, debido a la comunicación cliente-servidor basada en callbacks, la latencia puede ser varias veces mayor en comparación con otras tecnologías, como WebSockets, por ejemplo. Los clientes web hacen solicitudes para recibir actualizaciones, lo que también supone un desafío para las pruebas automatizadas.
Pruebas de carga AJAX: Técnicas de simulación de usuario
Los especialistas en pruebas de carga e ingenieros de rendimiento son responsables de elegir un enfoque adecuado de simulación de usuario, uno que sea apropiado para la aplicación bajo prueba y que no genere demasiado esfuerzo de tu parte. Si eliges un método de simulación incorrecto, hay muchas posibilidades de que no puedas abordar los puntos críticos de rendimiento en tu aplicación.
Existen dos métodos de simulación de usuario que discutiremos a continuación.
Simulación basada en protocolo de solicitudes y respuestas
La mayoría de las herramientas de prueba de código abierto, así como las comerciales, soportan este procedimiento. Grabas las interacciones cliente-servidor, y la herramienta captura todas las solicitudes y respuestas en un script de prueba. Luego de parametrizar datos dinámicos, como IDs de sesión o datos de entrada de prueba, los scripts pueden usarse para simular la carga requerida en tu sistema backend. Ten en cuenta que el procesamiento o interacciones del lado cliente no forman parte de las mediciones de tiempo de respuesta a nivel de protocolo.
Simulación completa basada en navegador de interacciones reales de usuario
Sólo algunas de las soluciones de pruebas de carga más completas en el mercado hoy en día proporcionan y soportan la simulación completa basada en navegador para pruebas de carga. La razón es que los requerimientos de recursos del sistema son mayores y implementar replay fiable puede ser algo difícil. Cuando llega el momento de crear scripts para simulaciones completas basadas en navegador, la creación es similar al enfoque basado en protocolo, pero esta vez se graban y guardan todas las interacciones del lado cliente.
El tester o ingeniero navega a través de la página web o aplicación mientras un grabador de scripts captura todas las interacciones en el navegador web. Durante la ejecución de la prueba, un navegador web headless ejecuta las interacciones grabadas y responde a las devoluciones de llamada del servidor como un usuario real. Este tipo de simulación de usuario es muy precisa y provee métricas de rendimiento front-end realistas.
El primer método de simulación que describimos es perfecto para aplicaciones web estáticas, tiene una baja sobrecarga de simulación en tu máquina de inyección de carga y suele ser fácil de implementar. La técnica posterior provee tiempos de respuesta exactos de extremo a extremo, pero la sobrecarga en el servidor de pruebas es mucho mayor. Entonces, ¿cómo eliges el mejor método de simulación de usuario para probar la carga de aplicaciones o páginas web basadas en AJAX?
Pruebas de carga AJAX en acción
¿Cuál es el mejor enfoque de pruebas de carga AJAX y cómo validar tu decisión? Obviamente, es buena idea comenzar con un pequeño experimento si no estás seguro de qué enfoque proporcionará resultados precisos.
Para este escenario, convertiremos dos implementaciones de prueba de carga para una aplicación de muestra AJAX usando ajaxsearchpro.com. Esta aplicación demo es un motor de búsqueda simple. Para este ejemplo, supongamos que un usuario escribe un término de búsqueda en el campo de búsqueda y se muestra contenido coincidente. Después de presionar la tecla enter o hacer clic en el botón de búsqueda, se ejecutará la búsqueda final y los resultados correspondientes se mostrarán en pantalla. A continuación se muestra el gráfico waterfall capturado usando las DevTools del navegador Chrome. El tiempo de respuesta de la solicitud de búsqueda “car” fue de 2.2 segundos.
Usamos las herramientas de desarrollo en el navegador Chrome, que nos ayudaron a descubrir que ejecuta esta solicitud al realizar la acción de búsqueda: ajaxsearchpro.com/?s=car
Hemos creado un script de prueba de carga basado en protocolo y otro basado en navegador, ejecutamos ambos y comparamos las métricas de rendimiento resultantes. ¿Qué crees? ¿Cuál simulación de usuario es la mejor para una aplicación basada en AJAX?
Script de prueba de carga AJAX basado en protocolo
| Pasos scriptados: | https://ajaxsearchpro.com/?s=car | Tiempo de respuesta: | 594 ms |
| Enfoque de simulación: | Nivel de protocolo, Chrome | Número de solicitudes: | 1 |
Gráfico Waterfall
Resumen de la ejecución del script basado en protocolo
Script de prueba de carga AJAX basado en navegador
| Pasos scriptados: | https://ajaxsearchpro.com/?s=car | Tiempo de respuesta: | 2.18 seg |
| Enfoque de simulación: | Nivel de protocolo, Chrome | Número de solicitudes: | 32 |
Gráfico Waterfall
Resumen de la ejecución del script basado en navegador
Comparación de ambos métodos de simulación
Debido a su patrón de comunicación asincrónico, las aplicaciones basadas en AJAX no pueden ser automatizadas al nivel de protocolo. Solo la simulación basada en navegador real provee resultados precisos y genera una carga realista en su sistema backend.
Considera una prueba de carga de nuestra aplicación demo ajaxsearchpro.com con 100 usuarios concurrentes y 10,000 búsquedas por hora. Si decides usar la simulación basada en protocolo, perderás 10,000 x 31 = 310,000 solicitudes. Obviamente, esto llevaría a resultados de prueba de carga totalmente inexactos.
Cómo LoadView aborda las pruebas de carga con AJAX
LoadView, nuestra plataforma de pruebas de carga basada en la nube, está diseñada para probar todas las aplicaciones web 2.0 modernas como AJAX, Flash, Angular, Knockout, HTML5, jQuery y muchas más. Su facilidad de uso es sobresaliente. Puedes grabar escenarios completos basados en navegador y simular más de 40 dispositivos móviles o basados en navegador como Internet Explorer, Chrome, iPhone, Samsung, Blackberry, y muchos más.
Como mencionamos antes, muchas soluciones de pruebas de carga solo ofrecen un enfoque de simulación de usuario basado en protocolo, lo cual no es suficiente. Puedes estresar tu backend con pruebas a nivel de protocolo, pero una parte significativa de las solicitudes cliente-servidor y el procesamiento del lado cliente queda fuera. La plataforma LoadView te ofrece todo lo que necesitas cuando se trata de simulación precisa de usuario.
Cinco pasos para ejecutar tus pruebas de carga basadas en AJAX con LoadView
1. Graba tu aplicación AJAX
Puedes usar EveryStep Web Recorder para navegar manualmente por tu aplicación basada en AJAX. EveryStep grabará todas las acciones y te permitirá agregar temporizadores o pasos de verificación. Una vez que hayas navegado por tu aplicación y creado un script, puedes realizar una ejecución de prueba con un solo usuario o subir las acciones grabadas a nuestra plataforma y crear tu dispositivo de prueba de carga.
2. Calibrar
La asignación de máquinas de inyección de carga suele ser una suposición. Las máquinas generadoras de carga poco saludables alterarán tus resultados de prueba. LoadView ejecuta una prueba con un solo usuario de tu dispositivo y calcula el número máximo de usuarios por máquina de inyección de carga. Este paso evita que una máquina sobrecargada afecte negativamente los tiempos de respuesta de tu aplicación.
3. Plan de ejecución
El volumen de usuarios suele variar a lo largo de un día típico de trabajo. Abordamos esta necesidad con nuestra función de plan de ejecución. Te brinda total flexibilidad para modelar escenarios de pruebas de carga realistas.
4. Distribución de usuarios virtuales
LoadView te permite elegir entre una amplia gama de máquinas de inyección de carga alrededor del mundo. Selecciona aquellas que representen la ubicación habitual de tus clientes.
5. Ejecuta la prueba y visualiza tus resultados
En este último paso, puedes iniciar la ejecución de la prueba de carga. Una vista en línea te proporcionará información en tiempo real sobre cómo se desempeña tu aplicación AJAX bajo carga. Una vez finalizada la ejecución de la prueba, recibirás un informe detallado con los indicadores clave de rendimiento más importantes.
Considerando todo, LoadView cumple con todos los requisitos de una plataforma moderna de pruebas de carga que simplifica los desafíos de automatización de pruebas y te ayuda a simular escenarios reales similares a los de producción en tus complejas aplicaciones empresariales. Para más información sobre LoadView, visita el sitio web de LoadView. Para obtener información técnica más profunda y videos, visita nuestra Base de Conocimiento.
¿Interesado en una demostración en vivo? Agenda una demo con uno de nuestros ingenieros de rendimiento. Nuestros ingenieros te guiarán por toda la solución LoadView, desde la creación de scripts y configuración de pruebas de carga, hasta la ejecución y análisis posterior a la prueba. ¡Resuelve todas tus dudas sobre pruebas de carga!
Herramientas utilizadas
LoadView: Plataforma de pruebas de carga en la nube de Dotcom-Monitor
EveryStep Web Recorder: Herramienta de creación de scripts web basada en punto y clic.
Herramientas para desarrolladores de Chrome: Herramientas de desarrollo incorporadas en el navegador Chrome.
Para obtener más información sobre la plataforma Dotcom-Monitor y las soluciones de monitoreo ofrecidas, visita www.dotcom-monitor.com