1. No category

Captura masiva de la
experiencia de usuario con
JavaScript, Socket.IO, NodeJS y
MongoDB
Pablo Almunia
@pabloalmunia
El reto
•
Captura masiva de la experiencia de usuario
•
¿Qué es “capturar la experiencia” de usuario? Capturar el comportamiento
del usuario en una aplicación o site, tanto de navegación, como dentro de las
páginas o pantallas.
•
¿No sólo un grupo de usuarios? El objetivo es capturar la experiencia de
usuario de todos los visitantes de un site o una aplicación, no sólo de un
grupo de usuarios o en un laboratorio de usabilidad.
La solución
•
Desarrollar un sistema de captura de los eventos relevantes que produce el
usuario y envío de los mismos al servidor para su posterior análisis.
•
Ya que estábamos, ¿porqué no hacerlo en tiempo real? Es decir, capturar la
experiencia y enviarla sin pérdida de tiempo al servidor.
•
Aplicar técnicas Big Data al análisis de las enormes cantidades de
información con la que nos estábamos encontrando.
Nuestro principio de diseño
Arquitectura básica
Componentes utilizados
•
Cliente: JavaScript
•
Conexión: Socket con compatibilidad hacia atrás (socket.io)
•
Servidor: NodeJS
•
Datos: MongoDB
Captura de eventos - Hunter
•
No intrusivo: no puede afectar al comportamiento original.
 Sin errores: no puede tener errores de ningún tipo.
 Ligero: debe descargarse con rapidez y ejecutarse sin sobrecargas.
 Sin dependencias externas como JQuery o similares.
•
Modular: no todo el mundo quiere capturar los mismos eventos.
•
Adaptado para diferentes dispositivos, resoluciones, modelos de
programación.
•
Independiente del sistema de log.
ver ejemplos >
Código de inserción
<script type="text/javascript">
(function(h,u,n,t,e,r){
e=u.createElement(n);e.async=1;e.src=t;
r=u.getElementsByTagName(n)[0];
r.parentNode.insertBefore(e,r);
})(window,document,'script','https://monsync.com/monsync.js');
</script>
Comunicación con el servidor
•
Modelo de proveedores de traza abierto. Se puede utilizar nuestro servidor
de captura o cualquier otro.
•
Modelo ligero, sin conexión, basado en la solicitud de un pixel (pixserver).
•
Modelo con conexión basado en Socket.io, con compatibilidad hacia atrás en
el caso de navegadores que no soporte websocket (stash).
•
Consola o HTML para desarrollo (y presentaciones).
ver ejemplos >
Captura en el servidor
•
Maximizar el rendimiento. Un solo servidor debe responder a decenas de
miles de eventos por segundo.
•
Reducir el trabajo al mínimo, centrándose en el almacenamiento.
•
Dejar la transformación y el análisis para más tarde.
ver ejemplos >
Almacenamiento de datos
•
Sin esquema, cada evento puede tener un formato de datos diferente.
•
Colecciones independientes para cada tipo de evento (no lo hicimos así desde
el principio).
•
Rapidez, mucha rapidez. Diferenciar colecciones RAW de captura de eventos,
colecciones con ingredientes adicionales (GeoIP, Navegadores, etc.) y
colecciones con información preparada para el análisis y ya analizada.
•
Preparada para el análisis del comportamiento con técnicas de BigData.
ver ejemplos >
Seguimos convencidos…
Los clientes siguen pidiendo nuevas funcionalidades
Captura masiva de la
experiencia de usuario con
JavaScript, Socket.IO, NodeJS y
MongoDB
Pablo Almunia
@pabloalmunia