perf(Blocks,Block): add deep comparison to block/blocks memo call#4253
perf(Blocks,Block): add deep comparison to block/blocks memo call#4253jakequade-pc wants to merge 1 commit intoBuilderIO:mainfrom
Conversation
🦋 Changeset detectedLatest commit: 77421c5 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
cc @samijaber @sidmohanty11 just for visibility 😊 thanks for your time! |
|
| Command | Status | Duration | Result |
|---|---|---|---|
nx test @e2e/react-native-76-fabric |
❌ Failed | 4m 14s | View ↗ |
nx test @e2e/react-native-74 |
❌ Failed | 4m 13s | View ↗ |
nx test @snippet/react |
✅ Succeeded | 1m 56s | View ↗ |
☁️ Nx Cloud last updated this comment at 2026-02-05 05:05:13 UTC
|
thanks @jakequade-pc for the PR, looks good to me - tagging @midhunadarvin to take a look once on why the tests aren't running and help out |
|
@jakequade-pc Could you rebase your branch with the |
React.memo uses a shallow comparison, which isn't enough in this case. Using [welldone-software/why-did-you-render](https://github.com/welldone-software/why-did-you-render) I found our homepage content would update 12 times in one load with the wdyr message "different objects that are equal by value". This change adds a deep comparison, which when tested via patch-package, eliminated those re-renders.
ad3738b to
77421c5
Compare
|
@midhunadarvin done! Thanks for your patience with this |
|
@jakequade-pc There are a couple of E2E test workflows failing : Could you take a look at the failing test cases and try to resolve them ? Let me know if you need any additional help. |

Description
React.memo uses a shallow comparison, which isn't enough in this case.
Using welldone-software/why-did-you-render
I found our app home-screen content would update 12 times in one load with the wdyr message
"different objects that are equal by value".
This change adds a deep comparison, which when tested via patch-package, eliminated those re-renders.
Note: I tried to base this PR on the one that initially made these memo changes, hope it's okay :)
Screenshot
Note
Medium Risk
Touches generated component wrapping and adds a new runtime dependency; deep comparison can change update behavior and has potential performance tradeoffs on large props.
Overview
Reduces unnecessary re-renders in the React Native SDK by switching
BlockandBlocksexports frommemo(Component)tomemo(Component, isEqual)usingreact-fast-compare(deep equality) via the MitosisMEMOIZING_BLOCKS_COMPONENT_PLUGIN.Adds
react-fast-compareas a dependency of@builder.io/sdk-react-nativeand includes a patch changeset documenting the perf improvement.Written by Cursor Bugbot for commit 77421c5. This will update automatically on new commits. Configure here.