Writing Resilient Components — overreacted
13 hours ago
- Style guides and linting can be distracting; focus on component design principles for resilience.
- Principle 1: Don't stop data flow — avoid copying props into state, ensure side effects respect prop/state changes, and use hooks like useEffect with explicit dependencies.
- Principle 2: Always be ready to render — avoid relying on legacy lifecycle methods like componentWillReceiveProps; components should handle re-renders gracefully.
- Principle 3: No component is a singleton — design components to work correctly when multiple instances are mounted (e.g., avoid global state cleanup on unmount).
- Principle 4: Keep local state isolated — distinguish between truly local state (e.g., UI interactions) and global state (e.g., server data); don't hoist local state unnecessarily.
- Use Prettier for formatting and lint for catching bugs, not for enforcing arbitrary stylistic rules.