Why need to use?
@suspensive/react is used with the following motivation:
React Suspense need to avoid Server side rendering sometimes.
If you have used React Suspense in SSR environment like Next.js, you may encounter error like below.
It's why clientOnly prop of <Suspense/>
is added in this library.
ErrorBoundary more simply
bvaughn/react-error-boundary (opens in a new tab) that provide ErrorBoundary is popular library to use React's error-boundary concept declaratively. ErrorBoundary of bvaughn/react-error-boundary have fallback prop named like FallbackComponent, fallbackRender, fallback. We wanted to use the existing ErrorBoundary's somewhat complex fallback interface in something simpler like @suspensive/react's <ErrorBoundary/>
.
It's why <ErrorBoundary/>
is added in this library.
Resetting multiple <ErrorBoundary/>
s outside of fallback itself easily
To reset <ErrorBoundary/>
, you can use reset method provided by fallback prop of <ErrorBoundary/>
.
but If you want to reset multiple <ErrorBoundary/>
s outside of its fallback, you have to provide new element of resetKeys to props of each <ErrorBoundary/>
s. but If you use @suspensive/react's <ErrorBoundaryGroup/>
, You don't need to do this tiresome. <ErrorBoundaryGroup/>
will reset multiple <ErrorBoundary/>
s easily.
It's why <ErrorBoundaryGroup/>
is added in this library.