Análise de website com o REA: o que o agente consegue ver em uma página que não é sua?

Fala aí, beleza? Dá pra entender como um comportamento de frontend foi construído sem ter o código-fonte na mão

Mas tem um porém: tu precisa saber o que o agente realmente enxerga 🙂

O REA (Reverse Engineer Anything) é um projeto open source que roda como servidor MCP e como CLI

Ele entrega pro seu agente de código ferramentas pra inspecionar software sem acesso ao código-fonte e explicar o que aquele software faz

O projeto viralizou no X e no YouTube a partir de 8 de outubro de 2026, e a lista de alvos é grande: binários, APKs, firmware, .NET e por aí vai

Neste post o foco é UM alvo só: website. O que o agente vê, pra que serve e onde a inspeção para

Formação Recomendada

Formação Claude Code

Domine Claude Code do absoluto zero até o avançado

• 120 aulas
• 4 projetos
• 9h 45min

Conhecer formação

Como o REA funciona quando o alvo é um website

O REA roda localmente como servidor MCP

O fluxo é simples: o agente chama as ferramentas do REA, o REA inspeciona o alvo com o motor adequado e devolve achados estruturados, junto com as limitações e os pontos desconhecidos

No caso de website, o motor é o CDP

Que CDP? É o Chrome DevTools Protocol, o protocolo que o próprio DevTools do Chrome usa pra conversar com o navegador e enxergar página, rede, console e tal

Se tu já abriu a aba Network pra caçar uma requisição, a ideia é bem semelhante, só que quem olha é o agente 😀

A observação é passiva e acontece sobre um navegador da família Chrome que já está rodando e que é seu

Ou seja, a página pode ser de outra pessoa, mas o navegador observado é o seu

Outro ponto massa: todo registro de evidência informa qual provider gerou aquele resultado e quais são as limitações por trás dele

Isso muda MUITO a conversa com o agente, porque ele não te devolve uma certeza inventada, devolve um achado com contexto

Tome cuidado com o repositório!

O oficial é o github.com/morluto/rea

Existem outros com nome parecido, como rea-tools/rea, ChristopheAI/reverseengineeranything e forks variados. Nenhum deles é o projeto oficial

O que cada tipo de observação revela sobre o frontend

Pra website, o REA retorna estrutura da página, scripts, observações de rede e screenshots (quando você pede)

Por baixo, a observação via CDP cobre página, scripts, recursos, rede, console, storage e workers, e de forma opcional traz o shape dos corpos JSON, screenshots, source maps e achados sobre bundles

Bora ver pra que serve cada pedaço?

Estrutura da página: o que está montado na tela

A estrutura da página mostra como o conteúdo está organizado no momento da observação

Serve pra responder perguntas do tipo: esse bloco veio renderizado ou foi montado depois? Qual elemento segura aquele componente que te chamou atenção?

Scripts e recursos: quem roda e o que é carregado

Aqui o agente enxerga quais scripts e recursos a página carregou

É o ponto de partida pra descobrir qual script está por trás de um comportamento, tipo aquele filtro que atualiza a lista sem recarregar a página

Rede: de onde vem o dado que aparece na tela

As observações de rede mostram as requisições que a página fez

E, de forma opcional, o shape dos corpos JSON, ou seja, o formato dos dados (campos e estrutura), sem que o foco seja o conteúdo em si

Isso é ouro quando tu quer saber de onde vem um número na tela ou qual chamada é disparada quando o usuário clica em algo

Console, storage e workers: o que acontece nos bastidores

O console mostra mensagens e erros que a página gera durante o uso

O storage revela o que fica guardado no navegador, tipo preferências ou estado que sobrevive a um refresh

E os workers mostram trabalho rodando fora da thread principal, o que explica muito comportamento "mágico" de cache e de atualização em segundo plano

Screenshots: o estado visual como evidência

Screenshots vêm quando solicitados

