{"id":24580498,"url":"https://github.com/react18-tools/kosha","last_synced_at":"2025-03-17T15:43:17.807Z","repository":{"id":273164305,"uuid":"913118199","full_name":"react18-tools/kosha","owner":"react18-tools","description":"A modern, lightweight, fast, and powerful global state management library for modern React.js projects. ","archived":false,"fork":false,"pushed_at":"2025-03-11T00:43:43.000Z","size":1191,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-11T01:29:46.089Z","etag":null,"topics":["mayank1513","nextjs15","react18","react18-global-store","react19","turborepo-template","zustand"],"latest_commit_sha":null,"homepage":"https://kosha-six.vercel.app/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mpl-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/react18-tools.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"contributing.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["react18-tools","mayank1513"],"polar":"mayank1513","patreon":null,"open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"lfx_crowdfunding":null,"custom":["https://pages.razorpay.com/mayank1513"]}},"created_at":"2025-01-07T04:19:59.000Z","updated_at":"2025-03-11T00:43:46.000Z","dependencies_parsed_at":"2025-02-03T01:25:17.906Z","dependency_job_id":"6d39ee03-6476-4d11-8f19-b00f3a7a65be","html_url":"https://github.com/react18-tools/kosha","commit_stats":null,"previous_names":["react18-tools/kosha"],"tags_count":2,"template":false,"template_full_name":"react18-tools/turborepo-template","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/react18-tools%2Fkosha","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/react18-tools%2Fkosha/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/react18-tools%2Fkosha/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/react18-tools%2Fkosha/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/react18-tools","download_url":"https://codeload.github.com/react18-tools/kosha/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244059947,"owners_count":20391438,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["mayank1513","nextjs15","react18","react18-global-store","react19","turborepo-template","zustand"],"created_at":"2025-01-24T01:54:28.411Z","updated_at":"2025-03-17T15:43:17.801Z","avatar_url":"https://github.com/react18-tools.png","language":"TypeScript","funding_links":["https://github.com/sponsors/react18-tools","https://github.com/sponsors/mayank1513","https://polar.sh/mayank1513","https://pages.razorpay.com/mayank1513"],"categories":[],"sub_categories":[],"readme":"# Kosha \u003cimg src=\"https://raw.githubusercontent.com/mayank1513/mayank1513/main/popper.png\" style=\"height: 40px\"/\u003e\n\n[![Test Status](https://github.com/react18-tools/kosha/actions/workflows/test.yml/badge.svg)](https://github.com/react18-tools/kosha/actions/workflows/test.yml) [![Maintainability](https://api.codeclimate.com/v1/badges/55202c8c7bee2d7a95bd/maintainability)](https://codeclimate.com/github/react18-tools/kosha/maintainability) [![Code Coverage](https://codecov.io/gh/react18-tools/kosha/graph/badge.svg)](https://codecov.io/gh/react18-tools/kosha) [![Version](https://img.shields.io/npm/v/kosha.svg?colorB=green)](https://www.npmjs.com/package/kosha) [![Downloads](https://img.jsdelivr.com/img.shields.io/npm/d18m/kosha.svg)](https://www.npmjs.com/package/kosha) ![Bundle Size](https://img.shields.io/bundlephobia/minzip/kosha) [![Gitpod Ready](https://img.shields.io/badge/Gitpod-ready--to--code-blue?logo=gitpod)](https://gitpod.io/from-referrer/)\n\n### **A Modern, Lightweight, and Powerful State Management Library for React**\n\nKosha is a minimal global state management solution tailored for modern React applications. At only **420 bytes** (minzipped), it provides exceptional performance and simplicity for developers focused on clean and efficient code.\n\n---\n\n## 🚀 Key Features\n\n1. **Ultra-Lightweight**\n\n   - Minzipped size: **571 bytes**, ideal for performance-critical projects.\n\n2. **Optimized Re-renders**\n\n   - Components only re-render when the selector output changes.\n   - Example:\n     ```tsx\n     const count = useKosha(state =\u003e state.count);\n     ```\n\n3. **Partial State Updates**\n\n   - Update specific parts of the state easily without spreading:\n     ```tsx\n     set({ count });\n     set(state =\u003e ({ count: state.count + 1 }));\n     ```\n\n4. **Flexible Consumption**\n\n   - Use the entire store or specific selectors as needed:\n     ```tsx\n     const { count, setCount } = useKosha();\n     ```\n\n5. **Concurrent Rendering Ready**\n   - Built on React’s `useSyncExternalStore`, ensuring compatibility with React 18+ features.\n\n---\n\n## ⭐ Installation\n\nInstall Kosha using your preferred package manager:\n\n```bash\npnpm add kosha\n```\n\nor\n\n```bash\nnpm install kosha\n```\n\nor\n\n```bash\nyarn add kosha\n```\n\n---\n\n## 📖 Usage\n\n### Define a Store\n\n```tsx\nimport { create } from \"kosha\";\n\nconst useKosha = create(set =\u003e ({\n  count: 0,\n  increment: () =\u003e set(state =\u003e ({ count: state.count + 1 })),\n}));\n```\n\n### Consume Without a Selector\n\n```tsx\nconst Counter = () =\u003e {\n  const { count, increment } = useKosha();\n\n  return (\n    \u003cdiv\u003e\n      \u003cp\u003eCount: {count}\u003c/p\u003e\n      \u003cbutton onClick={increment}\u003eIncrement\u003c/button\u003e\n    \u003c/div\u003e\n  );\n};\n```\n\n### Consume With a Selector\n\n```tsx\nconst Counter = () =\u003e {\n  const count = useKosha(state =\u003e state.count);\n  const increment = useKosha(state =\u003e state.increment);\n\n  return (\n    \u003cdiv\u003e\n      \u003cp\u003eCount: {count}\u003c/p\u003e\n      \u003cbutton onClick={increment}\u003eIncrement\u003c/button\u003e\n    \u003c/div\u003e\n  );\n};\n```\n\n### Direct Store Updates\n\nIn the latest version, the `.set` method has been removed from the hook. This means `useKosha.set` is no longer available by default.\n\nTo use the `set` method, you must explicitly expose it within your store:\n\n```typescript\nimport { create } from \"kosha\";\n\nconst useKosha = create(set =\u003e ({\n  count: 0,\n  increment: () =\u003e set(state =\u003e ({ count: state.count + 1 })),\n  set, // \u003c- Expose the set method to use it as a standard setter with full functionality\n}));\n```\n\n---\n\nThis post provides a clear comparison between **Kosha** and **Zustand**, emphasizing Kosha's advantages in terms of size, performance, and flexibility. Here’s a brief recap and refinement:\n\n---\n\n### **Why Choose Kosha Over Zustand?**\n\n1. **Lighter \u0026 Faster**\n\n   - Kosha’s **minzipped size** is only **420 bytes**, making it ideal for performance-critical projects.\n   - Zustand is heavier, which could impact apps where every kilobyte counts.\n\n2. **Optimized Selectors**\n\n   - Kosha ensures **zero unnecessary re-renders** out of the box—components only re-render when the selector output changes.  \n     Example:\n\n     ```tsx\n     const count = useKosha(state =\u003e state.count);\n     ```\n\n     or\n\n     ```tsx\n     const fullName = useKosha(state =\u003e state.firstName + state.lastName);\n     ```\n\n   - Zustand requires explicit optimizations and may still trigger redundant re-renders. See the [Zustand docs](https://github.com/pmndrs/zustand/blob/37e1e3f193a5e5dec6fbd0f07514aec59a187e01/docs/guides/prevent-rerenders-with-use-shallow.md).\n\n3. **Built-in Partial Updates**\n\n   - Kosha simplifies **state updates** with clean syntax, no need to spread the previous state manually:\n\n     ```tsx\n     set({ count }); // Update 'count' only\n\n     set(state =\u003e ({ count: state.count + 1 })); // Increment 'count'\n     ```\n\n   - Zustand also supports partial updates in newer versions, but Kosha delivers this efficiency in a smaller footprint.\n\n4. **Flexible API**\n   - Kosha allows consuming the entire store when needed:\n     ```tsx\n     const { count, setCount } = useKosha();\n     ```\n\n---\n\n### When to Use Kosha?\n\nChoose **Kosha** if your project prioritizes:\n\n- Minimal bundle size.\n- Performance and selector efficiency.\n- Modern state management with a lean API.\n\nFor larger projects or those already using Zustand’s ecosystem, Kosha offers a streamlined alternative.\n\n## 📌 FAQ\n\n### 1. Does Kosha support async actions?\n\nYes! You can handle async actions with callbacks or promises directly within your store functions.\n\n### 2. How does Kosha ensure reactivity?\n\nKosha relies on React’s `useSyncExternalStore` for smooth integration with React’s latest features, including concurrent rendering.\n\n---\n\n## 🤝 Contributing\n\nWe welcome your contributions! If you encounter issues or have suggestions, please submit them on the [Kosha GitHub Repository](https://github.com/react18-tools/kosha).\n\n---\n\n## 📜 License\n\nKosha is licensed under the **MPL-2.0** open-source license.\n\n\u003cimg src=\"https://raw.githubusercontent.com/mayank1513/mayank1513/main/popper.png\" style=\"height: 20px\"/\u003e Check out [our courses](https://mayank-chaudhari.vercel.app/courses) or [sponsor our work](https://github.com/sponsors/mayank1513).\n\n---\n\n\u003cp align=\"center\" style=\"text-align:center\"\u003eBuilt with 💖 by \u003ca href=\"https://mayank-chaudhari.vercel.app\" target=\"_blank\"\u003eMayank Kumar Chaudhari\u003c/a\u003e\u003c/p\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Freact18-tools%2Fkosha","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Freact18-tools%2Fkosha","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Freact18-tools%2Fkosha/lists"}