react-create-state: The Minimalist Revolution in React State Management

In the ever-evolving React state management ecosystem, where complexity often scales with feature sets, a new contender emerges with a radical proposition: What if state management could be both powerful and virtually weightless? Enter react-create-state – a minimalist library that packs global state management into a mere 527 bytes while maintaining full compatibility with React's hooks paradigm.

Developed by David Norman, this MIT-licensed library strips state management down to its essentials. As Norman states in the GitHub documentation: "No signals, no wrappers. Just getting and setting the state." The API surface is intentionally sparse, returning just four functions from createState: useState, setState, getState, and subscribe. Yet beneath this simplicity lies sophisticated functionality like memoized selectors, external subscription support, and SSR readiness.

import { createState } from "react-create-state";

// Initialize global state outside components
const [useCounter, setCounter] = createState(0);

// Derived state with memoization
const useDoubleCounter = () => useCounter(n => n * 2);

// Component usage
const Counter = () => {
  const count = useCounter();
  const doubled = useDoubleCounter();

  return (
    <div onClick={() => setCounter(n => n + 1)}>
      Count: {count}, Doubled: {doubled}
    </div>
  );
};

Why Size and Simplicity Matter

The library's microscopic footprint – visualized above – isn't just a vanity metric. In a comparative analysis against popular alternatives, the differences are stark:

* Requires full react-use installation

This size advantage translates directly to faster load times, especially critical in performance-sensitive applications like mobile web or low-bandwidth environments. The library achieves this by leveraging React's native update batching and avoiding abstraction layers that bloat competitors.

Advanced Capabilities in Minimal Packaging

Despite its size, react-create-state supports complex state operations:

• Memoized Selectors: Prevent re-renders with dependency-tracking selectors:
  

  const user = useState(state => state.user, [externalDependency]);
  
  

• State Peeking: Access state outside React's render cycle:
  

  // Anywhere in your application
  const currentState = getState(); 
  
  

• Subsystem Integration: Connect to non-React systems via subscriptions:
  

  const unsubscribe = subscribe(state => {
    localStorage.setItem('appState', JSON.stringify(state));
  });
  
  

• Testing/SSR Sanitization: Reset all state with reinitializeAll() between tests or server requests

The Philosophy of Less

What sets react-create-state apart is its intentional constraints. Unlike Zustand's middleware ecosystem or Jotai's atomic model, this library embraces React's built-in state management patterns while eliminating repetitive boilerplate. The trade-off? You won't find Redux-like devtools or persistence plugins – and that's the point.

As applications increasingly shift toward micro-frontends and edge computing, solutions like react-create-state offer a compelling path: essential state management without compromising bundle budgets. For developers frustrated by complex state machinery or teams prioritizing lean dependencies, this library might just represent the Goldilocks zone of React state management.

Source: GitHub Repository