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

perf(core): memoize prepareFormState #7498

Merged
merged 9 commits into from
Sep 17, 2024
Merged

Conversation

ricokahler
Copy link
Contributor

@ricokahler ricokahler commented Sep 12, 2024

Description

This PR introduces memoization to the prepareFormState function to significantly improve performance, especially for complex documents with multiple large objects in arrays.

Key changes:

  • Implemented memoization for prepareFormState and its sub-functions for improved performance for complex documents, with up to 10x improvements in some cases
  • Removed computation of hidden and readOnly. Their StateTrees are calculated outside of prepareFormState to remove the dependency of the document to the inputs of prepareFormState.

This addresses performance issues with form state computation, particularly for large and complex documents.

Note: Dependes on #7407

What to review

  • Review the memoization implementation in prepareFormState
  • Check the implementation of conditionally hidden and readOnly states
  • Verify performance improvements, especially for complex documents and documents with large Portable Text fields

Testing

Automated tests are not yet complete. Manual testing has been performed:

  • Compared performance between memoized version and non-memoized version (see attached screenshots)
  • Tested with complex documents, including the synthetic fixture
  • Verified improvements in eFPS for various document types

Before:

CleanShot 2024-09-11 at 22 34 58@2x

After:

CleanShot 2024-09-11 at 22 35 14@2x

TODO: Complete automated tests

Notes for release

This change introduces significant performance improvements for form state computation in Sanity, especially for complex documents:

  • Up to 10x performance improvement for documents with multiple large objects in arrays
  • Noticeable improvements for documents with large Portable Text fields
  • Implemented memoization for form state computation

Limitations:

  • Computing conditionally hidden and readOnly states still adds significant computation time, especially for very large documents
  • React rendering remains a bottleneck for documents with large Portable Text fields

Note: This is a significant performance enhancement that will benefit most users, especially those working with complex document structures.

Copy link

vercel bot commented Sep 12, 2024

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

Name Status Preview Comments Updated (UTC)
page-building-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Sep 17, 2024 6:24pm
performance-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Sep 17, 2024 6:24pm
test-compiled-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Sep 17, 2024 6:24pm
test-next-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Sep 17, 2024 6:24pm
test-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Sep 17, 2024 6:24pm
1 Skipped Deployment
Name Status Preview Comments Updated (UTC)
studio-workshop ⬜️ Ignored (Inspect) Visit Preview Sep 17, 2024 6:24pm

Copy link
Contributor

No changes to documentation

Copy link
Member

@bjoerge bjoerge left a comment

Choose a reason for hiding this comment

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

Amazing work and really impressive numbers @ricokahler – left a few comments, mostly minor stuff.

Copy link
Contributor

Component Testing Report Updated Sep 17, 2024 6:29 PM (UTC)

✅ All Tests Passed -- expand for details
File Status Duration Passed Skipped Failed
comments/CommentInput.spec.tsx ✅ Passed (Inspect) 44s 15 0 0
formBuilder/ArrayInput.spec.tsx ✅ Passed (Inspect) 9s 3 0 0
formBuilder/inputs/PortableText/Annotations.spec.tsx ✅ Passed (Inspect) 31s 6 0 0
formBuilder/inputs/PortableText/copyPaste/CopyPaste.spec.tsx ✅ Passed (Inspect) 37s 11 7 0
formBuilder/inputs/PortableText/copyPaste/CopyPasteFields.spec.tsx ✅ Passed (Inspect) 0s 0 12 0
formBuilder/inputs/PortableText/Decorators.spec.tsx ✅ Passed (Inspect) 18s 6 0 0
formBuilder/inputs/PortableText/DisableFocusAndUnset.spec.tsx ✅ Passed (Inspect) 10s 3 0 0
formBuilder/inputs/PortableText/DragAndDrop.spec.tsx ✅ Passed (Inspect) 3m 0s 0 0 0
formBuilder/inputs/PortableText/FocusTracking.spec.tsx ✅ Passed (Inspect) 45s 15 0 0
formBuilder/inputs/PortableText/Input.spec.tsx ✅ Passed (Inspect) 1m 42s 21 0 0
formBuilder/inputs/PortableText/ObjectBlock.spec.tsx ✅ Passed (Inspect) 1m 16s 18 0 0
formBuilder/inputs/PortableText/PresenceCursors.spec.tsx ✅ Passed (Inspect) 9s 3 9 0
formBuilder/inputs/PortableText/RangeDecoration.spec.tsx ✅ Passed (Inspect) 26s 9 0 0
formBuilder/inputs/PortableText/Styles.spec.tsx ✅ Passed (Inspect) 18s 6 0 0
formBuilder/inputs/PortableText/Toolbar.spec.tsx ✅ Passed (Inspect) 36s 12 0 0
formBuilder/tree-editing/TreeEditing.spec.tsx ✅ Passed (Inspect) 0s 0 3 0
formBuilder/tree-editing/TreeEditingNestedObjects.spec.tsx ✅ Passed (Inspect) 0s 0 3 0

Copy link
Member

@cngonzalez cngonzalez left a comment

Choose a reason for hiding this comment

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

re-iterating Bjoerge's approval after the rebase and change to make tests pass!

@ricokahler ricokahler added this pull request to the merge queue Sep 17, 2024
Merged via the queue into next with commit 3bf7096 Sep 17, 2024
42 checks passed
@ricokahler ricokahler deleted the perf/memoize-prepare-form-state branch September 17, 2024 18:31
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.

3 participants