React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.
72
58%
Does it follow best practices?
Impact
96%
1.15xAverage score across 3 eval scenarios
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./skills/react-best-practices/SKILL.mdServer-side caching and non-blocking operations
Font loaded at module level
100%
100%
Font awaited inside handler
100%
100%
React.cache used for getCurrentUser
100%
100%
getCurrentUser takes no object argument
100%
100%
getCurrentUser called multiple times
100%
100%
LRU cache used for getUser
100%
100%
LRU cache max and ttl set
100%
100%
LRU cache miss checks and sets
100%
100%
after() used for audit logging
0%
100%
Response returned before after() work
0%
100%
No module-level mutable request state
100%
100%
LRU and React.cache imports correct
100%
100%
Async parallelism with partial dependencies and analyzable imports
better-all imported
100%
100%
all() used for loadDashboardData
66%
100%
Config starts immediately
100%
100%
Team depends on user via this.$
0%
50%
Activity depends on user via this.$
0%
50%
PAGE_MODULES values are import functions
50%
100%
No dynamic path construction
100%
100%
loadPage invokes the import function
100%
100%
All four data fields returned
100%
100%
Valid TypeScript
100%
100%
Client-side hooks: localStorage versioning, deduped listeners, module-level caching
localStorage key is versioned
100%
100%
Minimal fields stored
100%
100%
localStorage wrapped in try-catch
100%
100%
Lazy useState initialization
100%
100%
useSWRSubscription used for online status
100%
100%
Single listener key used
100%
100%
Online/offline events subscribed
100%
100%
Module-level Map cache for formatSlug
100%
100%
Cache is a Map, not a hook
100%
100%
Cache check before computation
100%
100%
useFormatSlug calls formatSlug
100%
100%
swr/subscription imported
100%
100%
b9c8ee0
Table of Contents
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.