Servem pra amarrar o que o agente achou na rede ou no storage com o que de fato apareceu na tela naquele momento

Source maps e achados sobre bundles: perto do código original

Source maps ligam o código empacotado do bundle ao código mais próximo do original

Quando a página expõe source maps, o agente consegue entender muiiito melhor como um comportamento foi organizado

Quando não expõe, sobram os achados sobre o bundle em si, que já ajudam mas são mais limitados

Website, captura HAR ou app JavaScript/Electron: qual alvo usar

Aqui é onde muita gente se confunde

O alvo website é inspeção de superfície. Algumas perguntas pedem outro alvo do próprio REA

Se liga nisso: a inspeção estática de JavaScript funciona sem Hopper, Ghidra ou IDA

Essas ferramentas ficam pra análise nativa profunda, então pra frontend tu não precisa de PC da Nasa nem de suíte de engenharia reversa instalada haha

Limites da análise de website com o REA

Veredito honesto: o alvo website mostra o que chega ao navegador

O que roda no cliente e trafega na rede, sim. O backend e o código-fonte original, não entram nessa conta pela superfície

E o quanto dá pra chegar perto do código original depende do que a página expõe em source maps

A parte boa é que essas limitações não ficam escondidas: elas vêm declaradas em cada registro de evidência, junto com o provider que gerou o resultado

Outro ponto: o alvo website ainda está evoluindo

Existe uma issue aberta com o roadmap de engenharia reversa de websites, falando em evidência de rede, assets capturados e adapters modulares

Então o que tu vê hoje é uma foto de um alvo em movimento…

O que você precisa para analisar um website com o REA

A lista é curta:

• Um navegador da família Chrome rodando e que seja seu
• Node.js 22.x (22.19 ou superior), 24.x (24.11 ou superior) ou 26 em diante, mais npm
• Um agente suportado: Claude Code, Codex, Cursor, Gemini CLI ou Grok Build

Com isso em mãos, o caminho é este:

1. Confira sua versão do Node

node --version

O erro comum deste passo: estar numa versão fora das faixas suportadas, tipo um 22 anterior ao 22.19 ou um 24 anterior ao 24.11

2. Rode o setup, que registra o servidor MCP e instala as instruções de skill correspondentes ao seu agente

npx rea-agents setup

O erro comum deste passo: seguir instrução de um repo com nome parecido em vez do oficial morluto/rea

3. Se quiser a CLI global, instale com npm

npm install --global rea-agents

E o que o setup mexe na sua máquina?

Antes de alterar qualquer coisa, ele valida a configuração existente, mostra os caminhos exatos e os efeitos externos e pede aprovação final, com Não como resposta padrão

Selecionar uma capacidade não seleciona todos os alvos detectados e não autoriza nenhuma mudança. Bem diferente do next, next e finish que a gente tá acostumado 😛

Se o seu agente também toca ambiente de verdade, vale revisar o que configurar antes, como falamos em Claude Code com dados reais

O REA é gratuito: código sob licença MIT e pacote npm também sem custo

Vale usar o REA para entender um frontend?

Pra entender comportamento de frontend pela superfície que o navegador observa, vale sim

Tu ganha estrutura da página, scripts, recursos, rede, console, storage e workers, além de screenshots quando tu pede e source maps quando a página expõe

E tudo isso vem como evidência com o provider e as limitações declaradas, sem certeza inventada pelo agente

Só não espera backend nem código-fonte original: o alvo website mostra o que chega ao navegador, e isso já resolve muiiito caso de "como diabos fizeram isso?" haha

Pra analisar tráfego offline, grava um HAR e usa esse alvo

Pra código empacotado em app, o caminho é o alvo JavaScript/Electron

Próximo passo: abre o repositório oficial github.com/morluto/rea, roda o setup no seu agente e acompanha a issue do roadmap de websites, porque esse alvo ainda vai mudar bastante

Até o próximo post! =)