¿Por qué los nuevos agentes de IA eligen Markdown en lugar de HTML?

Los agentes de IA están conquistando el mundo, marcando el siguiente gran paso en la evolución de la IA 🦖. Entonces, ¿qué tienen todos estos agentes en común? Usan Markdown en lugar de HTML puro al procesar el contenido de las páginas web ⛓️. ¿Te interesa saber por qué?

¡Esta publicación de blog le mostrará cómo este simple truco puede ahorrarle hasta un 99% en tokens y dinero!

Agentes de IA y procesamiento de datos: una introducción

Los agentes de IA son sistemas de software que aprovechan el poder de la inteligencia artificial para realizar tareas y alcanzar objetivos en nombre de los usuarios. Equipados con razonamiento, planificación y memoria, estos agentes pueden tomar decisiones, aprender y adaptarse, todo por sí solos. 🤯

En los últimos meses, los agentes de IA han despegado, especialmente en el mundo de la automatización de navegadores. Estos navegadores con agentes de IA permiten usar LLM para controlar los navegadores programáticamente, automatizando tareas como añadir productos al carrito de Amazon 🛒.

¿Alguna vez te preguntaste qué bibliotecas y marcos impulsan agentes de IA como Crawl4AI , ScrapeGraphAI y LangChain ?

Al procesar datos de páginas web, estas soluciones suelen convertir HTML a Markdown automáticamente (o ofrecen métodos para hacerlo) antes de enviar los datos a los LLM. Pero ¿por qué estos agentes de IA prefieren Markdown a HTML? 🧐

La respuesta corta es: ¡para ahorrar tokens y acelerar el procesamiento! ⏩

¡Es hora de profundizar! Pero primero, veamos otro enfoque popular que usan los agentes de IA para reducir la carga de datos. 👀

De la sobrecarga de datos a la claridad: el primer paso de los agentes de IA

Imagina que quieres que tu agente de IA:

1. Conectarse a un sitio de comercio electrónico (por ejemplo, Amazon)

2. Buscar un producto (por ejemplo, PlayStation 5)

3. Extraer datos de esa página de producto específica

   
   

Ese es un escenario común para un agente de IA, ya que el scraping de comercio electrónico es un reto 🎢. Después de todo, las páginas de producto son un caos de diseños en constante cambio, lo que convierte el análisis programático de datos en una pesadilla. Ahí es donde los agentes de IA demuestran sus superpoderes 💪, aprovechando los LLM para extraer datos sin problemas, ¡sin importar lo desordenada que sea la estructura de la página!

Ahora, digamos que tienes la misión de obtener todos los detalles jugosos de la página del producto PlayStation 5 en Amazon 🎮:

Así es como le ordenarías al navegador de tu agente de IA que lo haga:

 Navigate to Amazon's homepage. Search for 'PlayStation 5' and select the top result. Extract the product title, price, availability, and customer ratings. Return the data in a structured JSON format.

Esto es lo que el agente de IA debería (con suerte 🤞) hacer:

1. Abre Amazon en el navegador 🌍

2. Busca “PlayStation 5” 🔍

3. Identifica el producto correcto 🎯

4. Extrae los detalles del producto de la página y devuélvelos en JSON 📄

   
   

Pero aquí está el verdadero desafío: Paso 4. ¡La página de producto de Amazon PlayStation 5 es una pasada! El HTML está repleto de información, la mayoría de la cual ni siquiera necesitas.

¿Quieres una prueba? Copia el HTML completo de la página desde el DOM de tu navegador y colócalo en una herramienta como la Calculadora de Tokens LLM .

🚨 Prepárate…

¿¡896.871 tokens?! 😱 Sí, leíste bien: ¡ochocientos noventa y seis mil ochocientos setenta y un malditos tokens!

¡Eso es una cantidad ENORME de datos, es decir, muchísimo dinero! 💸 (¡Más de $2 por solicitud en GPT-4o! 😬)

Como puedes imaginar, pasar todos esos datos a un agente de IA conlleva importantes limitaciones:

1. Es posible que se requieran planes premium/pro que admitan un alto uso de tokens 💰
2. Cuesta una fortuna, especialmente si realizas consultas frecuentes 🤑
3. Ralentiza las respuestas ya que la IA tiene que procesar una cantidad ridícula de información ⏳

La solución: Recortar la grasa

La mayoría de los agentes de IA permiten especificar un selector CSS para extraer solo las secciones relevantes de una página web. Otros utilizan algoritmos heurísticos para filtrar automáticamente el contenido, como eliminar encabezados y pies de página (que normalmente no aportan ningún valor). ✂️

Por ejemplo, si inspeccionas la página del producto PlayStation 5 de Amazon, notarás que la mayor parte del contenido útil se encuentra dentro del elemento HTML identificado por el selector CSS #ppd :

Ahora bien, ¿qué pasaría si le dijeras a tu agente de IA que se centrara solo en el elemento #ppd en lugar de en toda la página? ¿Habría alguna diferencia? 🤔

