Agentes de navegador: Accessibility Tree vs capturas de pantalla, ¿cuántos tokens ahorras de verdad?

Pasar a un agente de navegador el Accessibility Tree filtrado a lo que se ve en pantalla, con referencias [ref=eN], gasta un 85,4 % menos tokens que enviarle una captura en cada paso: 1.991 tokens frente a 13.650 en una tarea de 10 pasos (fórmula de Claude). Los clics por referencia acertaron 80 de 80. Pero ojo: si filtras la página entera en vez de lo visible, en una web con muchos enlaces el árbol puede salir más caro que la captura.

Medido el 19 de octubre de 2026 en un MacBook Pro M1 Max con Playwright y Chromium, sobre una tarea real de 10 pasos en esta misma web servida en local.

Definiciones

• Agente de navegador: un modelo de lenguaje que maneja un navegador paso a paso: mira la página, decide y hace clic o escribe.
• Observación: lo que el agente recibe en cada paso para «ver» la página.
• Accessibility Tree: la estructura que el navegador construye para los lectores de pantalla: roles (enlace, botón, campo), nombres y estados. No son píxeles: es texto.
• Referencia ([ref=eN]): un identificador que el agente usa para decir «haz clic en e7» en lugar de dar coordenadas (x, y).

Hipótesis

1. El Accessibility Tree gasta muchos menos tokens que las capturas.
2. Hacer clic por referencia no falla.
3. Obtener el árbol es más rápido que tomar una captura.

Montaje

• Tarea de 10 pasos sobre yeswelab.com: abrir la portada, ir a Experimentos, buscar «tokens», abrir un experimento, bajar al final, ir a Guías, abrir una guía, ir al formulario, escribir la hipótesis y marcar una opción.
• En cada paso, cuatro observaciones: captura de pantalla de 1280×800 (a 1x y a 2x, como una pantalla Retina), árbol completo, árbol filtrado (solo elementos interactivos y encabezados, con referencias) y árbol filtrado limitado a lo visible.
• Tokens de imagen: con la fórmula publicada por Anthropic para Claude y por OpenAI para GPT-4o en detalle alto. Tokens de texto: tokenizador o200k_base (GPT-4o/GPT-5).
• Clics: el agente simulado hace clic en el centro del elemento señalado por su referencia y se comprueba que el punto cae en ese elemento o en su etiqueta.
• 5 repeticiones de la tarea completa por cada escala de pantalla.

Resultados

Tokens de la tarea completa (10 pasos)

Observación	Solo la observación del paso	Con historial completo
Captura 1x, fórmula de Claude	13.650	75.075
Captura 2x (Retina), fórmula de Claude	15.330	84.315
Captura, fórmula de GPT-4o	11.050	60.775
Árbol completo, con texto	67.340	378.509
Árbol filtrado, toda la página	16.447	95.560
Árbol filtrado, solo lo visible	1.991	10.369

«Con historial completo» es un agente que reenvía todas las observaciones anteriores en cada paso, algo habitual si no se gestiona el contexto.

Por paso (mediana)

Observación	Tokens por paso
Captura 1x (Claude)	1.365
Árbol completo	6.457,5
Árbol filtrado, toda la página	1.958
Árbol filtrado, solo lo visible	203

Velocidad y clics

Medida	Captura 1x	Captura 2x	Árbol filtrado
Tiempo de captura (mediana)	53,45 ms	154,35 ms	36,69 ms
Clics por referencia acertados	—	—	80 de 80

Qué significa

• La hipótesis 1 se cumple solo si filtras bien. El árbol limitado a lo visible gasta un 85,4 % menos que la captura (un 87 % menos frente a la captura Retina y un 82 % menos frente a GPT-4o). Pero el árbol filtrado de toda la página gastó más que la captura: un 20,5 % más con la fórmula de Claude y casi la mitad más (48,8 %) que con GPT-4o. En páginas largas con muchos enlaces, como un listado o un blog, filtrar por tipo de elemento no basta: hay que recortar a lo que se ve.
• El árbol completo es la peor opción: casi 5 veces más tokens que las capturas. Mandarle al modelo todo el texto de la página es caro e innecesario para navegar.
• El historial multiplica el coste. Reenviar las 10 capturas en cada paso pasa de 13.650 a 75.075 tokens. Con el árbol visible, de 1.991 a 10.369. Recortar el historial importa tanto como elegir la observación; lo vimos en context engineering.
• Clicar por referencia no falló ni una vez en 80 clics: el agente no tiene que adivinar coordenadas.
• Obtener el árbol tarda 36,69 ms por paso, menos que una captura, y no depende de la resolución de la pantalla.

Cuándo usar cada opción

• Árbol filtrado y visible con referencias: por defecto, para formularios, navegación y tareas repetitivas en webs bien construidas.
• Captura: cuando lo que importa es visual (un gráfico, un mapa, un lienzo, un PDF incrustado) o la web no tiene buena accesibilidad. Mejor como complemento puntual que en cada paso.
• Árbol completo: casi nunca para navegar; solo para extraer el texto de una página concreta.

Lo que dijimos en X y lo que hemos medido

En el hilo de X adelantamos cifras de una ejecución de nuestro agente sobre otras páginas y otra configuración: 166.000 tokens con capturas frente a 3.000 con el árbol filtrado (−97 %). Aquí lo hemos medido de forma reproducible y con el código publicado: la dirección se confirma, pero la cifra depende mucho de la web, la resolución, el modelo y de si el agente reenvía el historial. En esta tarea, la reducción fue del 85,4 % y, con historial completo, del 86,2 %. Que la obtención del árbol tarde menos de 0,8 s por paso y que los clics por referencia no fallen sí queda confirmado.

Limitaciones

• Una sola web, la nuestra, en local, con una tarea concreta. Webs con mala accesibilidad (botones sin nombre, todo en un lienzo) darían peores árboles.
• Los tokens de Claude se aproximan: su tokenizador de texto no es público; el texto se cuenta con o200k_base. Las imágenes se calculan con las fórmulas publicadas, no con la facturación real, y los modelos más recientes pueden contarlas de otra forma.
• No hay un modelo real decidiendo. Se miden las observaciones y la fiabilidad del clic por referencia, no la tasa de acierto de un agente completo ni la latencia del modelo.
• El árbol visible exige hacer scroll para llegar a elementos fuera de pantalla: ahorra tokens por paso, pero puede añadir pasos.
• Tiempos de un solo portátil con otras aplicaciones abiertas: sirven para el orden de magnitud.

Cómo repetirlo

Código, entorno y resultados en bruto, paso a paso y repetición a repetición: yeswelab-laboratorio/agentes-navegador-accessibility-tree-vs-screenshots-tokens en GitHub. Funciona con cualquier web estática cambiando los pasos de la tarea.

Relacionado

• Harness de agentes de IA: OpenClaw, Hermes Agent, Claude Code, Codex y goose
• Mortadelo: un agente Hermes que opera el laboratorio 24/7
• ¿Cuántos tokens más gasta el español que el inglés?

¿Vas a poner un agente a manejar el navegador en tu empresa? Te medimos coste, fiabilidad y riesgos con tus webs reales. Encárganos el experimento.