Cómo crear un flujo de scraping web con servicios de AWS

Qué es el scraping web y por qué lo necesitamos#

El scraping web es una técnica que se utiliza para extraer los datos subyacentes de una página web. Estos datos suelen estar compuestos por archivos de texto HTML, CSS y JavaScript, además de otros recursos, como las imágenes, los videos y las fuentes mencionados, que el navegador utiliza para mostrar esa página web específica. Luego, los datos recopilados se guardan en archivos o en una base de datos para su posterior procesamiento.

En TeleportHQ, investigamos continuamente cómo mejorar nuestras capacidades de generación de código a partir de wireframes o diseños de alta definición. Como en este proceso interviene mucho aprendizaje automático, necesitamos trabajar con cantidades significativas de datos seleccionados. Aunque el conjunto de datos RICO nos resultó adecuado para empezar con páginas móviles nativas, consideramos que valía la pena dedicar esfuerzos a crear nuestro propio conjunto de datos de páginas web por varios motivos:

• Hay muy pocos conjuntos de datos públicos que cumplan nuestros requisitos de calidad
• Control de los datos: podemos especificar exactamente qué información necesitamos obtener de los sitios web
• Escalabilidad: a medida que avance la investigación, necesitaremos cada vez más datos
• Organización y accesibilidad: ofrecer una forma rápida y sencilla de acceder a los datos

¿Cómo se hace?#

El web scraping de una página web consta de dos pasos: obtenerla y extraer información de ella. Obtenerla consiste en descargar una página, es decir, la cadena HTML inicial y todos los recursos a los que hace referencia, exactamente lo que hace un navegador cuando se visita la página. Por lo tanto, el rastreo web es un componente fundamental del web scraping: obtenemos páginas para procesarlas posteriormente. En nuestro caso, el rastreo se realiza con Puppeteer, una biblioteca de Node que proporciona una API de alto nivel para controlar Chrome o Chromium. Al iniciar Chromium sin interfaz gráfica, podemos obtener una página web y utilizarla para recuperar los datos.

Hay muchas formas de extraer datos de un sitio web, pero en nuestro caso utilizamos una técnica llamada análisis del DOM. Cuando se carga una página web, el navegador crea un Modelo de objetos del documento (DOM) de la página, que luego se utiliza para representarla en pantalla. El modelo DOM de HTML se construye como un árbol de objetos que se puede analizar para recuperar la información necesaria.

Para cada elemento del DOM, recuperamos una lista de atributos que proporcionan información sobre el tamaño, la posición, el color y mucho más.

Primeros problemas#

Tras trabajar con el conjunto de datos de sitios web, observamos que muchos de los sitios web incluidos causaban problemas, como la superposición de cuadros o páginas 404.

El solapamiento de los cuadros se debía a elementos invisibles o fuera de la ventana gráfica que se cargan en el DOM, pero no se muestran hasta que ocurre cierto evento. No estamos diciendo que estos sitios tengan un mal diseño, sino que podrían causar inconsistencias al entrenar un modelo de aprendizaje automático. El error 404 apareció porque el navegador pudo comunicarse con el servidor, pero este no encontró lo que se solicitó. El DOM de la página 404 sigue cargándose y la página se procesa, pero no se puede extraer de ella información útil.

Un clasificador de aprendizaje automático al rescate#

La solución que encontramos para resolver estos problemas fue crear un clasificador de aprendizaje automático que nos diera la probabilidad de que un sitio web fuera apto para su uso. Empezamos por anotar manualmente los sitios web en distintas categorías desde un punto de vista objetivo, siguiendo criterios como: «¿Se solapan los cuadros?» o «¿Tiene la página suficiente información?». Para facilitar el proceso, creamos una aplicación web personalizada con R Shiny y una visualización específica para anotar los datos punto por punto.

Después utilizamos las anotaciones como datos de entrenamiento para nuestro modelo XGBoost y, tras probarlo, obtuvimos una precisión del 85 %. Para implementarlo, usamos SageMaker, principalmente porque la biblioteca XGBoost era demasiado grande para incluirla en un contenedor de Lambda.

Probabilidades promedio de que los sitios web sean aptos según el número de elementos del DOM

Probabilidades entre 200 000 sitios web

Escalabilidad#

La primera versión del rastreador web era una aplicación Node.js que utilizaba llamadas asíncronas para paralelizar el proceso de análisis. Fue un buen comienzo y nos permitió analizar rápidamente nuestros primeros sitios web. Sin embargo, cuando intentamos paralelizar el trabajo, enseguida nos topamos con las limitaciones del hardware de nuestro ordenador local. La RAM se agotaba rápidamente y la CPU no podía seguir el ritmo. Para aumentar la capacidad de procesamiento, decidimos trasladar el analizador a una instancia EC2 m4.4xlarge de AWS, equipada con 16 vCPU y 64 GB de RAM. Esto se hizo únicamente para aumentar la velocidad de análisis

La principal desventaja de este enfoque era que todo debía hacerse manualmente: introducir los sitios web, realizar la ingeniería de características, ejecutar la inferencia del modelo de aprendizaje automático, cargar los resultados en S3 una vez terminado todo, entre otras tareas. Para resolver este problema, creamos una canalización que automatizara todas estas tareas y las organizara para facilitar el acceso. Además, AWS Lambda admite un gran número de funciones simultáneas, lo que nos permitiría analizar más sitios web por minuto.

Estructura de la canalización#

