Skip to content

Remove withBlockEditContext internal higher-order component#22942

Merged
youknowriad merged 1 commit intomasterfrom
remove/with-block-edit-context
Jun 8, 2020
Merged

Remove withBlockEditContext internal higher-order component#22942
youknowriad merged 1 commit intomasterfrom
remove/with-block-edit-context

Conversation

@aduth
Copy link
Copy Markdown
Member

@aduth aduth commented Jun 5, 2020

Related: #22905

This pull request seeks to remove the withBlockEditContext internal helper of the @wordpress/block-editor package. The motivation here is (a) to flatten the common block React element hierarchy and (b) to favor hooks-based implementations over higher-order components. withBlockEditContext was a useful and expressive helper at the time it was originally implemented, due to the cumbersome nature of using React Context <Consumer> elements. With useContext, it's much simpler now to get direct access to the context object properties relevant for this behavior.

Testing Instructions:

Verify no regressions in the behavior of affected components. For example, block-based autocomplete and alignment toolbar.

@aduth aduth added [Type] Performance Related to performance efforts [Type] Code Quality Issues or PRs that relate to code quality [Package] Block editor /packages/block-editor labels Jun 5, 2020
@aduth aduth requested a review from gziolo June 5, 2020 17:52

let { completers = EMPTY_ARRAY } = props;

completers = useMemo( () => {
Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

Note: There's a bit more intensive refactoring here than just a direct port. I observed the prior logic was fairly unoptimized if editor.Autocomplete.completers, since it would create a new copy of the array on every render. It's also not necessary to consider the filtering on every render, if we're already managing this memoization.

}

export default compose(
withBlockEditContext( ( { clientId } ) => {
Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

Another interesting observation with migrating from higher-order components to hooks: With higher-order components, it's fairly easy to overlook when something is totally unused!

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Yes, I've often seen left over selectors :)

@github-actions
Copy link
Copy Markdown

github-actions bot commented Jun 5, 2020

Size Change: -69 B (0%)

Total Size: 1.12 MB

Filename Size Change
build/block-editor/index.js 106 kB -71 B (0%)
build/block-library/index.js 127 kB +1 B
build/components/index.js 193 kB +8 B (0%)
build/edit-navigation/index.js 8.25 kB +1 B
build/edit-post/index.js 302 kB -1 B
build/edit-site/index.js 15 kB -2 B (0%)
build/edit-widgets/index.js 8.83 kB -1 B
build/rich-text/index.js 14.8 kB -3 B (0%)
build/server-side-render/index.js 2.68 kB -1 B
ℹ️ View Unchanged
Filename Size Change
build/a11y/index.js 1.14 kB 0 B
build/annotations/index.js 3.62 kB 0 B
build/api-fetch/index.js 3.4 kB 0 B
build/autop/index.js 2.83 kB 0 B
build/blob/index.js 620 B 0 B
build/block-directory/index.js 6.75 kB 0 B
build/block-directory/style-rtl.css 892 B 0 B
build/block-directory/style.css 892 B 0 B
build/block-editor/style-rtl.css 11.4 kB 0 B
build/block-editor/style.css 11.4 kB 0 B
build/block-library/editor-rtl.css 7.87 kB 0 B
build/block-library/editor.css 7.87 kB 0 B
build/block-library/style-rtl.css 7.72 kB 0 B
build/block-library/style.css 7.72 kB 0 B
build/block-library/theme-rtl.css 684 B 0 B
build/block-library/theme.css 686 B 0 B
build/block-serialization-default-parser/index.js 1.88 kB 0 B
build/block-serialization-spec-parser/index.js 3.1 kB 0 B
build/blocks/index.js 48.2 kB 0 B
build/components/style-rtl.css 19.5 kB 0 B
build/components/style.css 19.5 kB 0 B
build/compose/index.js 9.31 kB 0 B
build/core-data/index.js 11.4 kB 0 B
build/data-controls/index.js 1.29 kB 0 B
build/data/index.js 8.46 kB 0 B
build/date/index.js 5.47 kB 0 B
build/deprecated/index.js 771 B 0 B
build/dom-ready/index.js 568 B 0 B
build/dom/index.js 3.17 kB 0 B
build/edit-navigation/style-rtl.css 918 B 0 B
build/edit-navigation/style.css 919 B 0 B
build/edit-post/style-rtl.css 5.43 kB 0 B
build/edit-post/style.css 5.43 kB 0 B
build/edit-site/style-rtl.css 2.96 kB 0 B
build/edit-site/style.css 2.96 kB 0 B
build/edit-widgets/style-rtl.css 2.4 kB 0 B
build/edit-widgets/style.css 2.4 kB 0 B
build/editor/editor-styles-rtl.css 425 B 0 B
build/editor/editor-styles.css 428 B 0 B
build/editor/index.js 44.7 kB 0 B
build/editor/style-rtl.css 4.26 kB 0 B
build/editor/style.css 4.27 kB 0 B
build/element/index.js 4.65 kB 0 B
build/escape-html/index.js 733 B 0 B
build/format-library/index.js 7.72 kB 0 B
build/format-library/style-rtl.css 502 B 0 B
build/format-library/style.css 502 B 0 B
build/hooks/index.js 2.13 kB 0 B
build/html-entities/index.js 621 B 0 B
build/i18n/index.js 3.56 kB 0 B
build/is-shallow-equal/index.js 711 B 0 B
build/keyboard-shortcuts/index.js 2.52 kB 0 B
build/keycodes/index.js 1.94 kB 0 B
build/list-reusable-blocks/index.js 3.12 kB 0 B
build/list-reusable-blocks/style-rtl.css 226 B 0 B
build/list-reusable-blocks/style.css 226 B 0 B
build/media-utils/index.js 5.3 kB 0 B
build/notices/index.js 1.79 kB 0 B
build/nux/index.js 3.4 kB 0 B
build/nux/style-rtl.css 616 B 0 B
build/nux/style.css 613 B 0 B
build/plugins/index.js 2.56 kB 0 B
build/primitives/index.js 1.5 kB 0 B
build/priority-queue/index.js 789 B 0 B
build/redux-routine/index.js 2.85 kB 0 B
build/shortcode/index.js 1.7 kB 0 B
build/token-list/index.js 1.28 kB 0 B
build/url/index.js 4.06 kB 0 B
build/viewport/index.js 1.85 kB 0 B
build/warning/index.js 1.14 kB 0 B
build/wordcount/index.js 1.17 kB 0 B

compressed-size-action

@youknowriad youknowriad merged commit 1a6fb1e into master Jun 8, 2020
@youknowriad youknowriad deleted the remove/with-block-edit-context branch June 8, 2020 08:44
@github-actions github-actions bot added this to the Gutenberg 8.3 milestone Jun 8, 2020
@marekhrabe
Copy link
Copy Markdown
Contributor

Noting here that we have used useBlockEditContext in Jetpack recently but to keep the backwards compatibility for 5.3, I'll also implement withBlockEditContext and switch between them, as they available until we can fully transition for hook-only.

Mentioning it here because I've noticed it's considered internal (from the PR title) but is also being leveraged at least in one plugin.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Package] Block editor /packages/block-editor [Type] Code Quality Issues or PRs that relate to code quality [Type] Performance Related to performance efforts

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants