WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
WeAreDevelopers LIVE • Jun 17, 2020

State management in a world of hooks

Adam Klein

Tired of deeply nested React context providers and unnecessary re-renders? Discover how the Reusable library natively elevates standard hooks into high-performance, shared global state.

Pause
Mute Enter Fullscreen
#1 about 3 min

The challenge of managing local versus global state

Switching mental paradigms between local component hooks and external shared stores complicates state management.

#2 about 2 min

Applying global state patterns to local components

Unifying state approaches by using global patterns locally sacrifices the innate benefits of native hooks.

#3 about 4 min

How structural traits of hooks enable code modularity

Hook code's flat and keyless architecture allows developers to seamlessly extract and reuse functional logic.

#4 about 3 min

Leveraging React context for shared state management

Using context providers enables propagating native component state across the rendering tree without third-party tools.

#5 about 5 min

Performance and architectural drawbacks of React context

Deeply layered context providers couple application state to the component hierarchy while blocking selective render bailouts.

#6 about 4 min

Designing an ideal hook-based state management API

Prototyping custom hook implementations demonstrates the necessity of retaining native React developer tool compatibility.

#7 about 3 min

Core architecture of the reusable state management library

Hosting custom hooks in invisible components creates singleton stores that broadcast direct updates to subscribing components.

#8 about 5 min

Migrating local component state to a reusable store

Wrapping isolated hook logic within a global store seamlessly converts local component state into shared applications state.

#9 about 3 min

Implementing selectors and cross-store subscriptions for state optimization

Using selectors prevents excessive component re-renders while enabling direct value sharing between independent state stores.

#10 about 1 min

Choosing sustainable technology solutions over passing trends

Technical decisions should focus on team workflows and maintainable architectures instead of adopting the latest industry hype.

Matching moments

2:22 min

Implementing global state natively using the Context API

Marc Brehmer Marc Brehmer · World Congress 2024

1:22 min

Advantages of utilizing native React state management tools

Marc Brehmer Marc Brehmer · World Congress 2024

2:12 min

Introduction to React hooks usage in large codebases

Daniel Espino Garcia Daniel Espino Garcia · World Congress 2024

44 sec

Constructing basic UI components using React hooks

Marc Rousavy Marc Rousavy · World Congress 2025

2:05 min

Sharing reusable component logic with custom React hooks

Daniel Espino Garcia Daniel Espino Garcia · World Congress 2024

4:38 min

Introduction to react components, props, and state

Clemens Helm · World Congress 2023

More from WeAreDevelopers LIVE

WeAreDevelopers LIVE - Tech Education in Two Languages thumbnail
1:00:18
3 days ago

WeAreDevelopers LIVE - Tech Education in Two Languages

Daniel Cranney, Roxy Rodriguez-Becker

WeAreDevelopers LIVE - Playing in Production thumbnail
1:06:40
10 days ago

WeAreDevelopers LIVE - Playing in Production

Andrew MacLean, Daniel Cranney, Christian Heilmann

WeAreDevelopers LIVE - Is CSS Catching Up to Flash? thumbnail
1:03:33
24 days ago

WeAreDevelopers LIVE - Is CSS Catching Up to Flash?

Chris Heilmann, Daniel Cranney, Bramus Van Damme

WeAreDevelopers LIVE - Project Chopin: Make Your Team and Agents Play Along thumbnail
1:21:17
about 1 month ago

WeAreDevelopers LIVE - Project Chopin: Make Your Team and Agents Play Along

Chris Heilmann, Daniel Cranney, Krzysztof Cieślak

Fake or News - AI Toothbrushes, Carrier Pigeon Tech & Life on Mars - Krzysztof Cieślak thumbnail
4:23
about 1 month ago

Fake or News - AI Toothbrushes, Carrier Pigeon Tech & Life on Mars - Krzysztof Cieślak

Chris Heilmann, Daniel Cranney

WeAreDevelopers LIVE - Open Source Agent Toolkits thumbnail
1:00:38
about 1 month ago

WeAreDevelopers LIVE - Open Source Agent Toolkits

Chris Heilmann, Daniel Cranney, Eddie Jaoude

Upcoming sessions on this topic

Open session

React Under Fire: Rendering Performance for Streaming Agent UIs

  • Abhirupa Mitra

    Slack

    Senior Member of Technical Staff

Open session

From Profiler to Production: Measuring What Actually Matters in React & React Native

  • Andrei Tazetdinov

    Dynatrace

    React Native Developer

Open session

Designing for Every Direction: Logical CSS for Global, Adaptive, and Effortlessly Reversible UIs

  • Vidhya Krishnamoorthy

    Morgan Stanley

    VP, Software Engineering Manager

Open session

Multi-Cloud Isn't a Project. It's a Side Effect.

  • Antonio Mendoza Pérez

    Temporal Technologies

    Staff Developer Success Engineer

  • Gaurav Thadani

    Temporal

    Staff Developer Success Engineer

Open session

From Prompt Engineering to Harness Engineering: Building Observable and Governed GenAI Systems

  • Lakshmi Devi Prakash

    JPMorgan Chase

    VP, Applied AI/ML Lead

Open session

Beyond File Dumps: Context Engineering for Coding Agents

  • Animesh Dutta

    Arm

    Senior Software Engineer

Related videos

Rethinking React State Management: The Power of Built-In Solutions thumbnail
23:39
World Congress 2024 • about 2 years ago

Rethinking React State Management: The Power of Built-In Solutions

Marc Brehmer

Dos and don'ts with react hooks. An opinionated approach thumbnail
20:16
World Congress 2024 • about 2 years ago

Dos and don'ts with react hooks. An opinionated approach

Daniel Espino Garcia

Bringing back reactivity in "reactive" frontend thumbnail
28:43
World Congress 2024 • about 2 years ago

Bringing back reactivity in "reactive" frontend

Michał Moroz

Client-Side State Management Reimagined – Think Outside the Box thumbnail
29:54
World Congress 2025 • about 1 year ago

Client-Side State Management Reimagined – Think Outside the Box

Michael Egger-Zikes

Building Interactive Async UI with React 19 and Ariakit thumbnail
25:22
World Congress 2025 • about 1 year ago

Building Interactive Async UI with React 19 and Ariakit

Aurora Scharff

Challenges of building React and React Native apps thumbnail
24:10
World Congress 2022 • over 4 years ago

Challenges of building React and React Native apps

Milica Aleksic, Stefan Nikolic

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.