Understanding Keys

Keys help React identify which items have changed, been added, or removed. They're crucial for performance and correctness when rendering lists.

Why Keys Matter

Keys give elements a stable identity:

Good vs Bad Keys

When Index Keys Are OK

Index as key is acceptable in specific cases:

Generating Unique Keys

Exercise: Fix the Keys

Exercise: Composite Keys

Exercise: Key Validation

Key Takeaways

1. Keys identify items - Help React track changes efficiently
2. Use unique IDs - Database IDs or unique properties are best
3. Avoid index as key - Only for static, append-only lists
4. Composite keys - Combine properties when no single unique value
5. Keys must be unique - Among siblings, not globally