REA vs Chrome DevTools: investigação com agente ou depuração direta?

Escolha o Chrome DevTools para depuração direta no navegador, edições de DOM/CSS, pontos de interrupção em JavaScript e inspeção de desempenho. Escolha o REA quando quiser que um agente de programação investigue uma página no navegador, relacione scripts ou requisições selecionados a uma pergunta e explique as conclusões com evidências.

O fluxo de trabalho do REA para navegador exige uma conexão local com o navegador previamente configurada. Ele não inspeciona um site só porque alguém insere um URL neste site da comunidade. Este guia independente fornece links para a documentação oficial do REA para navegador e a documentação do Chrome DevTools.

Como os dois fluxos de trabalho para navegador diferem?

O Chrome DevTools vem integrado ao Chrome. Seus painéis permitem que um desenvolvedor inspecione uma página em execução, altere estilos, pause o JavaScript, inspecione requisições, registre fluxos de uso e examine desempenho e memória. Você controla a investigação diretamente no navegador. A visão geral do DevTools do Google documenta esses fluxos de trabalho.

O REA conecta seu agente de programação a observações selecionadas do navegador, incluindo a estrutura da página, os scripts carregados, a atividade de rede e as capturas de tela solicitadas. O agente usa essas observações para responder a uma pergunta específica ou propor uma reconstrução. O REA também tem fluxos de trabalho separados para arquivos de aplicativos locais e binários nativos, que vão além do escopo habitual de depuração de páginas do DevTools. O README do REA distingue essas categorias de alvos.

O que você quer fazer?	Ponto de partida recomendado	Entrada	Resultado ou vantagem
Ajustar imediatamente o espaçamento, o layout ou uma regra CSS	Chrome DevTools	Elemento DOM selecionado	Edição de estilos em tempo real e retorno visual
Pausar em uma linha de JavaScript e inspecionar o estado	Chrome DevTools	Página em execução e ponto de interrupção	Controle direto do depurador e inspeção de variáveis
Encontrar um gargalo de carregamento ou um problema de memória	Chrome DevTools	Registro de desempenho ou perfil de memória	Linhas do tempo especializadas e painéis de diagnóstico
Perguntar a um agente como funciona um recurso no navegador	Fluxo de trabalho do REA para navegador	Conexão local previamente configurada e pergunta específica	Código e observações selecionados, interpretados pelo agente
Rastrear um recurso de um pacote Electron até o código nativo	Fluxos separados do REA para aplicativos e código nativo	Artefatos locais do aplicativo e provedores adequados	Evidências em vários tipos de alvo

Quando o Chrome DevTools é a melhor escolha?

Use o DevTools quando você já souber o que inspecionar e quiser uma resposta imediata. Selecionar um elemento, testar um estilo, inserir um ponto de interrupção ou revisar uma requisição costuma ser uma ação direta e rápida. O DevTools dispensa a configuração e a interpretação adicionais envolvidas na interação com um agente.

O DevTools também é o melhor ponto de partida para trabalhos detalhados de desempenho e memória no navegador. O painel Performance apresenta registros de carregamento e execução; as ferramentas de Memory ajudam a investigar problemas de memória. A capacidade do REA de coletar observações do navegador não implica uma interface equivalente para cada diagnóstico do DevTools. Comece pela documentação de desempenho do Google ou pela documentação de memória para essas tarefas.

Para uma requisição que falha, o painel Network oferece acesso direto à atividade registrada pelo navegador. Um agente pode ajudar a interpretar as evidências, mas uma camada adicional de agente é desnecessária quando o status da resposta ou o conteúdo da requisição já explica o problema.

Quando uma investigação com o REA ajuda?

O REA é útil quando sua pergunta exige várias observações relacionadas e você quer que o agente de programação explique a relação entre elas. Pergunte sobre um comportamento específico, identifique a página-alvo e solicite o código carregado e as observações relevantes. Um prompt amplo, como “explique este site inteiro”, oferece menos formas claras de conferir a resposta.

