Prompt completo para gerar um Rastreador de Contornos de Blob com HTML/CSS/JS

Objetivo: criar um prompt útil e interessante para ferramentas de IA que gere, explique e forneça um exemplo de código de rastreador de contornos de blobs usando HTML, CSS e JavaScript. O prompt deve exigir:
- entrega de um único arquivo HTML com CSS e JS embutidos que implemente um rastreador de blobs em tempo real usando canvas 2D, capaz de usar entrada de vídeo ou webcam, com detecção de blobs e contornos, além de desempenho estável em dispositivos móveis;
- uma versão CodePen-ready com instruções claras para copiar/colar o código e iniciar rapidamente;
- código bem comentado, com explicações linha a linha, e controles de usuário (sliders/inputs) para ajustar sensibilidade, tamanho mínimo do blob, número máximo de blobs, cores e velocidade de renderização;
- explicação de alto nível do funcionamento, cobrindo: captura de vídeo, pré-processamento (por exemplo, grayscale/blur), detecção de blobs, rastreamento de contornos, renderização no canvas e gerenciamento de recursos;
- notas de desempenho e boas práticas (usando requestAnimationFrame, minimizando re-renderizações, gerenciamento de memória, compatibilidade com Chrome, Firefox, Edge e Safari);
- variações úteis para adaptar o código para trabalhar com outra fonte de vídeo ou com uma imagem estática, além de suportar múltiplas fontes;
- uma lista de perguntas de verificação para o usuário do prompt (ex.: resolução de entrada, taxa de quadros, ambiente de iluminação, etc.);
- recomendações sobre onde compartilhar ou publicar o código (CodePen, JSFiddle) e como evoluir o projeto;
- análise de qual IA entre as opções a seguir é mais adequada para esse tipo de tarefa: chatgpt, claude, deepseek, gemini, copilot, perplexity; atribuição de rating de 1 a 5 estrelas, nível de dificuldade (beginner, intermediate, advanced) e is_featured (true/false) apenas se o conteúdo for excepcional; sugestão de tags relevantes e um tópico proposto.

Formato de saída desejado:
- código pronto (HTML/CSS/JS em um único arquivo) com comentários explicativos;
- seção de explicação passo a passo do funcionamento do código;
- notas de compatibilidade, desempenho e dicas de melhoria;
- referência de publicação (CodePen/Fiddle) e variações/atalhos;
- análise de ferramenta de IA recomendada com rating, dificuldade, is_featured, tags e tópico.

Observações de implementação: mantenha o conteúdo acessível para quem está aprendendo, mas inclua detalhes técnicos suficientes para desenvolvedores intermediários/avançados. Este prompt é especialmente útil para quem quer entender rastreamento de blobs em tempo real, processamento de vídeo em canvas e construção de interfaces de controle simples para visualização em tempo real.