-
Notifications
You must be signed in to change notification settings - Fork 4.3k
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
Memoize the getTemplateInfo selector #60200
Conversation
return { | ||
title: _templateInfo?.title || getEditedPostAttribute( 'title' ), | ||
modified: getEditedPostAttribute( 'modified' ), | ||
id: _id, | ||
templateInfo: __experimentalGetTemplateInfo( _record ), | ||
templateInfo: _templateInfo, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Here the original code looked wrong. Create a _templateInfo
variable that is never assigned to, access the _templateInfo?.title
field that is never there...
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good catch!
getEditorSettings( state )?.defaultTemplatePartAreas || []; | ||
return areas?.map( ( item ) => { | ||
getEditorSettings( state )?.defaultTemplatePartAreas ?? []; | ||
return areas.map( ( item ) => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
areas
is always defaulted to an array, no need for optional ?.
operator.
@@ -1730,7 +1730,7 @@ export const __experimentalGetDefaultTemplateType = createSelector( | |||
) ?? EMPTY_OBJECT | |||
); | |||
}, | |||
( state, slug ) => [ __experimentalGetDefaultTemplateTypes( state ), slug ] | |||
( state ) => [ __experimentalGetDefaultTemplateTypes( state ) ] |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
slug
is a redundant dependant, because it's a selector parameter. When createSelector
stores the memoized values, they are automatically keyed by the parameters.
Having slug
there can also defeat the memoization, because there is a "reset the cache when dependants change" logic.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice find 👍
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.
To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
Size Change: +9 B (0%) Total Size: 1.72 MB
ℹ️ View Unchanged
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good one 👍
Confirmed that the template info still works well and the warning disappears.
🚀
return { | ||
title: _templateInfo?.title || getEditedPostAttribute( 'title' ), | ||
modified: getEditedPostAttribute( 'modified' ), | ||
id: _id, | ||
templateInfo: __experimentalGetTemplateInfo( _record ), | ||
templateInfo: _templateInfo, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good catch!
{ description && <Text>{ description }</Text> } | ||
{ lastEditedText && ( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice. These are definitely not numbers and 0
s won't be displayed, so no need for the boolean conversion.
@@ -1701,8 +1701,8 @@ export function __experimentalGetDefaultTemplateTypes( state ) { | |||
export const __experimentalGetDefaultTemplatePartAreas = createSelector( | |||
( state ) => { | |||
const areas = | |||
getEditorSettings( state )?.defaultTemplatePartAreas || []; | |||
return areas?.map( ( item ) => { | |||
getEditorSettings( state )?.defaultTemplatePartAreas ?? []; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Agreed with the change. TBH I'm not sure why it was treated as a boolean when the relevant filter should always return an array: https://developer.wordpress.org/reference/hooks/default_wp_template_part_areas/
The nullish coalescing makes sense to me, and just to verify, I don't see any non-array usage in the plugin directory: https://wpdirectory.net/search/01HSXFV2V357M8WP7R5AA5NWGE
@@ -1730,7 +1730,7 @@ export const __experimentalGetDefaultTemplateType = createSelector( | |||
) ?? EMPTY_OBJECT | |||
); | |||
}, | |||
( state, slug ) => [ __experimentalGetDefaultTemplateTypes( state ), slug ] | |||
( state ) => [ __experimentalGetDefaultTemplateTypes( state ) ] |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice find 👍
Co-authored-by: jsnajdr <jsnajdr@git.wordpress.org> Co-authored-by: tyxla <tyxla@git.wordpress.org>
Co-authored-by: jsnajdr <jsnajdr@git.wordpress.org> Co-authored-by: tyxla <tyxla@git.wordpress.org>
I noticed there is a "The useSelect hook returns different values when called with the same state" warning in the console when the
PostCardPanel
component is rendered. Because it calls thegetTemplateInfo
selector and that selector is not memoized, returns a newtemplateInfo
call on each call.This PR adds the memoization and also adds a few little drive-by fixups in nearby code (see individual comments).
How to test: Start editing "Blog Home" in the Site Editor, and make sure this
PostCardPanel
is rendered:Before this PR, you'll see a console warning. After this PR, the warning should disappear.