Error Boundary

React 🟡 Mid

Definition

Composant classe qui intercepte les erreurs JavaScript dans son sous-arbre et affiche un UI de secours au lieu de crasher toute l'application.

Analogie

Comme un fusible electrique : il saute pour proteger le reste du circuit.

Exemple de code

class ErrorBoundary extends React.Component {
  state = { hasError: false };
  static getDerivedStateFromError() { return { hasError: true }; }
  render() {
    if (this.state.hasError) return <p>Oups!</p>;
    return this.props.children;
  }
}

Cas d'usage

Encapsuler des sections critiques pour que le reste de l'app continue de fonctionner en cas d'erreur.

Anti-pattern

Ne pas logger l'erreur dans componentDidCatch, perdant des informations precieuses en production.

Termes lies

#core#interview#resilience