La canalización contiene 2 tipos de elementos: procesadores y almacenamiento. Los procesadores son funciones de Lambda que se activan ante determinados eventos y, como almacenamiento, contamos con la base de datos NoSQL DynamoDB y un bucket de S3. DynamoDB contiene información de alto nivel sobre los sitios web, como el dominio, la página o la hora en que se analizó el sitio web. El bucket de S3 está organizado en 3 carpetas:

• Multi-site-CSV: contiene archivos CSV con varios sitios web para analizar
• Meta: contiene información sobre un sitio web necesaria para el análisis
• Data: contiene los resultados del analizador: una captura de pantalla y un archivo JSON con toda la información extraída del DOM

Punto de partida#

Para iniciar el proceso, debemos introducir uno o más sitios web. Hay dos formas de hacerlo. Una consiste en acceder a un endpoint con la URL como parámetro de la solicitud. Esto analizará únicamente el sitio web indicado y devolverá como respuesta su nombre en S3. La segunda consiste en cargar un archivo CSV en la carpeta «multi-site-CSV» con todos los sitios web que se deben analizar.

Activadores de Lambda#

Hay 3 funciones de Lambda en la canalización que ponen todo en marcha.

La primera Lambda es la función «CSV-split», que se activa cada vez que se carga un archivo CSV en la carpeta «multi-site-CSV». Divide el archivo CSV grande en archivos CSV más pequeños, cada uno con información sobre un sitio web, y los carga en la carpeta «meta» de S3.

La segunda Lambda es el componente fundamental de la canalización: la función «parse-added». Esta Lambda incluye el analizador y es la que más recursos consume. Se activa cada vez que se carga un nuevo archivo CSV en la carpeta «meta» y analiza el sitio web correspondiente. Si el análisis se completa correctamente, devuelve una captura de pantalla, un archivo JSON y una lista de enlaces internos que se utilizarán más adelante en la canalización para realizar análisis recursivos. Luego actualiza la base de datos del sitio web correspondiente y carga los 2 archivos en la carpeta «data» del bucket de S3. Si el análisis falla, se eliminan los elementos de S3 y de la base de datos para evitar incoherencias.

La tercera y última función Lambda contiene la parte de aprendizaje automático (ML) de la canalización. Se activa con cada archivo JSON que se carga en la carpeta «data» y utiliza los datos incluidos en el JSON para realizar la ingeniería de características. Luego envía una solicitud con las características al punto de conexión de SageMaker, que devuelve la probabilidad de que el sitio web sea bueno. Si la probabilidad es lo bastante alta, carga un archivo CSV con todos los enlaces internos del sitio web correspondiente en «multi-site-CSV». La carga activa la primera función Lambda, formando así un bucle.

Resultados#

Rendimiento#

El rendimiento ha mejorado considerablemente a lo largo del desarrollo. La aplicación de Node.js alcanzaba una velocidad media de análisis de 20 sitios web por minuto. Tras migrar a EC2 y aplicar otras optimizaciones, logramos aumentar la velocidad de análisis a 240 sitios web por minuto. Sin embargo, esta cifra no se compara con los 4500 sitios web por minuto que hemos conseguido con AWS Lambda.

¿Qué podemos hacer con los datos?#

Una de las vías que decidimos explorar es la detección de objetos en capturas de pantalla de sitios web. La información que hemos extraído de los sitios web nos proporcionó todo lo necesario para empezar.

Izquierda: predicción / derecha: verdad de referencia

Nuestro objetivo es detectar los elementos de una página web con gran fidelidad. Utilizamos las coordenadas de cada elemento (parte superior, izquierda, ancho y alto) para calcular los cuadros correspondientes y luego los usamos para entrenar el modelo de aprendizaje automático. Los datos extraídos del DOM para el ejemplo anterior eran inconsistentes, por lo que aparecen elementos invisibles o, por el contrario, no se detectan algunos elementos. Como utilizamos sitios web de buena calidad para el entrenamiento, el modelo pudo inferir incluso la ubicación de esos elementos (el párrafo con la imagen de fondo en la parte superior de la página) e ignorar los invisibles (los elementos del lado izquierdo).

Al principio, clasificamos cada elemento como texto o imagen, pero a medida que avance el desarrollo, incorporaremos otras etiquetas HTML, como tablas, listas o campos de entrada.

Conclusiones#

El número de conjuntos de datos web de acceso público y seleccionados cuidadosamente es muy bajo, y los pocos disponibles contienen un número limitado de puntos de datos. Este trabajo preliminar nos ha permitido ganar autonomía y controlar con precisión la calidad y cantidad de nuestros datos. Además, ofrece una importante ventaja añadida: nos permite reconstruir dinámicamente, en tan solo unas horas, conjuntos de datos nuevos, actualizados y mejorados. Si eres investigador y quieres acceder a nuestros datos, no dudes en escribirnos.

Durante el proceso de creación, también hemos aprendido mucho sobre nuestro sector y las tecnologías subyacentes. Estos conocimientos nos han dado mucho más contexto para decidir cómo debemos enfocar nuestra investigación sobre la automatización del proceso de creación de interfaces de usuario.

Como siempre, nos interesa muchísimo intercambiar ideas con otras personas entusiastas sobre este tema. Si te interesa nuestro trabajo, no dudes en ponerte en contacto con nosotros a través de cualquiera de nuestras redes sociales, que encontrarás en el pie de página de este sitio web.