rn-performance
Otimizar o desempenho do React Native
Apps React Native podem sofrer com listas lentas, renderizações extras e travamentos da JS thread. Esta skill fornece padrões focados para telas FlatList mais rápidas, componentes memoizados, seletores otimizados, imagens em cache e profiling.
Instalar com meu Agente
Copie esta solicitação para o seu Agente. Ela inclui a página canônica do Skill e o manifesto.
Review the Skillstore skill "rn-performance" from https://skillstore.io/skills/cjharmath-rn-performance.md and its manifest at https://skillstore.io/api/skills/cjharmath-rn-performance/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.
Recursos legíveis por agentes
Use estes links quando um agente de IA, crawler ou script precisar de contexto limpo em vez de ler a página completa.
Testar
Usando "rn-performance". Uma tela de diretório de jogadores engasga ao rolar por centenas de linhas.
Resultado esperado:
- Use chaves de item estáveis baseadas nos IDs dos jogadores.
- Mova a renderização da linha para um componente de item memoizado.
- Adicione getItemLayout se a altura da linha for fixa.
- Considere FlashList se o profiling ainda mostrar gargalos na lista.
Usando "rn-performance". Um dashboard re-renderiza todos os cards quando um valor Zustand muda.
Resultado esperado:
- Evite selecionar a store inteira no dashboard.
- Use seletores específicos para o valor de cada card.
- Use comparação shallow quando um componente precisar de vários valores relacionados.
- Faça profiling novamente para confirmar que apenas os cards alterados renderizam.
Usando "rn-performance". Uma tela congela brevemente após a navegação quando calcula rankings.
Resultado esperado:
- Faça profiling da JS thread durante a navegação.
- Adie trabalho pesado até que as interações terminem.
- Memoize as entradas de ranking quando elas forem reutilizadas.
- Mova computações longas para fora do caminho de renderização inicial.
Auditoria de segurança
SeguroAll static findings were adjudicated as false positives. The detections come from Markdown fences, inline backticks, TypeScript examples, and a React.memo prop comparison in a documentation-only skill. No prompt injection, external command execution, network access, filesystem access, or data exfiltration intent was found in SKILL.md.
Fatores de risco
⚙️ Comandos externos (40)
Compartilhar e citar este relatório
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.
Copiar link do relatório
https://skillstore.io/skills/cjharmath-rn-performance/audits/7?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportBadge Markdown
[](https://skillstore.io/skills/cjharmath-rn-performance?utm_source=security_passport_badge)Badge HTML
<a href="https://skillstore.io/skills/cjharmath-rn-performance?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/cjharmath-rn-performance/security.svg" alt="Skillstore security assessment" loading="lazy"></a>Cartão incorporável
<iframe src="https://skillstore.io/embed/skills/cjharmath-rn-performance.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>Citações acadêmicas (APA · BibTeX · CFF)
Citação APA
CJHarmath. (2026). rn-performance security audit report (audit version 7) [Author version unspecified]. Skillstore. https://skillstore.io/skills/cjharmath-rn-performance/audits/7Citação BibTeX
@techreport{cjharmath-cjharmath-rn-performance-2026,
author = {CJHarmath},
title = {rn-performance security audit report (audit version 7)},
institution = {Skillstore},
year = {2026},
number = {7},
url = {https://skillstore.io/skills/cjharmath-rn-performance/audits/7},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "rn-performance security audit report (audit version 7)"
version: "unspecified"
type: report
authors:
- name: "CJHarmath"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/cjharmath-rn-performance/audits/7"
identifiers:
- type: other
value: "skillstore:cjharmath-rn-performance:audit:7"
description: "Skillstore immutable audit report identifier"
Pontuação do Skillstore
Por que esta pontuação Confiança das evidências: AltoO que você pode criar
Corrigir telas de lista com engasgos
Diagnosticar telas FlatList lentas e aplicar chaves estáveis, layout de itens, linhas memoizadas e configurações da janela de renderização.
Revisar desempenho de release
Verificar telas com muitas listas em busca de renderizações evitáveis, seletores caros, problemas de cache de imagens e bloqueios da JS thread antes do release.
Ensinar higiene de renderização
Usar os exemplos para explicar quando a memoização ajuda, quando adiciona overhead e como perfilar o comportamento de renderização.
Teste estes prompts
Revise esta tela de lista React Native em busca de problemas óbvios de desempenho. Foque em chaves estáveis, renderItem, getItemLayout e callbacks inline.
Analise estes componentes em busca de re-renderizações desnecessárias. Recomende onde React.memo, useMemo, useCallback ou StyleSheet.create ajudariam.
Revise este uso de Zustand em busca de problemas de seletores. Sugira seletores focados, comparação shallow e limites de componente mais seguros.
Crie um plano de desempenho priorizado para este recurso React Native. Inclua etapas de profiling, mudanças em listas, tratamento de imagens, memoização e riscos da JS thread.
Boas práticas
- Faça profiling primeiro, depois otimize o componente ou a lista que realmente causa atraso.
- Use props e seletores estáveis antes de adicionar memoização ampla.
- Valide melhorias em dispositivos reais, especialmente hardware Android de baixo custo.
Evitar
- Não memoize todo valor simples sem medir o custo.
- Não passe objetos ou callbacks inline para componentes filhos memoizados.
- Não selecione uma store Zustand inteira quando um componente precisa de apenas um valor.