Skip to content

Conversation

@jasmussen
Copy link
Contributor

Although fading a box shadow should be performant, for whatever reason it feels clunky in the editor:

before

This PR simply removes the transition, making it feel much more responsive. I'm not finding myself missing the fade:

after

Although fading a box shadow should be performant, for whatever reason it feels clunky in the editor.

This PR simply removes the transition, making it feel much more responsive. I'm not finding myself missing the fade.
@jasmussen jasmussen added [Type] Enhancement A suggestion for improvement. [Type] Performance Related to performance efforts labels Oct 9, 2020
@jasmussen jasmussen self-assigned this Oct 9, 2020
@github-actions
Copy link

github-actions bot commented Oct 9, 2020

Size Change: -65 B (0%)

Total Size: 1.19 MB

Filename Size Change
build/block-editor/style-rtl.css 10.9 kB -32 B (0%)
build/block-editor/style.css 10.9 kB -33 B (0%)
ℹ️ View Unchanged
Filename Size Change
build/a11y/index.js 1.14 kB 0 B
build/annotations/index.js 3.54 kB 0 B
build/api-fetch/index.js 3.35 kB 0 B
build/autop/index.js 2.72 kB 0 B
build/blob/index.js 668 B 0 B
build/block-directory/index.js 8.55 kB 0 B
build/block-directory/style-rtl.css 943 B 0 B
build/block-directory/style.css 942 B 0 B
build/block-editor/index.js 129 kB 0 B
build/block-library/editor-rtl.css 8.65 kB 0 B
build/block-library/editor.css 8.65 kB 0 B
build/block-library/index.js 145 kB 0 B
build/block-library/style-rtl.css 7.66 kB 0 B
build/block-library/style.css 7.65 kB 0 B
build/block-library/theme-rtl.css 741 B 0 B
build/block-library/theme.css 741 B 0 B
build/block-serialization-default-parser/index.js 1.78 kB 0 B
build/block-serialization-spec-parser/index.js 3.1 kB 0 B
build/blocks/index.js 47.6 kB 0 B
build/components/index.js 169 kB 0 B
build/components/style-rtl.css 15.5 kB 0 B
build/components/style.css 15.5 kB 0 B
build/compose/index.js 9.43 kB 0 B
build/core-data/index.js 12 kB 0 B
build/data-controls/index.js 685 B 0 B
build/data/index.js 8.6 kB 0 B
build/date/index.js 31.9 kB 0 B
build/deprecated/index.js 772 B 0 B
build/dom-ready/index.js 568 B 0 B
build/dom/index.js 4.42 kB 0 B
build/edit-navigation/index.js 10.6 kB 0 B
build/edit-navigation/style-rtl.css 868 B 0 B
build/edit-navigation/style.css 871 B 0 B
build/edit-post/index.js 306 kB 0 B
build/edit-post/style-rtl.css 6.29 kB 0 B
build/edit-post/style.css 6.28 kB 0 B
build/edit-site/index.js 21 kB 0 B
build/edit-site/style-rtl.css 3.73 kB 0 B
build/edit-site/style.css 3.73 kB 0 B
build/edit-widgets/index.js 21.2 kB 0 B
build/edit-widgets/style-rtl.css 3.02 kB 0 B
build/edit-widgets/style.css 3.02 kB 0 B
build/editor/editor-styles-rtl.css 492 B 0 B
build/editor/editor-styles.css 493 B 0 B
build/editor/index.js 45.5 kB 0 B
build/editor/style-rtl.css 3.85 kB 0 B
build/editor/style.css 3.84 kB 0 B
build/element/index.js 4.45 kB 0 B
build/escape-html/index.js 734 B 0 B
build/format-library/index.js 7.49 kB 0 B
build/format-library/style-rtl.css 547 B 0 B
build/format-library/style.css 548 B 0 B
build/hooks/index.js 1.74 kB 0 B
build/html-entities/index.js 621 B 0 B
build/i18n/index.js 3.54 kB 0 B
build/is-shallow-equal/index.js 710 B 0 B
build/keyboard-shortcuts/index.js 2.39 kB 0 B
build/keycodes/index.js 1.85 kB 0 B
build/list-reusable-blocks/index.js 3.02 kB 0 B
build/list-reusable-blocks/style-rtl.css 476 B 0 B
build/list-reusable-blocks/style.css 476 B 0 B
build/media-utils/index.js 5.12 kB 0 B
build/notices/index.js 1.69 kB 0 B
build/nux/index.js 3.27 kB 0 B
build/nux/style-rtl.css 671 B 0 B
build/nux/style.css 668 B 0 B
build/plugins/index.js 2.44 kB 0 B
build/primitives/index.js 1.34 kB 0 B
build/priority-queue/index.js 790 B 0 B
build/redux-routine/index.js 2.85 kB 0 B
build/rich-text/index.js 13 kB 0 B
build/server-side-render/index.js 2.6 kB 0 B
build/shortcode/index.js 1.7 kB 0 B
build/token-list/index.js 1.24 kB 0 B
build/url/index.js 4.06 kB 0 B
build/viewport/index.js 1.74 kB 0 B
build/warning/index.js 1.14 kB 0 B
build/wordcount/index.js 1.17 kB 0 B

compressed-size-action

@karmatosed
Copy link
Member

It truly took me far too long than it should have to work out what the effect was it was trying to do, which is a strong indicator that yes this isn't performant. +1 from me to remove this, it seems like a great win and anything we can do to make things more performant I think is great.

@jasmussen
Copy link
Contributor Author

In practice, the actual performance game is probably very tiny, and mostly on high res screens. However the perceived performance gain, I feel, is quite big on any screen. Now selection feels instant because it looks instant, even if it's only marginally faster.

@jasmussen jasmussen merged commit daba378 into master Oct 9, 2020
@jasmussen jasmussen deleted the try/remove-outline-fade branch October 9, 2020 08:56
@jasmussen
Copy link
Contributor Author

Thank you Ella!

@github-actions github-actions bot added this to the Gutenberg 9.2 milestone Oct 9, 2020
@MichaelArestad
Copy link
Contributor

This is great. Nice work!

@enriquesanchez
Copy link
Contributor

Big fan of perceived performance gains 👏

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

Labels

[Type] Enhancement A suggestion for improvement. [Type] Performance Related to performance efforts

Projects

None yet

Development

Successfully merging this pull request may close these issues.

6 participants