frontend-design
81Crie Interfaces Frontend Distintivas
Interfaces genéricas geradas muitas vezes parecem previsíveis e fracas. Esta skill orienta Claude, Codex e Claude Code para um design frontend distintivo e pronto para produção.
Otimizar o desempenho do Next.js
Aplicações Next.js podem ficar lentas devido a bundles grandes, cache fraco e mídia não otimizada. Esta habilidade orienta Claude, Codex e Claude Code em melhorias de desempenho focadas para apps em produção.
Copie esta solicitação para o seu Agente. Ela inclui a página canônica do Skill e o manifesto.
Review the Skillstore skill "nextjs-optimization" from https://skillstore.io/skills/atman36-nextjs-optimization.md and its manifest at https://skillstore.io/api/skills/atman36-nextjs-optimization/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Seu Agente ainda deve apresentar o plano e solicitar qualquer confirmação exigida pela política de segurança.
Use estes links quando um agente de IA, crawler ou script precisar de contexto limpo em vez de ler a página completa.
Usando "nextjs-optimization". Revise meu app Next.js antes do lançamento.
Resultado esperado:
Usando "nextjs-optimization". Ajude a melhorar o LCP na página inicial.
Resultado esperado:
Usando "nextjs-optimization". Encontre problemas de tamanho de bundle neste app.
Resultado esperado:
The static findings are false positives caused by Markdown code fences, inline backticks, and Next.js documentation examples. No prompt injection, credential access, malicious network behavior, command injection, or hidden execution intent was found in SKILL.md.
Compartilhe o relatório de avaliação versionado, o badge neutro, o cartão incorporável e as citações. A Skillstore apresenta evidências sem decidir se este Skill é seguro.
https://skillstore.io/skills/atman36-nextjs-optimization/audits/10?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/atman36-nextjs-optimization?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/atman36-nextjs-optimization?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/atman36-nextjs-optimization/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/atman36-nextjs-optimization.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>AI-Vibe-Prompts. (2026). nextjs-optimization security audit report (audit version 10) [Author version 1.0.0]. Skillstore. https://skillstore.io/skills/atman36-nextjs-optimization/audits/10@techreport{ai-vibe-prompts-atman36-nextjs-optimization-2026,
author = {AI-Vibe-Prompts},
title = {nextjs-optimization security audit report (audit version 10)},
institution = {Skillstore},
year = {2026},
number = {10},
url = {https://skillstore.io/skills/atman36-nextjs-optimization/audits/10},
note = {Author version 1.0.0}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "nextjs-optimization security audit report (audit version 10)"
version: "1.0.0"
type: report
authors:
- name: "AI-Vibe-Prompts"
date-released: "2026-07-09"
url: "https://skillstore.io/skills/atman36-nextjs-optimization/audits/10"
identifiers:
- type: other
value: "skillstore:atman36-nextjs-optimization:audit:10"
description: "Skillstore immutable audit report identifier"
Auditar um candidato à produção em busca de problemas de imagem, fonte, cache, metadados e configuração de build antes do lançamento.
Encontrar mudanças que possam melhorar LCP, FID e CLS por meio de escolhas de renderização, mídia e carregamento de scripts.
Identificar componentes grandes, limites de cliente desnecessários e importações que aumentam o JavaScript enviado aos usuários.
Use a habilidade de otimização do Next.js para revisar este app em busca de problemas de imagem, fonte, metadados e cache. Mostre primeiro as principais correções.
Audite as rotas principais em busca de problemas de LCP, FID e CLS. Sugira mudanças que provavelmente melhorem as pontuações de desempenho do Lighthouse.
Inspecione as páginas e componentes do App Router. Encontre componentes de cliente desnecessários, limites de Suspense ausentes e melhores escolhas de renderização estática ou dinâmica.
Crie um relatório de otimização para produção deste app Next.js 15. Inclua riscos de tamanho de bundle, estratégia de cache, correções de imagens e fontes, metadados de SEO e etapas de validação.
Autor
AI-Vibe-PromptsLicença
MIT
Versão do autor
v1.0.0
Revisão da Skillstore
r1
Repositório
https://github.com/Atman36/AI-Vibe-Prompts/tree/main/.claude/skills/framework-specific/nextjs-optimizationReferência
7db9b9f06e0ab79c575b58bc48c4d8dc9849f424
Atualidade da manutenção
20/07/2026
Uso
9 downloads · 307 visualizações
Estrutura de arquivos
📄 SKILL.md
Crie Interfaces Frontend Distintivas
Interfaces genéricas geradas muitas vezes parecem previsíveis e fracas. Esta skill orienta Claude, Codex e Claude Code para um design frontend distintivo e pronto para produção.
Analise Bases de Codigo com Relatorios Estruturados
Equipes precisam de uma forma rapida de entender repositorios desconhecidos antes de altera-los. Esta skill orienta Claude, Codex e Claude Code em verificacoes de estrutura, dependencias, arquitetura, qualidade e seguranca.
Crie uma Estratégia Prática de Testes
As equipes frequentemente adicionam testes sem escopo, ferramentas ou metas de cobertura claros. Esta skill fornece um plano prático para testes com Vitest, Playwright e CI.
Gerencie Fluxos de Trabalho Git com Padrões de Equipe
Equipes precisam de commits, branches e hábitos de revisão consistentes para manter o histórico legível. Esta skill oferece a Claude, Codex e Claude Code uma checklist prática de fluxo de trabalho Git.
Validar Código Antes do Lançamento
As equipes precisam de verificações repetíveis antes que o código seja commitado, enviado por push ou implantado. Esta skill orienta Claude, Codex e Claude Code por linting, verificações de tipo, testes, builds, auditorias e verificações de commit.
Crie Recursos de Frontend Prontos para Produção
por davila7
As equipes de frontend precisam de orientações consistentes sobre React e Next.js em diferentes projetos. Esta habilidade fornece fluxos de trabalho de referência, práticas de qualidade e scripts auxiliares para análise de frontend.
Planejar a Arquitetura do App Router do Next.js
por 89jobrien
Equipes que usam Next.js podem ter dificuldade para escolher rotas, componentes, carregamento de dados e etapas de migração. Esta skill oferece orientação estruturada de arquitetura para App Router, Server Components e desempenho.
Otimize o Desempenho de React e Next.js
por vercel-labs
Aplicativos React e Next.js frequentemente perdem velocidade por causa de waterfalls, bundles grandes e re-renderizações evitáveis. Esta skill oferece aos agentes regras concretas para mudanças mais seguras com foco em desempenho.
Crie Aplicações Fullstack com Orientação Sênior
por alirezarezvani
Projetos fullstack frequentemente precisam de configuração consistente, escolhas de arquitetura e verificações de qualidade. Esta skill fornece scripts e referências para trabalhos com React, Next.js, Node.js, GraphQL e PostgreSQL.
Implementar React View Transitions
por vercel-labs
React view transitions são fáceis de posicionar incorretamente, resultando em animações que falham silenciosamente ou geram ruído visual. Esta skill orienta as escolhas de animação para rotas, Suspense, listas e elementos compartilhados.
Revise Código quanto à Segurança e Qualidade
por AutumnsGrove
Revisões manuais de código podem deixar passar problemas de segurança, desempenho e testes. Esta skill oferece ao Claude, Codex e Claude Code um fluxo de trabalho estruturado de revisão com checklists e orientações para varreduras auxiliares.