[v5]: follow React "standard" way with breaking behavioral change #2395
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
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. |
|
Size Change: -90 B (-1%) Total Size: 6.19 kB
ℹ️ View Unchanged
|
dai-shi
commented
Mar 8, 2024
Comment on lines
-22
to
-26
| const { bears, increasePopulation } = useBearStore( | ||
| ({ bears, increasePopulation }) => ({ | ||
| bears, | ||
| increasePopulation, | ||
| }), |
There was a problem hiding this comment.
I would say it worked before by chance. This selector creates a new object every time, which isn't supported in v5. We should use a memoized selector, zutand/traditional or 👇 .
There was a problem hiding this comment.
Or, was this test intentional to check the behavior with such selectors? @TkDodo
There was a problem hiding this comment.
Hmm I think I copied this way if creating a store from somewhere. Definitely not intentional
There was a problem hiding this comment.
Thanks for confirming. That was the reason I introduced useMemoSelector, without looking at the test code. I believe it is an unnecessary hack.
dai-shi
commented
Mar 8, 2024
| @@ -474,7 +474,7 @@ it('can set the store without merging', () => { | |||
|
|
|||
| it('only calls selectors when necessary', async () => { | |||
| type State = { a: number; b: number } | |||
| const useBoundStore = create<State>(() => ({ a: 0, b: 0 })) | |||
| const useBoundStore = createWithEqualityFn<State>(() => ({ a: 0, b: 0 })) | |||
There was a problem hiding this comment.
This behavior (inline selector optimization) isn't supported in v5. Use zustand/traditional.
|
While this change may surprise users, v5 should live long with React 19+, so I believe this is a good move. And, major bump is only the chance to make this kind of changes. |
dai-shi
added a commit
that referenced
this pull request
Aug 16, 2024
* prepare for the next major version * [v5] breaking: drop default exports (#2238) * fix: drop default exports for v5 * chore: remove default from cjs build * refactor: export shallow in v5 * fix: remove `addModuleExport` option for cjs. * [v5] breaking: drop deprecated features (#2235) * fix: remove deprecated v4 features * chore(build): remove context * docs(typescript): remove deprecated equals api * docs(persist): remove old persist api * chore: run yarn prettier on typescript docs * Discard changes to docs/guides/typescript.md * Discard changes to docs/integrations/persisting-store-data.md * Discard changes to tests/shallow.test.tsx * Discard changes to tests/vanilla/subscribe.test.tsx * [v5] breaking: make React 18 as minimal requirement (#2236) * fix: update package.json to require react 18+ * chore: update github actions to test on react 18+ * chore: remove devtools-skip hack from actions * chore(test): remove CI-SKIP from devtools tests * [v5] breaking: make use-sync-external-store an optional peer dependency (#2237) * chore: make use-sync-external-store optional peerDep * fix: use correct versions in package.json * [v5] breaking: require TypeScript 4.5 and update tests (#2257) * breaking(types): TS requirement * wip: latest only * wip: latest only 2 * drop ts <4.4 * wip: do not skip lib checkes * use latest node types * drop ts 4.4 * [v5]: drop "module" condition (#2270) * Update package json in order to remove module * Update rollup config in order to remove module config * Update patch esm script * Update package json to general exports and update node version (#2272) * [v5]: drop UMD/SystemJS builds (#2287) * Update rollup config in order to drop system js and umd builds * Update packages * Clean up files * Update rollup config * Update gh workflows * Minor fixes * Minor fixes * Minor fixes * Minor fixes * Testing * Minor changes * Minor fixes * remove `WithReact` type (#2300) * 5.0.0-alpha.0 * [v5]: do not depend on use-sync-external-store (#2301) * [v5]: do not depend on use-sync-external-store * memo get(server)snapshot * 5.0.0-alpha.1 * [v5]: refactor useMemoSelector (#2302) * [v5]: refactor useMemoSelector * add a test * Revert "[v5]: refactor useMemoSelector" This reverts commit b3c8b15. * Revert "Revert "[v5]: refactor useMemoSelector"" This reverts commit 3c47301. * [v5]: separate react entry point (#2303) * 5.0.0-alpha.2 * 5.0.0-alpha.3 * refactor: Switch to Object.hasOwn (#2365) * [v5] drop es5 (#2380) * update yarn lock * 5.0.0-alpha.4 * [v5]: follow React "standard" way with breaking behavioral change (#2395) * [v5]: follow React "standard" way with breaking behavioral change * add test * 5.0.0-alpha.5 * [v5] Rewrite shallow to support iterables (#2427) * [v5] fix rollup config for cjs (#2433) * 5.0.0-alpha.6 * no production build test * recover types that are dropped in #2462 * remove unused replacement * [v5] Remove Devtools warning (#2466) * chore: remove devtools extension warning * docs: add devtools link to readme * chore: remove unused test * chrome: remove unused tests * chore: remove unused test * Revert "chore: remove unused test" This reverts commit 0fa2a75. * update test name * update pnpm lock * fix merge main * add migration guide * fix typos * 5.0.0-beta.0 * update migration doc * fix merge main * fix merge main (prettier) * 5.0.0-beta.1 * fix(types)!: require complete state if `setState`'s `replace` flag is set (#2580) * fix(types): require complete state if `setState`'s `replace` flag is set * switch to variant 2 * fix type errors * update setState types for devtools and immer * make devtools setState non-generic * add migration guide * merge migration guides * run prettier * Update tests/middlewareTypes.test.tsx --------- Co-authored-by: Daishi Kato <[email protected]> Co-authored-by: daishi <[email protected]> * 5.0.0-beta.2 * move v5 migration doc * fix ci * missing commmit * remove unused rule exclusion * comment about react compiler * revert eslint config --------- Co-authored-by: Charles Kornoelje <[email protected]> Co-authored-by: Danilo Britto <[email protected]> Co-authored-by: Ekin Dursun <[email protected]> Co-authored-by: Simon Farshid <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
For #2138
I think useMemoSelector is a hack that should be avoided. We should generally follow how React works. If we need previous behavior, we should use
zustand/traditionalwhich is based on a library provided by React, instead of adding our own hack.