1k-performance
Performance optimization for React/React Native — re-renders, memoization, FlashList, memory leaks, and bundle size.
Installation
Pick a client and clone the repository into its skills directory.
Installation
About this skill
Performance optimization for React/React Native — re-renders, memoization, FlashList, memory leaks, and bundle size.
How to use
Zainstaluj skill w swoim projekcie monorepo OneKey, wskazując ścieżkę do katalogu .claude/skills/1k-performance. Skill będzie dostępny jako asystent do analizy kodu React i React Native.
Gdy pracujesz nad komponentem lub funkcją, poproś skill o przeanalizowanie wydajności. Skill ma dostęp do narzędzi Read, Grep i Glob, dzięki czemu może skanować Twój kod i identyfikować problemy.
Dla wielu jednoczesnych requestów API zastosuj wzorzec executeBatched z limitem 3-5 równoczesnych zadań zamiast Promise.all na całej tablicy. Skill pokaże Ci przykład implementacji.
W listach z 100+ elementami użyj FlashList zamiast FlatList i ustaw windowSize={5}. Skill pomoże Ci zidentyfikować miejsca, gdzie ta optymalizacja będzie najskuteczniejsza.
Dla kosztownych obliczeń i re-renderów zastosuj memo, useMemo i useCallback. Skill wskaże komponenty i funkcje, które powinny być memoizowane na podstawie analizy Twojego kodu.
Dla operacji blokujących UI (ciężkie przetwarzanie) użyj InteractionManager lub setTimeout. Skill zweryfikuje, czy Twoje długotrwałe zadania są prawidłowo odłożone od głównego wątku.