Dynamic data at scale. Performance, consistency, typing for REST, proto, GraphQL, websockets and more.

Simple TypeScript definition

class ArticleResource extends Resource {
  readonly id: string = '';
  readonly title: string = '';
  readonly body: string = '';

  pk() { return this.id; }
  static urlRoot = '/articles/';
}

One line data hookup

const article = useResource(ArticleResource.detail(), { id });
return (
  <>
    <h2>{article.title}</h2>
    <p>{article.body}</p>
  </>
);

Mutation

const update = useFetcher(ArticleResource.update());
return <ArticleForm onSubmit={data => update({ id }, data)} />;

And subscriptions

const price = useResource(PriceResource.detail(), { symbol });
useSubscription(PriceResource.detail(), { symbol });
return price.value;

...all typed ...fast ...and consistent

For the small price of 8kb gziped.    🏁Get started now

Features

• [x] Strong Typescript types
• [x] 🛌 React Suspense support
• [x] ⛓️ React Concurrent mode compatible
• [x] 🎣 Simple declarative API
• [x] 💰 Normalized response configurable caching
• [x] 💥 Tiny bundle footprint
• [x] 🛑 Automatic overfetching elimination
• [x] ✨ Optimistic updates
• [x] 🧘 Flexible to fit any API design (one size fits all)
• [x] 🔧 Debugging and inspection via browser extension
• [x] 🌳 Tree-shakable (only use what you need)
• [x] 🔁 Subscriptions
• [x] ♻️ Optional redux integration
• [x] 📙 Storybook mocking
• [x] 📱 React Native support
• [x] 🚯 Declarative cache lifetime policy

Special thanks

Thanks to @0xcaff, @melissafzhang and @alexiswolfish for their valuable feedback.