¡Pongámoslo a prueba en el enfrentamiento cara a cara a continuación! 🔥

Markdown vs HTML en el procesamiento de datos de IA: una comparación directa

Compare el uso del token al procesar una parte de una página web directamente versus convertirla a Markdown.

HTML

En su navegador, copie el HTML del elemento #ppd y colóquelo en una herramienta Calculadora de tokens LLM:

De 896.871 tokens a solo 309.951 : ¡un ahorro de casi el 65 %!

Es una caída enorme, claro, pero seamos realistas: ¡siguen siendo demasiadas fichas! 😵‍💸

Reducción

Ahora, repliquemos el truco que usan los agentes de IA: usemos una herramienta de conversión de HTML a Markdown en línea. Pero primero, recuerden que los agentes de IA realizan un preprocesamiento para eliminar etiquetas irrelevantes para el contenido, como <style> y <script> .

Puedes filtrar el HTML del elemento de destino usando este sencillo script en la consola de tu navegador:

 function removeScriptsAndStyles(element) { let htmlString = ppdElement.innerHTML; // Regex to match all <script>...</script> and <style>...</style> tags const scriptRegex = /<script[^>]*>[\s\S]*?<\/script>/gi; const styleRegex = /<style[^>]*>[\s\S]*?<\/style>/gi; // Remove all <script> and <style> tags let cleanHTML = htmlString.replace(scriptRegex, ''); cleanHTML = cleanHTML.replace(styleRegex, ''); } // select the target element and get its cleaned HTML const ppdElement = document.getElementById('ppd'); removeScriptsAndStyles(ppdElement);

A continuación, copie el HTML limpio y conviértalo a Markdown utilizando una herramienta de conversión de HTML a Markdown en línea:

¡El Markdown resultante es significativamente más pequeño pero aún contiene todos los datos de texto importantes!

Ahora, pegue este Markdown en la herramienta Calculadora de tokens LLM:

¡Genial! 💣 De 896,871 tokens a solo 7,943. ¡Un ahorro increíble de aproximadamente el 99% !

Con solo la eliminación básica de contenido y la conversión de HTML a Markdown, obtienes una carga útil más eficiente, menores costos y un procesamiento mucho más rápido. ¡Un gran logro! 💰

Markdown vs HTML: La batalla por los tokens y el ahorro de costes

El último paso es verificar que el texto Markdown contenga todos los datos clave. Para ello, páselo a un LLM con la parte final del mensaje original y obtendrá el siguiente resultado JSON:

 { "product_title": "PlayStation®5 console (slim)", "price": "$499.00", "availability": "In stock", "customer_ratings": { "rating": 4.6, "total_ratings": 5814 } }

¡Esto es exactamente lo que te devolvería tu agente de IA: exactamente así!

Para obtener una descripción general rápida, consulte la tabla de resumen final a continuación:

Dónde están fallando los agentes de IA

Todos esos trucos para ahorrar tokens son inútiles si tu agente de IA es bloqueado por el sitio de destino 😅 (¿alguna vez has visto lo divertidos que pueden ser los fallos del CAPTCHA de IA? 🤣).

¿Por qué ocurre esto? ¡Sencillo! La mayoría de los sitios web utilizan medidas anti-scraping que pueden bloquear fácilmente los navegadores automatizados. ¿Quieres saberlo todo? Mira nuestro próximo seminario web a continuación:

Si has seguido nuestra guía avanzada de web scraping , sabes que el problema no está en las herramientas de automatización del navegador (las bibliotecas que impulsan tus agentes de IA). No, el verdadero culpable es el propio navegador . 🤖

Para evitar bloqueos, necesitas un navegador diseñado específicamente para la automatización en la nube. Descubre Scraping Browser , un navegador que:

• Se ejecuta en modo de encabezado como un navegador normal, lo que hace que sea mucho más difícil para los sistemas anti-bots detectarlo. 🔍
• Se escala sin esfuerzo en la nube, lo que le permite ahorrar tiempo y dinero en infraestructura. 💰
• Resuelve automáticamente CAPTCHA, maneja las huellas digitales del navegador, personaliza las cookies/encabezados y vuelve a intentarlo para que todo funcione sin problemas. ⚡
• Rota IP de una de las redes proxy más grandes y confiables que existen. 🌍
• Se integra perfectamente con bibliotecas de automatización populares como Playwright, Selenium y Puppeteer. 🔧

Obtenga más información sobre Scraping Browser de Bright Data, la herramienta perfecta para integrar en sus agentes de IA :

Reflexiones finales

Ahora ya sabes por qué los agentes de IA usan Markdown para procesar datos. Es un truco sencillo para ahorrar tokens (y dinero) y, al mismo tiempo, acelerar el procesamiento de LLM.

¿Quieres que tu agente de IA funcione sin problemas? ¡Descubre el conjunto de herramientas de Bright Data para IA ! Únete a nosotros para hacer que internet sea accesible para todos, incluso a través de navegadores automatizados de agentes de IA. 🌐

¡Hasta la próxima, sigue navegando por la web con libertad! 🏄‍♂️