Pular para o conteúdo
Skillpedia
Testes42 mil · #4740

competition-template-render-path

Faz seu agente investigar como templates são renderizados em aplicações web. Ele ajuda a entender o fluxo de dados entre o servidor e o cliente durante a renderização de páginas.

O que ela faz

Esta ferramenta ajuda a entender como uma página da web é construída e exibida, desde o pedido inicial até o resultado final na tela. Ela foca em como as informações são passadas entre o servidor e o navegador.

Quando usar

  • ✓Quando você quer ver como uma página é renderizada no servidor.
  • ✓Para entender como os dados são passados do servidor para o navegador.
  • ✓Ao investigar problemas em rotas ou na exibição de conteúdo.

Exemplo do que pedir para a IA

“Como a página X é renderizada no servidor e quais dados são enviados para o navegador?”

Quer saber mais? Abra as seções abaixo.

Como usar

O jeito mais fácil: copie a mensagem abaixo e cole no Claude, ChatGPT, Cursor ou outra IA. Ela lê a skill e segue as instruções.

Link da skill

https://github.com/zhaoxuya520/reverse-skill/blob/main/CTF-Sandbox-Orchestrator/competition-template-render-path/SKILL.md

Mensagem pronta para colar

Use esta skill para me ajudar: https://github.com/zhaoxuya520/reverse-skill/blob/main/CTF-Sandbox-Orchestrator/competition-template-render-path/SKILL.md Leia o arquivo SKILL.md desse link e siga as instruções dele na minha tarefa.
Como funciona

Ela mapeia o caminho completo: desde a rota escolhida, passando pela busca de dados, até a construção da página e a entrega final para o navegador. Compara como as regras de exibição funcionam em diferentes partes do processo.

Instalação

Jeito mais fácil: copie o link da skill e cole no Claude, ChatGPT ou Cursor pedindo para seguir as instruções.

No terminal (Claude Code, Codex, Cursor), na pasta do projeto:

npx skills add zhaoxuya520/reverse-skill --skill competition-template-render-path

Ou baixe só o arquivo:

curl -L https://raw.githubusercontent.com/zhaoxuya520/reverse-skill/main/CTF-Sandbox-Orchestrator/competition-template-render-path/SKILL.md -o SKILL.md
Conteúdo técnico (SKILL.md)

Tradução do texto original do autor no GitHub. Os comandos e códigos estão como no original.

Caminho de Renderização do Modelo de Competição

Use esta habilidade apenas como uma especialização downstream depois que $ctf-sandbox-orchestrator já estiver ativa e tiver estabelecido suposições de sandbox, propriedade de nós e prioridades de evidências. Se isso ainda não aconteceu, retorne para $ctf-sandbox-orchestrator primeiro.

Use esta habilidade quando o bug ou artefato decisivo estiver na resolução de rotas, contexto de renderização do servidor, dados do modelo ou entrega de hidratação, em vez de apenas em uma API JSON simples.

Início Rápido

  1. Mapeie a cadeia de renderização em ordem: resolução de rota, carregador ou busca de dados, contexto de modelo ou componente, HTML de resposta, carga útil de hidratação e tomada de controle do cliente.
  2. Registre o host, parâmetros de rota, alternâncias de visualização, alternâncias de locatário ou host e variáveis exclusivas do servidor antes de modificar qualquer coisa.
  3. Compare o controle de modelo com a aplicação do carregador ou manipulador.
  4. Preserve um caminho de renderização bem-sucedido e um caminho de renderização com falha com a menor diferença.
  5. Reproduza o ramo de solicitação para renderização mais simples que prova o comportamento decisivo.

Fluxo de Trabalho

1. Mapear Rota Para Contexto de Renderização

  • Registre o host, caminho, correspondência de rota, carregador, modelo, layout, blob de hidratação e chunk de inicialização do cliente para a visualização ativa.
  • Observe se a resposta é HTML SSR, HTML estático mais hidratação, conteúdo renderizado na borda ou um fragmento de modelo usado por outra rota.
  • Mantenha o contexto exclusivo do servidor e o contexto visível do cliente separados.

2. Rastrear Limites de Modelo e Aplicação

  • Mostre onde permissões, flags de recursos, estado de visualização, seleção de locatário ou alternâncias baseadas em host são aplicadas.
  • Compare o controle em nível de modelo, o controle em nível de carregador e a aplicação do manipulador de backend em vez de confiar em qualquer camada.
  • Registre campos ocultos, dados inline, JSON de hidratação, meta tags ou partes alternativas que expõem o ramo decisivo.

3. Reduzir ao Caminho de Renderização Decisivo

  • Comprima o resultado para a sequência mais simples: solicitação -> correspondência de rota -> contexto de carregador ou modelo -> saída renderizada ou dados ocultos -> efeito resultante.
  • Declare claramente se a fraqueza decisiva reside na seleção de rota, construção de contexto de modelo, entrega de hidratação servidor-cliente ou aplicação incompatível entre renderização e manipulador.
  • Se a tarefa se tornar principalmente recuperação de bundle emitido ou reconstrução de mapa de origem, passe para a habilidade de bundle mais restrita.

Leia Esta Referência

  • Carregue references/template-render-path.md para a lista de verificação de renderização, lista de verificação de hidratação e empacotamento de evidências.

O Que Preservar

  • Nomes de rotas, nomes de carregadores, modelos, layouts, chaves de hidratação e alternâncias de host ou visualização
  • Um par de sucesso ou falha que mostra onde o comportamento da camada de renderização diverge
  • Uma sequência mínima de solicitação para renderização que atinge o ramo decisivo
Perguntas frequentes

O que é 'renderização no servidor' (SSR)?

É quando o servidor já monta a página completa antes de enviá-la para o seu navegador, o que pode deixar o carregamento mais rápido.

O que é 'hidratação'?

É o processo onde o navegador, após receber a página do servidor, adiciona interatividade (como botões que funcionam) sem precisar recarregar tudo.

Por que comparar 'template gating' com 'handler enforcement'?

Para garantir que as regras de quem pode ver o quê (gating) são aplicadas de forma consistente tanto na hora de montar a página (template) quanto na hora de processar a solicitação (handler).

Detalhes

Descrição original do autor

Internal downstream skill for ctf-sandbox-orchestrator. CTF-sandbox workflow for SSR, template rendering, route loaders, hydration payloads, server-client render boundaries, and template-to-handler enforcement gaps. Use when the user asks to inspect SSR or template routes, trace render context or hydration data, compare template gating with handler enforcement, explain preview or hidden-route rend

repo: zhaoxuya520/reverse-skill

Popularidade

Estrelas no GitHub
42 mil
Posição no ranking
#4740
Licença
MIT
Atualizada em
22/09/2026

Essa skill é útil?

0

Entre para votar.

Comentários

  • …

Mais skills deste repositório

Skills parecidas