client-suspense

client-suspense

ClientSuspense component (client-only Suspense)

A component that suspends only on the client side.

Usage

For example, if you use nextjs with streaming related APIs, Suspense will be suspended on the server side. To avoid this you can use ClientSuspense like this:

import { ClientSuspense } from 'client-suspense';

export const App = () => {
  return (
    <div>
      <ClientSuspense
        fallback={(
          <Spinner />
        )}
      >
        <OtherComponent />
      </ClientSuspense>
    </div>
  );
};

And that's all it takes!

Installation

Recommend to use yarn for dependency management:

yarn add client-suspense

License

client-suspense is MIT licensed.