O exemplo oficial do dinossauro no REA é uma ilustração concreta. O REA lê o script carregado por um jogo de dinossauro derivado do Chromium. O agente identifica uma velocidade inicial de 6, aceleração de 0.001 por atualização sem colisão e velocidade máxima de 13, e usa essa regra em um pequeno jogo com velocidade ajustável. O exemplo inclui referências ao código-fonte e uma verificação controlada da regra de velocidade.

Esse exemplo é de autoria do projeto REA. Ele não é uma evidência de que qualquer site possa ser reconstruído e não deve ser apresentado como a experiência de um usuário independente da comunidade. Nossa coleção de casos da comunidade mantém as publicações das fontes separadas dos exemplos oficiais detalhados.

Como preparar uma investigação no navegador?

Siga as etapas de preparação do navegador no REA para um navegador da família Chrome e uma conexão local de depuração. Forneça ao agente o URL da página desejada, o endpoint local exigido pelo guia e uma pergunta. Siga o escopo de conexão definido no guia, em vez de expor um serviço de depuração à internet pública.

Um prompt para uma página de demonstração sua poderia ser:

Use o REA com a conexão local do navegador previamente configurada para inspecionar
minha página de demonstração. Explique como a caixa de busca atualiza os resultados.
Mostre o script carregado relevante e as localizações no código-fonte.
Liste as observações que sustentam a explicação e os pontos desconhecidos.

Confira se as evidências retornadas descrevem a ação e o estado que você pretendia investigar. Se o aplicativo tiver várias páginas ou estados, um script de um estado pode não explicar outro. No DevTools, repita manualmente a ação quando necessário para confirmar a requisição ou o caminho de execução descrito pelo agente.

Alguma das ferramentas pode mostrar o código-fonte do backend do site?

Os scripts e as requisições visíveis no navegador revelam o comportamento do lado do cliente exposto àquela sessão. Eles não revelam automaticamente o código privado da implementação do servidor, o conteúdo de bancos de dados ou regras de negócio ocultas. Uma resposta pode mostrar o que o servidor retornou para uma requisição sem explicar todas as etapas internas que a produziram.

Trate o projeto de backend proposto por um agente como uma hipótese, a menos que outras evidências obtidas com autorização o sustentem. Reproduzir uma interface observada e recuperar sua implementação original são afirmações diferentes. As evidências e limitações do REA ajudam a definir esse limite; o agente ainda precisa respeitá-lo.

As capturas do navegador podem incluir dados específicos da sessão, corpos de requisições ou URLs sensíveis. O REA realiza a análise localmente, mas os resultados retornados pelas ferramentas são enviados ao seu agente de programação e ficam sujeitos à política de dados do provedor do modelo. As perguntas frequentes oficiais do REA explicam esse limite no fluxo dos dados. Compartilhe apenas observações adequadas à sua tarefa e à sua autorização.

Quais dúvidas surgem ao escolher entre as duas ferramentas?

O REA substitui o Chrome DevTools?

O REA oferece uma interface de investigação para agentes de programação. O DevTools oferece depuração direta no navegador e painéis especializados de diagnóstico. Usar o DevTools para verificar uma conclusão do REA é uma combinação útil.

Preciso do Hopper, Ghidra ou IDA para um site?

O fluxo de trabalho do REA para navegador exige um navegador compatível e a conexão local documentada. Os mecanismos de análise de código nativo são usados separadamente para análise aprofundada de binários nativos, não para a inspeção comum de páginas.

O REA é executado neste site?

Não. reverseengineeranything.tools publica exemplos da comunidade e guias. Instale o pacote oficial do REA na sua própria máquina para executar investigações; este site não tem recurso de upload para análise nem de execução hospedada.

Posso usar o DevTools sem um modelo de IA?

Sim. O Chrome DevTools está disponível diretamente no Chrome. A CLI do REA também pode executar fluxos de trabalho compatíveis sem um agente de programação, enquanto uma investigação com o REA conduzida por um agente usa o acesso ao modelo e os termos do próprio cliente.

Como começo a usar o REA com um agente?

Leia nosso guia da primeira investigação e siga os guias oficiais de configuração e navegador. Confira a lista de ferramentas do servidor instalado; os recursos documentados no branch main do repositório podem ser mais recentes que o pacote publicado.