I built three application archetypes, each implemented twice — once with Context (multiple domain contexts + hooks) and once with Redux Toolkit — with pixel-identical UIs and shared components, so the only variable is the state layer:
- Product catalog — read-heavy, many visible items, selective mutations (add to cart, wishlist)
- Multi-step form — localized updates, validation, dependent fields
- Live dashboard — multiple independent real-time data streams
Performance is measured by render counting: every component reports each render to a tiny registry, and automated benchmarks (Vitest + jsdom) replay identical interactions against both implementations.
Each app also ships with a visible render monitor, so you can watch it live:
A taste of the results: open both, click "Add to Cart" on any product, and watch the render counter — Context re-renders every visible product card; Redux re-renders exactly one. Then try the same comparison in the form app, and the story completely changes. That's the thesis in one sentence: it depends on the application type, and the dependency is measurable.
Where you come in
The benchmarks are half the story — the other half is what developers actually experience and choose. That's a short survey:
29 questions, about 5–7 minutes, fully anonymous — no sign-in, no email, academic use only. If you've built React apps professionally or seriously as a hobby, your answers directly shape the thesis's decision guide.
Questions about the setup? Ask away in the comments.
