Melhores Práticas de Bibliotecas Essenciais
Um resumo condensado das 25 práticas mais importantes de bibliotecas essenciais para equipes móveis do Expo SDK 57 - extraído de todas as páginas desta seção.
//
Busque em todas as páginas da documentação
Um resumo condensado das 25 práticas mais importantes de bibliotecas essenciais para equipes móveis do Expo SDK 57 - extraído de todas as páginas desta seção.
npx expo install para módulos nativos: react-native-reanimated, react-native-gesture-handler, react-native-mmkv, @shopify/flash-list e @sentry/react-native devem corresponder à tabela de compatibilidade do SDK 57 - pins de npm manuais causam falhas de build nativo do EAS.
Audite dependências transitivas nativas antes de adotá-las: Cada biblioteca nativa é uma superfície de autolinking, tamanho de instalação e um item de reconciliação de atualização de SDK - execute npx expo-doctor e npx expo prebuild --dry-run em PRs de dependência.
TanStack Query gerencia o estado do servidor: Listas de API, perfis e configurações com carregamento/erro/cache pertencem ao Query - não ao Zustand, Context ou fetches de useEffect - @tanstack/react-query.
Zustand gerencia o estado da UI do cliente: Badges de carrinho, preferências de tema, flags de onboarding e filtros de chip - um store por domínio com seletores - zustand.
Nunca duplique dados de API em stores globais: Se o Query já cacheia products, não os espelhe no Zustand - a invalidação se torna manual e a limpeza de logout falha.
Conecte o ciclo de vida do Query móvel no bootstrap: onlineManager + NetInfo e focusManager + AppState em _layout - sem isso, a refetch em primeiro plano e a tentativa offline se comportam como padrões da web - TanStack Query.
Um QueryClient por app: Crie no layout raiz com useState(createQueryClient) - nunca por tela ou por navegador.
Sempre use seletores Zustand: useStore((s) => s.field) - useStore() sem argumentos re-renderiza a cada mudança de slice.
Segredos nunca em persistência Zustand ou MMKV em texto plano: Tokens e credenciais de refresh vivem em expo-secure-store - MMKV contém apenas preferências não secretas e rascunhos.
Escolha o armazenamento pela forma dos dados: AsyncStorage para pequenos JSON no boot; MMKV para leituras síncronas de hot-path; SQLite para dados relacionais offline - não um store para tudo - react-native-mmkv.
Versionar todo schema persistido: meta:schemaVersion para MMKV, PRAGMA user_version para SQLite, migrações com chave antes que novas formas cheguem à produção.
FlashList após profiling, não por padrão: Migre feeds quando o profiling do Android mostrar lentidão de scroll - mantenha FlatList para telas curtas de configurações - @shopify/flash-list.
estimatedItemSize é obrigatório no FlashList: Estimativas incorretas causam saltos de scroll e lacunas em branco - defina minHeight nas linhas para corresponder.
Memoize linhas de lista recicladas: memo em componentes de linha, renderItem estável via useCallback, estado apenas de props - visualizações recicladas expõem bugs de closure obsoleto.
Instale Reanimated e Gesture Handler como um par: Matriz do SDK 57 - react-native-reanimated ~4.0.0 e react-native-gesture-handler ~2.28.0 - react-native-reanimated & gesture-handler.
Plugin Babel por último: react-native-reanimated/plugin é sempre a última entrada em babel.config.js - depois npx expo start --clear.
GestureHandlerRootView na raiz: Envolva app/_layout.tsx - gestos de pan e sheets falham silenciosamente sem ele.
Importe Animated de Reanimated para worklets: Não de react-native - misturar APIs quebra UI controlada por gestos.
Reconstrua o dev client após mudanças em bibliotecas nativas: MMKV, FlashList, Sentry e Reanimated exigem rebuild do EAS ou dev client - reiniciar o Metro sozinho não é suficiente.
Um único relatador de crashes: @sentry/react-native com configuração guiada - não sentry-expo (depreciado) e não dois fornecedores - sentry-expo / @sentry/react-native.
Sentry.init antes de outras importações: No topo de _layout.tsx; Sentry.wrap na raiz uma vez - emparelhe com upload de source map em cada build de produção EAS.
Defina release e dist corretamente: release = versão nativa + build; dist = ID de atualização OTA - alinha relatórios de crash com o binário que os usuários executam - Sentry para React Native.
Desative bibliotecas não utilizadas antes de atualizações de SDK: Execute npx knip e npx depcheck - módulos nativos mortos inflacionam o autolinking e quebram a reconciliação - Noções Básicas de Bibliotecas Essenciais.
Checklist de PR de dependência: npx expo install, expo-doctor limpo, nota de teste em dispositivo, nenhuma biblioteca com problema duplicado, ADR atualizado se o padrão da equipe mudar.
Logout limpa todas as camadas: queryClient.clear(), reset do Zustand, limpeza da instância de usuário do MMKV, exclusão do token do SecureStore e tabelas de usuário do SQLite - cache obsoleto é um defeito de segurança.
TanStack Query + NetInfo, Zustand, MMKV (quando perfilado), FlashList (para feeds), Reanimated 4 + Gesture Handler e @sentry/react-native - instalados via npx expo install.
Apenas JS: @tanstack/react-query, zustand. Módulos nativos: sempre npx expo install. Commite alterações no lockfile com cada PR de dependência.
Comece com AsyncStorage. Adicione MMKV quando o profiling mostrar getItem assíncrono no caminho crítico - rascunhos de composer, flags de recursos lidos a cada montagem, flicker de persistência do Zustand.
Não - profile primeiro. Listas curtas e telas de configurações permanecem no FlatList até que o desempenho do scroll falhe no hardware Android alvo.
As seções State Management e Observability têm cookbooks completos - as páginas Essential Libraries são os cartões de instalação e padrões com links internos.
Versões da Stack: Esta página foi escrita para React 19.2.3, React Native 0.86.0 e Expo SDK 57 (
expo~57.0.4).
Revisado por Chris St. John·Última atualização: 19 de jul. de 2026