React Best Practices Audit

Focused audit layer for React and Next.js runtime/rendering issues. Start with the universal checks, then route to the reference that matches the user's specific question.

Universal Checks (no exceptions — run these every time)

These checks take seconds to scan for and catch common high-impact mistakes. Skip them only if you have already verified them in the same session.

1. Components defined inside other components They are re-created on every render; state resets and memoization is lost. Extract to module scope.

2. Array index as key in dynamic lists key is React's identity anchor. When lists reorder, insert, or delete, an index key reassigns identity to the wrong element. Use a stable ID from the data. Exception: truly static, never-reordered lists.