finds.dev← search

// the find

jherr/fast-react-context

★ 376 · TypeScript · updated May 2024

A step-by-step tutorial repo (not a library) showing how to build a custom React context that lets components subscribe to state slices and skip re-renders, instead of relying on the default Context API where every consumer re-renders on any change. It's for React devs who've hit that performance wall and want to understand the subscription pattern before reaching for Zustand or Jotai.

The five-folder progression (starter -> simple-context -> fast-context -> fast-context-generic -> fast-context-generic-extended) is a genuinely useful teaching structure, each stage adds exactly one idea on top of the last. createFastContext.tsx itself is small and legible: a ref holding state outside React's render cycle plus a listener set, so subscribers only re-render when the slice they actually read changes. It does this with zero dependencies, which makes it a good read for understanding what Zustand does internally rather than just taking it on faith.

There's no package here, just a file to copy-paste into your own project, so there's no versioning and no bug fixes ever flow back to you. None of the five sub-projects have a single test, which is a real gap for a repo whose entire point is correctness of subscribe/unsubscribe and re-render behavior. Last push was May 2024 with nothing since, so it doesn't account for useSyncExternalStore or React 19's use() changing the baseline this pattern is competing against. Each folder also duplicates the full Vite boilerplate (tsconfig, vite-env.d.ts, App.css, etc.) instead of being git tags on one project, which makes browsing the progression more tedious than it needs to be.

View on GitHub →

// want more like this?

We dig through GitHub every week and send a few repos picked for what you actually care about — each with an honest take like this one.

Get finds in your inbox → Search again →