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

Fix resolver resolution status key types mismatch causing unwanted resolver calls for identical state data #52120

Merged
merged 33 commits into from
Oct 16, 2023

Conversation

getdave
Copy link
Contributor

@getdave getdave commented Jun 29, 2023

What?

Stops unwanted resolver calls due to resolver cache misses.

Specifically fixes getEntityRecord in @wordpress/core-data to avoid cache miss caused by type mismatch on the recordKey argument.

Closes #52106

Why?

The following selector calls are not considered equivalent by the caching mechanism in @wordpress/data (see #52106 for detailed explanation):

getEntityRecord( 'postType', 'post', 1 ); // number as recordKey
getEntityRecord( 'postType', 'post', '1' ); // string as recordKey

This means that even if the record exists in state, the relevant resolver is not marked as resolved and thus the resolver runs again thereby triggering a network request.

This is very likely to occur because in Gutenberg IDs can be strings which means a lot of (potential) cache misses and unnecessary network calls and loading delays.

A specific example is the useNavigator hooks where the resulting params object will contain params as strings even if they are numeric. So if there's a param of postId then it will be a string. It's very easy to accidentally pass that to getEntityRecord.

How?

Adds a new optional property to the resolver selector which allows the implementor to define a method which normalizes the resolver args passed to the selector into to a standard form. This standardised form is then used in cache set/get.

This PR implements such a method for the getEntityRecord resolver selector to stabize the type of the recordKey as a number rather than a string when the recordKey argument looks like a numberic ID (which is likely to be the ID of a Post record).

Testing Instructions

  • Create some Navigation Menus on your website using the Navigation block. Be sure to save/publish them.
  • Create a new Post
  • Open dev tools network tab and then hit Esc to also open the Console tab below it.
  • In console type wp.data.select('core').getEntityRecords('postType', 'wp_navigation'). You should see null and then running it again you should see results. This has populated the core/data state with entities of that type.
  • Note down the ids of those records.
  • At this point those records are in state and thus any calls to select the individual records should not result in a network request because they are already in state and getEntityRecords resolves the getEntityRecord selectors.
  • Choose the ID of one of your records and enter the following into the console making sure that you pass the 3rd argument as a string and not a int value - wp.data.select('core').getEntityRecord('postType', 'wp_navigation','{YOUR_RECORD_ID}')
  • You should not see GET request (ignore OPTIONS) to wp/v2/navigation/{RECORD_ID}.
  • Make the same request but this time make the recordKey argument a Number.
  • See no network request is dispatched.

...you can also test this in the Site Editor by:

  • Clicking Navigation in Browse Mode sidebar.
  • Clicking on one of your Navigations.
  • See that no GET network request was dispatched.

Testing Instructions for Keyboard

Screenshots or screencast

@getdave getdave requested a review from jsnajdr June 29, 2023 12:25
@getdave getdave self-assigned this Jun 29, 2023
@github-actions
Copy link

github-actions bot commented Jun 29, 2023

Size Change: +144 B (0%)

Total Size: 1.65 MB

Filename Size Change
build/core-data/index.min.js 70.9 kB +59 B (0%)
build/data/index.min.js 8.87 kB +85 B (+1%)
ℹ️ View Unchanged
Filename Size
build/a11y/index.min.js 964 B
build/annotations/index.min.js 2.71 kB
build/api-fetch/index.min.js 2.29 kB
build/autop/index.min.js 2.11 kB
build/blob/index.min.js 461 B
build/block-directory/index.min.js 7.25 kB
build/block-directory/style-rtl.css 1.04 kB
build/block-directory/style.css 1.04 kB
build/block-editor/content-rtl.css 4.28 kB
build/block-editor/content.css 4.27 kB
build/block-editor/default-editor-styles-rtl.css 403 B
build/block-editor/default-editor-styles.css 403 B
build/block-editor/index.min.js 218 kB
build/block-editor/style-rtl.css 15.6 kB
build/block-editor/style.css 15.6 kB
build/block-library/blocks/archives/editor-rtl.css 61 B
build/block-library/blocks/archives/editor.css 60 B
build/block-library/blocks/archives/style-rtl.css 90 B
build/block-library/blocks/archives/style.css 90 B
build/block-library/blocks/audio/editor-rtl.css 150 B
build/block-library/blocks/audio/editor.css 150 B
build/block-library/blocks/audio/style-rtl.css 122 B
build/block-library/blocks/audio/style.css 122 B
build/block-library/blocks/audio/theme-rtl.css 138 B
build/block-library/blocks/audio/theme.css 138 B
build/block-library/blocks/avatar/editor-rtl.css 116 B
build/block-library/blocks/avatar/editor.css 116 B
build/block-library/blocks/avatar/style-rtl.css 104 B
build/block-library/blocks/avatar/style.css 104 B
build/block-library/blocks/block/editor-rtl.css 305 B
build/block-library/blocks/block/editor.css 305 B
build/block-library/blocks/button/editor-rtl.css 587 B
build/block-library/blocks/button/editor.css 587 B
build/block-library/blocks/button/style-rtl.css 633 B
build/block-library/blocks/button/style.css 632 B
build/block-library/blocks/buttons/editor-rtl.css 337 B
build/block-library/blocks/buttons/editor.css 337 B
build/block-library/blocks/buttons/style-rtl.css 332 B
build/block-library/blocks/buttons/style.css 332 B
build/block-library/blocks/calendar/style-rtl.css 239 B
build/block-library/blocks/calendar/style.css 239 B
build/block-library/blocks/categories/editor-rtl.css 113 B
build/block-library/blocks/categories/editor.css 112 B
build/block-library/blocks/categories/style-rtl.css 124 B
build/block-library/blocks/categories/style.css 124 B
build/block-library/blocks/code/editor-rtl.css 53 B
build/block-library/blocks/code/editor.css 53 B
build/block-library/blocks/code/style-rtl.css 121 B
build/block-library/blocks/code/style.css 121 B
build/block-library/blocks/code/theme-rtl.css 124 B
build/block-library/blocks/code/theme.css 124 B
build/block-library/blocks/columns/editor-rtl.css 108 B
build/block-library/blocks/columns/editor.css 108 B
build/block-library/blocks/columns/style-rtl.css 421 B
build/block-library/blocks/columns/style.css 421 B
build/block-library/blocks/comment-author-avatar/editor-rtl.css 125 B
build/block-library/blocks/comment-author-avatar/editor.css 125 B
build/block-library/blocks/comment-content/style-rtl.css 92 B
build/block-library/blocks/comment-content/style.css 92 B
build/block-library/blocks/comment-template/style-rtl.css 199 B
build/block-library/blocks/comment-template/style.css 198 B
build/block-library/blocks/comments-pagination-numbers/editor-rtl.css 123 B
build/block-library/blocks/comments-pagination-numbers/editor.css 121 B
build/block-library/blocks/comments-pagination/editor-rtl.css 222 B
build/block-library/blocks/comments-pagination/editor.css 209 B
build/block-library/blocks/comments-pagination/style-rtl.css 235 B
build/block-library/blocks/comments-pagination/style.css 231 B
build/block-library/blocks/comments-title/editor-rtl.css 75 B
build/block-library/blocks/comments-title/editor.css 75 B
build/block-library/blocks/comments/editor-rtl.css 840 B
build/block-library/blocks/comments/editor.css 839 B
build/block-library/blocks/comments/style-rtl.css 637 B
build/block-library/blocks/comments/style.css 636 B
build/block-library/blocks/cover/editor-rtl.css 647 B
build/block-library/blocks/cover/editor.css 650 B
build/block-library/blocks/cover/style-rtl.css 1.7 kB
build/block-library/blocks/cover/style.css 1.69 kB
build/block-library/blocks/details/editor-rtl.css 65 B
build/block-library/blocks/details/editor.css 65 B
build/block-library/blocks/details/style-rtl.css 98 B
build/block-library/blocks/details/style.css 98 B
build/block-library/blocks/embed/editor-rtl.css 293 B
build/block-library/blocks/embed/editor.css 293 B
build/block-library/blocks/embed/style-rtl.css 410 B
build/block-library/blocks/embed/style.css 410 B
build/block-library/blocks/embed/theme-rtl.css 138 B
build/block-library/blocks/embed/theme.css 138 B
build/block-library/blocks/file/editor-rtl.css 316 B
build/block-library/blocks/file/editor.css 316 B
build/block-library/blocks/file/style-rtl.css 311 B
build/block-library/blocks/file/style.css 312 B
build/block-library/blocks/file/view.min.js 321 B
build/block-library/blocks/footnotes/style-rtl.css 201 B
build/block-library/blocks/footnotes/style.css 199 B
build/block-library/blocks/form-input/editor-rtl.css 229 B
build/block-library/blocks/form-input/editor.css 228 B
build/block-library/blocks/form-input/style-rtl.css 343 B
build/block-library/blocks/form-input/style.css 343 B
build/block-library/blocks/form-submission-notification/editor-rtl.css 343 B
build/block-library/blocks/form-submission-notification/editor.css 342 B
build/block-library/blocks/form-submit-button/style-rtl.css 69 B
build/block-library/blocks/form-submit-button/style.css 69 B
build/block-library/blocks/form/view.min.js 452 B
build/block-library/blocks/freeform/editor-rtl.css 2.61 kB
build/block-library/blocks/freeform/editor.css 2.61 kB
build/block-library/blocks/gallery/editor-rtl.css 957 B
build/block-library/blocks/gallery/editor.css 962 B
build/block-library/blocks/gallery/style-rtl.css 1.55 kB
build/block-library/blocks/gallery/style.css 1.55 kB
build/block-library/blocks/gallery/theme-rtl.css 122 B
build/block-library/blocks/gallery/theme.css 122 B
build/block-library/blocks/group/editor-rtl.css 654 B
build/block-library/blocks/group/editor.css 654 B
build/block-library/blocks/group/style-rtl.css 57 B
build/block-library/blocks/group/style.css 57 B
build/block-library/blocks/group/theme-rtl.css 78 B
build/block-library/blocks/group/theme.css 78 B
build/block-library/blocks/heading/style-rtl.css 189 B
build/block-library/blocks/heading/style.css 189 B
build/block-library/blocks/html/editor-rtl.css 340 B
build/block-library/blocks/html/editor.css 341 B
build/block-library/blocks/image/editor-rtl.css 834 B
build/block-library/blocks/image/editor.css 833 B
build/block-library/blocks/image/style-rtl.css 1.48 kB
build/block-library/blocks/image/style.css 1.47 kB
build/block-library/blocks/image/theme-rtl.css 137 B
build/block-library/blocks/image/theme.css 137 B
build/block-library/blocks/image/view.min.js 1.93 kB
build/block-library/blocks/latest-comments/style-rtl.css 357 B
build/block-library/blocks/latest-comments/style.css 357 B
build/block-library/blocks/latest-posts/editor-rtl.css 213 B
build/block-library/blocks/latest-posts/editor.css 212 B
build/block-library/blocks/latest-posts/style-rtl.css 478 B
build/block-library/blocks/latest-posts/style.css 478 B
build/block-library/blocks/list/style-rtl.css 88 B
build/block-library/blocks/list/style.css 88 B
build/block-library/blocks/media-text/editor-rtl.css 266 B
build/block-library/blocks/media-text/editor.css 263 B
build/block-library/blocks/media-text/style-rtl.css 505 B
build/block-library/blocks/media-text/style.css 503 B
build/block-library/blocks/more/editor-rtl.css 431 B
build/block-library/blocks/more/editor.css 431 B
build/block-library/blocks/navigation-link/editor-rtl.css 671 B
build/block-library/blocks/navigation-link/editor.css 672 B
build/block-library/blocks/navigation-link/style-rtl.css 103 B
build/block-library/blocks/navigation-link/style.css 103 B
build/block-library/blocks/navigation-submenu/editor-rtl.css 299 B
build/block-library/blocks/navigation-submenu/editor.css 299 B
build/block-library/blocks/navigation/editor-rtl.css 2.26 kB
build/block-library/blocks/navigation/editor.css 2.26 kB
build/block-library/blocks/navigation/style-rtl.css 2.26 kB
build/block-library/blocks/navigation/style.css 2.25 kB
build/block-library/blocks/navigation/view.min.js 1.02 kB
build/block-library/blocks/nextpage/editor-rtl.css 395 B
build/block-library/blocks/nextpage/editor.css 395 B
build/block-library/blocks/page-list/editor-rtl.css 401 B
build/block-library/blocks/page-list/editor.css 401 B
build/block-library/blocks/page-list/style-rtl.css 175 B
build/block-library/blocks/page-list/style.css 175 B
build/block-library/blocks/paragraph/editor-rtl.css 235 B
build/block-library/blocks/paragraph/editor.css 235 B
build/block-library/blocks/paragraph/style-rtl.css 335 B
build/block-library/blocks/paragraph/style.css 335 B
build/block-library/blocks/post-author/style-rtl.css 175 B
build/block-library/blocks/post-author/style.css 176 B
build/block-library/blocks/post-comments-form/editor-rtl.css 96 B
build/block-library/blocks/post-comments-form/editor.css 96 B
build/block-library/blocks/post-comments-form/style-rtl.css 508 B
build/block-library/blocks/post-comments-form/style.css 508 B
build/block-library/blocks/post-date/style-rtl.css 61 B
build/block-library/blocks/post-date/style.css 61 B
build/block-library/blocks/post-excerpt/editor-rtl.css 71 B
build/block-library/blocks/post-excerpt/editor.css 71 B
build/block-library/blocks/post-excerpt/style-rtl.css 141 B
build/block-library/blocks/post-excerpt/style.css 141 B
build/block-library/blocks/post-featured-image/editor-rtl.css 588 B
build/block-library/blocks/post-featured-image/editor.css 586 B
build/block-library/blocks/post-featured-image/style-rtl.css 345 B
build/block-library/blocks/post-featured-image/style.css 345 B
build/block-library/blocks/post-navigation-link/style-rtl.css 215 B
build/block-library/blocks/post-navigation-link/style.css 214 B
build/block-library/blocks/post-template/editor-rtl.css 99 B
build/block-library/blocks/post-template/editor.css 98 B
build/block-library/blocks/post-template/style-rtl.css 409 B
build/block-library/blocks/post-template/style.css 408 B
build/block-library/blocks/post-terms/style-rtl.css 96 B
build/block-library/blocks/post-terms/style.css 96 B
build/block-library/blocks/post-time-to-read/style-rtl.css 69 B
build/block-library/blocks/post-time-to-read/style.css 69 B
build/block-library/blocks/post-title/style-rtl.css 100 B
build/block-library/blocks/post-title/style.css 100 B
build/block-library/blocks/preformatted/style-rtl.css 125 B
build/block-library/blocks/preformatted/style.css 125 B
build/block-library/blocks/pullquote/editor-rtl.css 135 B
build/block-library/blocks/pullquote/editor.css 135 B
build/block-library/blocks/pullquote/style-rtl.css 335 B
build/block-library/blocks/pullquote/style.css 335 B
build/block-library/blocks/pullquote/theme-rtl.css 168 B
build/block-library/blocks/pullquote/theme.css 168 B
build/block-library/blocks/query-pagination-numbers/editor-rtl.css 122 B
build/block-library/blocks/query-pagination-numbers/editor.css 121 B
build/block-library/blocks/query-pagination/editor-rtl.css 221 B
build/block-library/blocks/query-pagination/editor.css 211 B
build/block-library/blocks/query-pagination/style-rtl.css 288 B
build/block-library/blocks/query-pagination/style.css 284 B
build/block-library/blocks/query-title/style-rtl.css 63 B
build/block-library/blocks/query-title/style.css 63 B
build/block-library/blocks/query/editor-rtl.css 486 B
build/block-library/blocks/query/editor.css 486 B
build/block-library/blocks/query/style-rtl.css 375 B
build/block-library/blocks/query/style.css 372 B
build/block-library/blocks/query/view.min.js 609 B
build/block-library/blocks/quote/style-rtl.css 222 B
build/block-library/blocks/quote/style.css 222 B
build/block-library/blocks/quote/theme-rtl.css 223 B
build/block-library/blocks/quote/theme.css 226 B
build/block-library/blocks/read-more/style-rtl.css 132 B
build/block-library/blocks/read-more/style.css 132 B
build/block-library/blocks/rss/editor-rtl.css 149 B
build/block-library/blocks/rss/editor.css 149 B
build/block-library/blocks/rss/style-rtl.css 289 B
build/block-library/blocks/rss/style.css 288 B
build/block-library/blocks/search/editor-rtl.css 184 B
build/block-library/blocks/search/editor.css 184 B
build/block-library/blocks/search/style-rtl.css 613 B
build/block-library/blocks/search/style.css 613 B
build/block-library/blocks/search/theme-rtl.css 114 B
build/block-library/blocks/search/theme.css 114 B
build/block-library/blocks/search/view.min.js 471 B
build/block-library/blocks/separator/editor-rtl.css 146 B
build/block-library/blocks/separator/editor.css 146 B
build/block-library/blocks/separator/style-rtl.css 234 B
build/block-library/blocks/separator/style.css 234 B
build/block-library/blocks/separator/theme-rtl.css 194 B
build/block-library/blocks/separator/theme.css 194 B
build/block-library/blocks/shortcode/editor-rtl.css 329 B
build/block-library/blocks/shortcode/editor.css 329 B
build/block-library/blocks/site-logo/editor-rtl.css 760 B
build/block-library/blocks/site-logo/editor.css 760 B
build/block-library/blocks/site-logo/style-rtl.css 204 B
build/block-library/blocks/site-logo/style.css 204 B
build/block-library/blocks/site-tagline/editor-rtl.css 86 B
build/block-library/blocks/site-tagline/editor.css 86 B
build/block-library/blocks/site-title/editor-rtl.css 116 B
build/block-library/blocks/site-title/editor.css 116 B
build/block-library/blocks/site-title/style-rtl.css 57 B
build/block-library/blocks/site-title/style.css 57 B
build/block-library/blocks/social-link/editor-rtl.css 184 B
build/block-library/blocks/social-link/editor.css 184 B
build/block-library/blocks/social-links/editor-rtl.css 682 B
build/block-library/blocks/social-links/editor.css 681 B
build/block-library/blocks/social-links/style-rtl.css 1.45 kB
build/block-library/blocks/social-links/style.css 1.45 kB
build/block-library/blocks/spacer/editor-rtl.css 359 B
build/block-library/blocks/spacer/editor.css 359 B
build/block-library/blocks/spacer/style-rtl.css 48 B
build/block-library/blocks/spacer/style.css 48 B
build/block-library/blocks/table/editor-rtl.css 432 B
build/block-library/blocks/table/editor.css 432 B
build/block-library/blocks/table/style-rtl.css 646 B
build/block-library/blocks/table/style.css 645 B
build/block-library/blocks/table/theme-rtl.css 157 B
build/block-library/blocks/table/theme.css 157 B
build/block-library/blocks/tag-cloud/style-rtl.css 251 B
build/block-library/blocks/tag-cloud/style.css 253 B
build/block-library/blocks/template-part/editor-rtl.css 403 B
build/block-library/blocks/template-part/editor.css 403 B
build/block-library/blocks/template-part/theme-rtl.css 101 B
build/block-library/blocks/template-part/theme.css 101 B
build/block-library/blocks/term-description/style-rtl.css 111 B
build/block-library/blocks/term-description/style.css 111 B
build/block-library/blocks/text-columns/editor-rtl.css 95 B
build/block-library/blocks/text-columns/editor.css 95 B
build/block-library/blocks/text-columns/style-rtl.css 166 B
build/block-library/blocks/text-columns/style.css 166 B
build/block-library/blocks/verse/style-rtl.css 99 B
build/block-library/blocks/verse/style.css 99 B
build/block-library/blocks/video/editor-rtl.css 552 B
build/block-library/blocks/video/editor.css 555 B
build/block-library/blocks/video/style-rtl.css 191 B
build/block-library/blocks/video/style.css 191 B
build/block-library/blocks/video/theme-rtl.css 139 B
build/block-library/blocks/video/theme.css 139 B
build/block-library/classic-rtl.css 179 B
build/block-library/classic.css 179 B
build/block-library/common-rtl.css 1.11 kB
build/block-library/common.css 1.11 kB
build/block-library/editor-elements-rtl.css 75 B
build/block-library/editor-elements.css 75 B
build/block-library/editor-rtl.css 12.4 kB
build/block-library/editor.css 12.4 kB
build/block-library/elements-rtl.css 54 B
build/block-library/elements.css 54 B
build/block-library/index.min.js 211 kB
build/block-library/reset-rtl.css 472 B
build/block-library/reset.css 472 B
build/block-library/style-rtl.css 14.4 kB
build/block-library/style.css 14.4 kB
build/block-library/theme-rtl.css 700 B
build/block-library/theme.css 705 B
build/block-serialization-default-parser/index.min.js 1.13 kB
build/block-serialization-spec-parser/index.min.js 2.87 kB
build/blocks/index.min.js 51.5 kB
build/commands/index.min.js 15.5 kB
build/commands/style-rtl.css 947 B
build/commands/style.css 942 B
build/components/index.min.js 249 kB
build/components/style-rtl.css 11.9 kB
build/components/style.css 11.9 kB
build/compose/index.min.js 12.7 kB
build/core-commands/index.min.js 2.72 kB
build/customize-widgets/index.min.js 12 kB
build/customize-widgets/style-rtl.css 1.51 kB
build/customize-widgets/style.css 1.5 kB
build/data-controls/index.min.js 651 B
build/date/index.min.js 17.9 kB
build/deprecated/index.min.js 462 B
build/dom-ready/index.min.js 336 B
build/dom/index.min.js 4.68 kB
build/edit-post/classic-rtl.css 571 B
build/edit-post/classic.css 571 B
build/edit-post/index.min.js 35.7 kB
build/edit-post/style-rtl.css 7.88 kB
build/edit-post/style.css 7.88 kB
build/edit-site/index.min.js 205 kB
build/edit-site/style-rtl.css 14.2 kB
build/edit-site/style.css 14.2 kB
build/edit-widgets/index.min.js 17 kB
build/edit-widgets/style-rtl.css 4.84 kB
build/edit-widgets/style.css 4.84 kB
build/editor/index.min.js 45.9 kB
build/editor/style-rtl.css 3.58 kB
build/editor/style.css 3.58 kB
build/element/index.min.js 4.87 kB
build/escape-html/index.min.js 548 B
build/format-library/index.min.js 7.8 kB
build/format-library/style-rtl.css 577 B
build/format-library/style.css 577 B
build/hooks/index.min.js 1.57 kB
build/html-entities/index.min.js 454 B
build/i18n/index.min.js 3.61 kB
build/interactivity/index.min.js 11.4 kB
build/is-shallow-equal/index.min.js 535 B
build/keyboard-shortcuts/index.min.js 1.76 kB
build/keycodes/index.min.js 1.9 kB
build/list-reusable-blocks/index.min.js 2.21 kB
build/list-reusable-blocks/style-rtl.css 865 B
build/list-reusable-blocks/style.css 865 B
build/media-utils/index.min.js 2.92 kB
build/notices/index.min.js 964 B
build/nux/index.min.js 2.01 kB
build/nux/style-rtl.css 775 B
build/nux/style.css 771 B
build/patterns/index.min.js 4.51 kB
build/patterns/style-rtl.css 518 B
build/patterns/style.css 517 B
build/plugins/index.min.js 1.81 kB
build/preferences-persistence/index.min.js 1.85 kB
build/preferences/index.min.js 1.26 kB
build/primitives/index.min.js 994 B
build/priority-queue/index.min.js 1.52 kB
build/private-apis/index.min.js 988 B
build/react-i18n/index.min.js 631 B
build/react-refresh-entry/index.min.js 9.46 kB
build/react-refresh-runtime/index.min.js 6.78 kB
build/redux-routine/index.min.js 2.71 kB
build/reusable-blocks/index.min.js 2.73 kB
build/reusable-blocks/style-rtl.css 265 B
build/reusable-blocks/style.css 265 B
build/rich-text/index.min.js 10.2 kB
build/router/index.min.js 1.79 kB
build/server-side-render/index.min.js 1.96 kB
build/shortcode/index.min.js 1.4 kB
build/style-engine/index.min.js 1.98 kB
build/token-list/index.min.js 587 B
build/url/index.min.js 3.83 kB
build/vendors/inert-polyfill.min.js 2.48 kB
build/vendors/react-dom.min.js 41.8 kB
build/vendors/react.min.js 4.02 kB
build/viewport/index.min.js 967 B
build/warning/index.min.js 259 B
build/widgets/index.min.js 7.18 kB
build/widgets/style-rtl.css 1.18 kB
build/widgets/style.css 1.18 kB
build/wordcount/index.min.js 1.03 kB

compressed-size-action

packages/core-data/src/resolvers.js Outdated Show resolved Hide resolved
packages/data/src/redux-store/index.js Outdated Show resolved Hide resolved
@getdave getdave added [Type] Performance Related to performance efforts [Package] Data /packages/data [Package] Core data /packages/core-data labels Jun 30, 2023
@getdave getdave requested a review from youknowriad June 30, 2023 08:05
@getdave

This comment was marked as resolved.

@getdave getdave force-pushed the fix/resolver-resolution-status-key branch from 842b6f3 to 8462ae4 Compare July 4, 2023 08:47
@youknowriad
Copy link
Contributor

Can I ask why do we want to consider "1" and 1 as equivalent in the first place? Is it certain that we want to do this or is this a bug elsewhere (where we lose the actual type of the identifier)

@getdave
Copy link
Contributor Author

getdave commented Jul 4, 2023

Can I ask why do we want to consider "1" and 1 as equivalent in the first place?

We only want to do this in the case where recordKey is clear a numeric Post ID. In this case we know that for the following post:

{
title: "My Post",
id: 123,
type: 'some_post_type'
}

...these two calls are asking for the same data:

// String as Post ID as record key
getEntityRecord('postType', 'some_post_type', '123');

// Number as Post ID as record key
getEntityRecord('postType', 'some_post_type', 123);

If we don't do this then the cache will think it's empty and the resolver will be triggered even though it's already been resolved for the given recordKey.

Is it certain that we want to do this or is this a bug elsewhere (where we lose the actual type of the identifier)

No I don't believe it's a bug "with type "loss". The type is passed to the selector/resolver when it is called incorrectly with a string Post ID for the recordKey.

The caller is wrong and the resolver is just doing what it should do.

We can protect the caller from this bug. It is being "clever" so there's an argument to just leave it "as is", but that results in additional network requests as I hope I've explained in the Issue and this PR.

Alternatives considered

One other option might be to introduce a new selector/resolver specifically for fetching records by Post ID. Something like getEntityRecordById where we could enforce the type coercion and then forward the call onto getEntityRecord under the hood.

Reasons I don't favour that:

  • clunky
  • another API to learn
  • doesn't fix existing issues in the wild

More Context

The issue that for getEntityRecords() the recordKey can be a int or a string. That means I can interchangeably call:

// String as Post ID as record key
getEntityRecord('postType', 'some_post_type', '123');

// Number as Post ID as record key
getEntityRecord('postType', 'some_post_type', 123);

There are no guards in place and nor can we add any because there are cases when recordKey is a string such as:

// Slug as recordKey
getEntityRecords('postType', 'wp_template_part', 'twentytwentythree//header');

This flexibility is great except that it allows those who are intending to pass a post ID as recordKey open to cache misses when they accidentally pass a string.

Now we could say "everyone should know to pass recordKey as a number not a string when you pass a post ID" but it's very easy to get that wrong as there is no way to enforce it because the recordKey can be either type.

We could of course patch the individual instances within the Gutenberg repo where recordKey ends up as a string for Post IDs but that won't stop 3rd party consumers from "doing it wrong".

As far as I can see there isn't a cleaner solution to this problem but I'm open to discussion.

packages/core-data/src/utils/is-numeric-id.js Outdated Show resolved Hide resolved
packages/data/src/redux-store/index.js Outdated Show resolved Hide resolved
packages/data/src/redux-store/index.js Outdated Show resolved Hide resolved
@youknowriad
Copy link
Contributor

We could of course patch the individual instances within the Gutenberg repo where recordKey ends up as a string for Post IDs but that won't stop 3rd party consumers from "doing it wrong".

I mean if third parties are doing it wrong, it's also their problem. I'm "ok" with this normalization but can't stop but wonder whether it's really necessary. Is there a lot of places where we use "strings" instead of "numbers" in Gutenberg?

@getdave
Copy link
Contributor Author

getdave commented Jul 4, 2023

I mean if third parties are doing it wrong, it's also their problem.

Yes, but unlike with many other WP APIs we don't alert to the user that they are "doing it wrong" because strictly they aren't. It's just our cache (which is masked from the caller) is absolutely strict about types.

In this case we allow them to make this call and they are absolutely none-the-wiser to the performance impact unless they happen to be monitoring network calls.

On a slower network having to retrieve a record from REST over the network instead of from state could be pretty impactful.

Personally I spotted this when going from Navigation listing -> Single Navigation view in the Site View. Having to wait for the record to resolve again is a pretty poor experience and it's exacerbated by the fact that we've already preloaded the navigation menus query on the server.

I'm "ok" with this normalization but can't stop but wonder whether it's really necessary. Is there a lot of places where we use "strings" instead of "numbers" in Gutenberg?

Understood and I agree It's not a clear cut problem -> solution.

I found a few instances in Core but admittedly it's not a lot, largely thanks to the fact that we tend to store block attributes with specific types.

One area where we are open to bugs however, is when retrieving params from the URL. If, for example, I get postId from the params of the useNavigation() hook then its type will be string.

/wp-admin/site-editor.php?postId=435&postType=wp_navigation
Screen Shot 2023-07-04 at 13 25 40

All I need do is inadvertently pass that to getEntityRecord and I'll have a cache miss resulting in a network request for no reason (aside: we could guard against this by having to register URL params with specfic types before we can use them).

I definitely see the argument that this isn't 100% critical, but it's a nice quality of life improvement and also guards against performance issues which definitely possible (and potentially even likely, depending on how we store data).

Another alternative is that we trigger a console warning if we suspect a caller is passing the wrong argument type?

Do we think it's worth me committing any more effort here or shall I focus elsewhere?

My opinion is that it is worth it but I'm just one contributor 😄

@jsnajdr
Copy link
Member

jsnajdr commented Jul 4, 2023

Is there a lot of places where we use "strings" instead of "numbers" in Gutenberg?

It might be that calling selectors with "wrong" argument types is a very common mistake, it just goes undetected. Because the consequences are not that bad, it's just that the potential resolver is called twice. If your state is stored as an object, then state[ 1 ] and state[ '1' ] is exactly the same thing, as the numeric key is coerced to a string, so existing state is found and returned by the selector. But the resolution metadata state doesn't know that the selector has already been resolved and resolves it one more time.

It seems to me that mixing up getEntityRecord( 'postType', 'post', 1 ) and getEntityRecord( 'postType', 'post', '1' ) is a very easy mistake to make, it really suggests itself.

@getdave
Copy link
Contributor Author

getdave commented Jul 4, 2023

I'll proceed then 🙇‍♂️

@getdave
Copy link
Contributor Author

getdave commented Jul 4, 2023

I'm now stuck with TypeScript in allowing the normalizeArgs function to be a property of GetEntityRecord type.

@getdave getdave marked this pull request as ready for review July 4, 2023 15:33
@getdave getdave requested a review from nerrad as a code owner July 4, 2023 15:33
packages/data/src/redux-store/index.js Outdated Show resolved Hide resolved
packages/data/src/redux-store/index.js Outdated Show resolved Hide resolved
@getdave getdave force-pushed the fix/resolver-resolution-status-key branch from fb67d28 to 5d2c7b3 Compare October 13, 2023 12:45
@draganescu draganescu merged commit 2155576 into trunk Oct 16, 2023
51 checks passed
@draganescu draganescu deleted the fix/resolver-resolution-status-key branch October 16, 2023 17:00
@github-actions github-actions bot added this to the Gutenberg 16.9 milestone Oct 16, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Package] Core data /packages/core-data [Package] Data /packages/data [Type] Performance Related to performance efforts
Projects
Development

Successfully merging this pull request may close these issues.

Generated state keys for selector resolution do not account for varying types of recordKey
8 participants