fix: blocks css performance

Codeinwp / otter-blocks

Create beautiful and attracting posts, pages, and landing pages with Gutenberg Blocks and Template Library by Otter.

https://wordpress.org/plugins/otter-blocks/

GNU General Public License v3.0

133 stars 33 forks source link

fix: blocks css performance #2061

Closed HardeepAsrani closed 7 months ago

HardeepAsrani commented 7 months ago

Closes #2056.

Summary

This fixes the issue with Blocks CSS updating reusable blocks with every typing event.

Test instructions

You can follow the reproduction steps defined in the issue and confirm the console notice doesn't appear anymore.

Checklist before the final review

[ ] Included E2E or unit tests for the changes in this PR.
[x] Visual elements are not affected by independent changes.
[x] It is at least compatible with the minimum WordPress version.
[x] It loads additional script in frontend only if it is required.
[x] Does not impact the Core Web Vitals.
[x] In case of deprecation, old blocks are safely migrated.
[x] It is usable in Widgets and FSE.
[x] Copy/Paste is working if the attributes are modified.
[x] PR is following [the best practices]()

pirate-bot commented 7 months ago

Bundle Size Diff

Package	Old Size	New Size	Diff
Animations	237.69 KB	237.69 KB	0 B (0.00%)
Blocks	1.5 MB	1.5 MB	0 B (0.00%)
CSS	91.71 KB	91.76 KB	48 B (0.05%)
Dashboard	362.67 KB	362.67 KB	0 B (0.00%)
Onboarding	152.43 KB	152.43 KB	0 B (0.00%)
Export Import	89.53 KB	89.53 KB	0 B (0.00%)
Pro	354.02 KB	354.02 KB	0 B (0.00%)

pirate-bot commented 7 months ago

Plugin build for 8288895e5fd9852c60c16c6acbb08577c18908df is ready :bellhop_bell:!

Download Otter – Page Builder Blocks & Extensions for Gutenberg - Production ~ Development
Download Otter Pro - Production ~ Development
Download Blocks Animation - Production ~ Development
Download Blocks CSS - Production ~ Development
Download Blocks Export Import - Production ~ Development

pirate-bot commented 7 months ago

E2E Tests

Playwright Test Status:

Performance Results

serverResponse: 193.65, firstPaint: 541.45, domContentLoaded: 1521.9, loaded: 1524.25, firstContentfulPaint: 9617.6, firstBlock: 11739.6, type: 48.2, minType: 44.12, maxType: 50.84, typeContainer: 12.25, minTypeContainer: 10.62, maxTypeContainer: 14.09, focus: 56.91, minFocus: 50.58, maxFocus: 67.02, inserterOpen: 22.68, minInserterOpen: 20.51, maxInserterOpen: 32.5, inserterSearch: 5.49, minInserterSearch: 5.17, maxInserterSearch: 5.87, inserterHover: 48.27, minInserterHover: 46.83, maxInserterHover: 52.92, listViewOpen: 135.38, minListViewOpen: 123.81, maxListViewOpen: 154.42

pirate-bot commented 6 months ago

:tada: This PR is included in version 2.6.3 :tada:

The release is available on GitHub release

Your semantic-release bot :package::rocket: