Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Switching "deep-equal" package for "fast-deep-equal" - based on #1665 #1719

Merged
merged 10 commits into from
Jan 22, 2024

Conversation

yavorsk
Copy link
Collaborator

@yavorsk yavorsk commented Jan 19, 2024

This PR is based on external contribution #1665 . Following is the original PR description:

Description / Motivation

We were noticing that deepEqual in componentDidUpdate of SitecoreContext was taking up a significant chunk of time for large Layout Service payloads.

The package "fast-deep-equal" shows 100x faster performance in benchmarks compared to "deep-equal".

This was the only usage of the "deep-equal" package, so we were able to replace the dependency entirely.

Testing Details

  • Unit Test Added
  • Manual Test/Other (Please elaborate)

There is no functional change, only performance change, so no new unit tests. We have implemented this change on 2 different projects and have not seen any issues, just faster performance.

In our Lighthouse tests for one of our projects, we saw the Total Blocking Time reduced from 1090ms to 20ms in Desktop, and from 5170ms to 330ms in mobile. The results were reproducible, and we saw significant gains in a different project.

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)

Not technically a bug, but it's not new functionality either.

Copy link
Contributor

@illiakovalenko illiakovalenko left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good 👍
See some comments to consider below

CHANGELOG.md Outdated
@@ -22,6 +22,7 @@ Our versioning strategy is as follows:
* `[templates/nextjs-sxa]` Fixed Image component when there is using Banner variant which set property background-image when image is empty. ([#1689](https://github.com/Sitecore/jss/pull/1689)) ([#1692](https://github.com/Sitecore/jss/pull/1692))
* `[templates/nextjs-sxa]` Fix feature `show Grid column` in Experience Editor. ([#1704](https://github.com/Sitecore/jss/pull/1704))
* `[sitecore-jss-nextjs] [templates/nextjs-xmcloud]` SDK initialization rejections are now correctly handled. Errors should no longer occur after getSDK() promises resolve when they shouldn't (for example, getting Events SDK in development environment) ([#1712](https://github.com/Sitecore/jss/pull/1712) [#1715](https://github.com/Sitecore/jss/pull/1715) [#1716](https://github.com/Sitecore/jss/pull/1716))
* `[templates/react] [sitecore-jss-react] ` Replace package 'deep-equal' with 'fast-deep-equal'; no functionality change only performance improvement ([#1719](https://github.com/Sitecore/jss/pull/1719) [#1665](https://github.com/Sitecore/jss/pull/1665)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should it be under "Features and improvements" section? I can't say that it's a bugfix, rather an improvement

@@ -63,7 +63,7 @@
},
"dependencies": {
"@sitecore-jss/sitecore-jss": "21.7.0-canary.50",
"deep-equal": "^2.1.0",
"fast-deep-equal": "3.1.3",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we need to install types for fast-deep-equal or they are not needed?
deep-equal types needs to be removed: https://github.com/Sitecore/jss/pull/1719/files#diff-7b807de09392e3b43f675bec4802fa16d67f108b7624e883d8c699a8f8fbd14eL32

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we use the latest version instead of "fixed"?

@@ -32,7 +32,7 @@
"axios": "^1.2.0",
"bootstrap": "^5.2.3",
"cross-fetch": "^3.1.5",
"deep-equal": "^2.1.0",
"fast-deep-equal": "3.1.3",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we use the latest version instead of "fixed"?

@illiakovalenko illiakovalenko merged commit 06a60f5 into dev Jan 22, 2024
1 check was pending
@illiakovalenko illiakovalenko deleted the feature/sitecore-context-fast-deep-equal branch January 22, 2024 02:31
illiakovalenko added a commit that referenced this pull request Jan 22, 2024
…ual" - based on #1665 (#1719)

* Switching "deep-equal" package for "fast-deep-equal".  This gave a significant performance boost for Total Blocking Time, especially for large layout service payloads.

* update yarn.lock

* update yarn.lock

* update changelog

* use latest version of fast-deep-equal; @remove types/deep-equal

* fix changelog entry

* Minor update to CHANGELOG.md

* Update CHANGELOG.md

---------

Co-authored-by: David <[email protected]>
Co-authored-by: Illia Kovalenko <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants