Global States: Simple React State Management

Why another state library?

Redux is too heavy for small projects. Context API can lead to unnecessary re-renders if not handled perfectly. I wanted a library that felt as simple as useState but worked across the entire application.

The API

Global States uses an observer-based pattern that allows you to "subscribe" to specific pieces of state.

// Define a store
const userStore = createStore({ name: 'Guest', loggedIn: false });

// Use it in any component
function Profile() {
  const [user, setUser] = useGlobalState(userStore);
  return <h1>Hello, {user.name}</h1>;
}

Technical Details

• Minimal Footprint: Less than 2KB gzipped.
• TypeScript First: Full type inference for your store's state.
• Selective Re-renders: Only components that use the changed state will update.
• Zero Dependencies: Built entirely on React primitives.

Conclusion

This library is now my go-to for internal tools and client projects where I need shared state but don't want to manage a complex Redux store. It’s about simplicity and performance.