Native Global State: : Simplifying State Management the Native Way

This is a submission for the GitHub Finish-Up-A-Thon Challenge

What I Built

I built native-state-react, a lightweight state management library for React that focuses on performance, simplicity and native patterns. The project started as an experiment to improve performance, reduce boilerplate compared to Redux or Context API and a simple and local state feel for developers, while still offering predictable and scalable state handling. It means a lot to me because it represents my philosophy of keeping React development closer to its native feel — minimal abstractions, maximum clarity.

I put maximum efforts on this, and it has even optimized to these levels

Pre-compiled path getters (compileGetter): Replaced slow loop-based object property drilldowns with optimized, static depth getter functions, avoiding array allocations and loop overhead on every render cycle.

Path-targeted subscriptions: Replaced the global subscriber set with a Map of paths to sets of listener callbacks. This ensures that updates to one slice of state only notify relevant subscribers, achieving $O(1)$ lookup for exact selector matches and avoiding unnecessary calculations for unrelated subscribers.

Microtask notification batching (queueMicrotask): Implemented batched notifications so that rapid successive state updates (e.g. synchronous update loops) queue callbacks and trigger component updates/re-renders exactly once at the end of the tick.

Demo

You can explore the package here: native-state-react on npm. A demo is added using Stack blits here https://stackblitz.com/edit/native-state-react?file=src%2FApp.jsx . The repo includes usage examples showing how to define state, update it, and consume it across components without complex setup.

import { useNativeState } from "native-state-react";

function Counter() {
  const [count, setCount] = useNativeState("state.count",0);
  return (
    <div>
      <p>{count}</p>
      <button onClick={() => setCount(count + 1)}>Increment</button>
    </div>
  );
}

This simple snippet demonstrates how intuitive it is to manage state with the library.

I have even did a benchmark comparing it to famous redux library. Results were impressive (even to my surprise)

Here is the benchmark code :
https://github.com/sarath263/native-state/tree/main/benchmark

The Comeback Story

Originally, the project was just a rough prototype with limited functionality. It lacked features(single hook and no native feel), documentation, examples, and polish. For this challenge, I revisited it, cleaned up the API, improved code support, and added clear usage guides. I also fixed edge cases around state updates and optimized performance for larger applications. Now, it’s ready for developers to adopt without friction.

My Experience with GitHub Copilot

GitHub Copilot was a huge help in finishing this project. It assisted me in:

• Generating many of the code quickly. Speed up my development.
• Suggesting options that improved developer experience.
• Helping with documentation drafts and example snippets.
• Speeding up repetitive tasks so I could focus on architectural design decisions.

Copilot felt like a coding partner that nudged me toward cleaner solutions and helped me finish what I had started months ago.