fix(provider): make react compiler happy

[dai-shi]

If we were to follow eslint-react-compiler, should this be a solution?

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
jotai	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Apr 14, 2025 0:36am

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

[github-actions]

Size Change: +180 B (+0.18%)

Total Size: 98.2 kB

Filename	Size	Change
./dist/esm/react.mjs	1.5 kB	+40 B (+2.74%)
./dist/react.js	1.56 kB	+42 B (+2.77%)
./dist/system/react.development.js	1.68 kB	+41 B (+2.51%)
./dist/system/react.production.js	971 B	+11 B (+1.15%)
./dist/umd/react.development.js	1.69 kB	+39 B (+2.36%)
./dist/umd/react.production.js	1.05 kB	+7 B (+0.67%)

ℹ️ View Unchanged

Filename	Size
./dist/babel/plugin-debug-label.js	932 B
./dist/babel/plugin-react-refresh.js	1.14 kB
./dist/babel/preset.js	1.41 kB
./dist/esm/babel/plugin-debug-label.mjs	1 kB
./dist/esm/babel/plugin-react-refresh.mjs	1.19 kB
./dist/esm/babel/preset.mjs	1.49 kB
./dist/esm/index.mjs	62 B
./dist/esm/react/utils.mjs	746 B
./dist/esm/utils.mjs	67 B
./dist/esm/vanilla.mjs	1.15 kB
./dist/esm/vanilla/internals.mjs	3.73 kB
./dist/esm/vanilla/utils.mjs	5.07 kB
./dist/index.js	242 B
./dist/react/utils.js	1.4 kB
./dist/system/babel/plugin-debug-label.development.js	1.1 kB
./dist/system/babel/plugin-debug-label.production.js	775 B
./dist/system/babel/plugin-react-refresh.development.js	1.29 kB
./dist/system/babel/plugin-react-refresh.production.js	928 B
./dist/system/babel/preset.development.js	1.59 kB
./dist/system/babel/preset.production.js	1.14 kB
./dist/system/index.development.js	252 B
./dist/system/index.production.js	183 B
./dist/system/react/utils.development.js	860 B
./dist/system/react/utils.production.js	462 B
./dist/system/utils.development.js	257 B
./dist/system/utils.production.js	187 B
./dist/system/vanilla.development.js	1.24 kB
./dist/system/vanilla.production.js	350 B
./dist/system/vanilla/internals.development.js	3.88 kB
./dist/system/vanilla/internals.production.js	2.36 kB
./dist/system/vanilla/utils.development.js	5.28 kB
./dist/system/vanilla/utils.production.js	3.15 kB
./dist/umd/babel/plugin-debug-label.development.js	1.08 kB
./dist/umd/babel/plugin-debug-label.production.js	852 B
./dist/umd/babel/plugin-react-refresh.development.js	1.27 kB
./dist/umd/babel/plugin-react-refresh.production.js	1 kB
./dist/umd/babel/preset.development.js	1.54 kB
./dist/umd/babel/preset.production.js	1.22 kB
./dist/umd/index.development.js	383 B
./dist/umd/index.production.js	328 B
./dist/umd/react/utils.development.js	1.54 kB
./dist/umd/react/utils.production.js	1.01 kB
./dist/umd/utils.development.js	399 B
./dist/umd/utils.production.js	342 B
./dist/umd/vanilla.development.js	1.87 kB
./dist/umd/vanilla.production.js	403 B
./dist/umd/vanilla/internals.development.js	5.17 kB
./dist/umd/vanilla/internals.production.js	3.2 kB
./dist/umd/vanilla/utils.development.js	6.26 kB
./dist/umd/vanilla/utils.production.js	3.79 kB
./dist/utils.js	247 B
./dist/vanilla.js	1.77 kB
./dist/vanilla/internals.js	5.03 kB
./dist/vanilla/utils.js	6.13 kB

_{compressed-size-action}

[github-actions]

Preview in LiveCodes

Latest commit: a93dc02
Last updated: Apr 14, 2025 12:36am (UTC)

Playground	Link
React demo	https://livecodes.io?x=id/2ZVE6TMS9

---

See documentations for usage instructions.

[dai-shi]

/ecosystem-ci run

[github-actions]

Ecosystem CI Output

---- Jotai Ecosystem CI Results ----
{
  "bunshi": "PASS",
  "jotai-effect": "PASS",
  "jotai-scope": "PASS"
}

[grigorischristainas]

@dai-shi could this be a solution too ?

export const Provider = ({
  children,
  store,
}: {
  children?: ReactNode
  store?: Store
}): FunctionComponentElement<{ value: Store | undefined }> => {
  const [value] = useState(() => store || createStore())
  return createElement(StoreContext.Provider, { value }, children)
}

The value is stable across re-renders and is only created once per component lifecycle.

[dai-shi]

Unfortunately not, because store can be changed after the initial render.

[pkg-pr-new]

More templates

• hacker_news
• hello
• mega-form
• starter
• text_length
• todos
• todos_with_atomFamily

npm i https://pkg.pr.new/jotai@2771

commit: a93dc02

[sienki-jenki]

export const Provider = ({
  children,
  store,
}: {
  children?: ReactNode
  store?: Store
}): FunctionComponentElement<{ value: Store | undefined }> => {
  const value = useMemo(() => ({ value : store ?? createStore() }) ,[store]);
  return createElement(StoreContext.Provider, value, children)
}

@dai-shi what about this one? value is stable, store can change, if not supplied it would fallback to createStore()

[dai-shi]

It works for 99.9% use cases, but React docs told us that we shouldn't use useMemo as semantic guarantee.

[dai-shi]

https://github.com/pmndrs/jotai/pull/3061/files#r2075165611