Theme JSON: cached resolved URIs #66155

ramonjd · 2024-10-16T04:58:36Z

What?

Implement "pretty basic caching" for resolved theme URIs in WP_Theme_JSON_Resolver::get_resolved_theme_uris.

Why?

The intention to improve performance, even if slightly.

WP_Theme_JSON_Resolver::get_resolved_theme_uris, and WP_Theme_JSON_Resolver::resolve_theme_file_uris which calls it, is fired multiple times in a single session to:

Generate styles
Deliver resolved URIs in a global styles controller response.

Results will become more pronounced as other relative paths are introduced, e.g., fonts, and more blocks support background images.

Cached data is not be stored persistently across page loads.

How?

Simple object caching.

Testing Instructions

Run npm run test:unit:php:base -- --filter WP_Theme_JSON_Resolver_Gutenberg_Test

Create a theme.json with background image paths defined for several blocks.

Ensure these appear as expected in the editor and frontend.

In the theme.json file, replace one or several paths with new asset paths. Check that the styles have been updated and the editor/frontend looks good.

Here is some test JSON based on current assets in TT5:

{
	"$schema": "../../schemas/json/theme.json",
	"version": 3,
	"settings": {
		"appearanceTools": true
	},
	"styles": {
		"background": {
			"backgroundImage": {
				"url": "file:./assets/images/category-anthuriums.webp"
			}
		},
		"blocks": {
			"core/group": {
				"background": {
					"backgroundImage": {
						"url": "file:./assets/images/category-cactus.webp"
					}
				}
			},
			"core/post-content": {
				"background": {
					"backgroundImage": {
						"url": "file:./assets/images/hero-podcast.webp"
					}
				}
			},
			"core/quote": {
				"background": {
					"backgroundImage": {
						"url": "file:./assets/images/category-sunflowers.webp"
					}
				}
			},
			"core/pullquote": {
				"background": {
					"backgroundImage": {
						"url": "file:./assets/images/dallas-creek-square.webp"
					}
				}
			}
		}
	}
}

phpunit/class-wp-theme-json-resolver-test.php

github-actions · 2024-10-18T05:21:51Z

Flaky tests detected in fb5e0f3.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/11397729500
📝 Reported issues:

[Flaky Test] Create a pattern with overrides #58009 in /test/e2e/specs/editor/various/pattern-overrides.spec.js
[Flaky Test] submenu click on the arrow interactions #61884 in /test/e2e/specs/editor/blocks/navigation-frontend-interactivity.spec.js

github-actions · 2024-10-21T02:54:58Z

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 props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: ramonjd <[email protected]>
Co-authored-by: aaronrobertshaw <[email protected]>
Co-authored-by: mukeshpanchal27 <[email protected]>
Co-authored-by: spacedmonkey <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

Theme JSON: cached resolved URIs

lib/class-wp-theme-json-resolver-gutenberg.php

ramonjd · 2024-10-21T04:13:35Z

lib/class-wp-theme-json-resolver-gutenberg.php

@@ -850,6 +861,13 @@ public static function get_resolved_theme_uris( $theme_json ) {
 			return $resolved_theme_uris;
 		}

+		$theme_json_data               = $theme_json->get_raw_data();
+		$resolved_theme_uris_cache_key = md5( wp_json_encode( $theme_json_data ) );


Not yet sure if this will make things better or worse 😄

It'd be great if WordPress had minimum PHP 8 support for faster hashing: https://php.watch/articles/php-hash-benchmark

md4 outperforms md5 for file integrity on many benchmarks I've seen but hash( 'md4', wp_json_encode( $theme_json_data ) ) doesn't move the needle at all for me in performance tests.

If we had a minimum PHP version of 8, we could avoid the hashing and use a WeakMap where the theme_json data/object was the key.

spacedmonkey · 2024-10-21T16:57:43Z

As this is performance related, CC @felixarntz @joehoyle

aaronrobertshaw

Thanks for following up on this one @ramonjd 👍

Bonus points for the theme.json snippet in the test instructions. Definitely made this easier to test.

✅ Code changes make sense
✅ Unit tests are passing
✅ Background images set with relative paths display correctly
✅ Background images update correctly when adding new path or switching ones around

Screenshot of resolved image paths rendering

I think caching this data for a single request is fine for now. It would be an easy update to move it to a transient or something.

That said, I'm happy to defer to the performance experts in sanity checking the overall approach.

The CI test failure appears to be an unrelated time out. I've kicked that off again.

lib/class-wp-theme-json-resolver-gutenberg.php

mukeshpanchal27 · 2024-10-23T11:52:52Z

lib/class-wp-theme-json-resolver-gutenberg.php

@@ -850,6 +861,13 @@ public static function get_resolved_theme_uris( $theme_json ) {
 			return $resolved_theme_uris;
 		}

+		$theme_json_data               = $theme_json->get_raw_data();
+		$resolved_theme_uris_cache_key = md5( wp_json_encode( $theme_json_data ) );


Before the caching we should check theme development mode. WDYT?

$can_use_cached = ! wp_is_development_mode( 'theme' ); if ( $can_use_cached ) { // Add caching here. }

Good point, but I'm not sure whether it's required here just yet.

The method is called several times in a single session and the main performance enhancement here is to avoid subsequent (and expensive) processing in the same session. This applies to the frontend and editor.

Nothing is saved to the database so I don't expect theme developers to run into any gotchas when testing sites given that the cache is wiped every time the page refreshes.

Also it's being used in gutenberg_get_global_stylesheet and gutenberg_get_global_stylesheet which are both using caches as well.

I could be missing some subtleties so please let me know!

…Resolver

mukeshpanchal27 · 2024-10-24T05:38:24Z

I run profiling for WP_Theme_JSON_Resolver::get_resolved_theme_uris in wordpress-develop but its really quick function that don't take more processing time.

TT4 theme:

ramonjd self-assigned this Oct 16, 2024

ramonjd commented Oct 18, 2024

View reviewed changes

phpunit/class-wp-theme-json-resolver-test.php Outdated Show resolved Hide resolved

ramonjd added [Type] Enhancement A suggestion for improvement. Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json labels Oct 21, 2024

ramonjd changed the title ~~Try: cached resolved URIs~~ Theme JSON: cached resolved URIs Oct 21, 2024

ramonjd marked this pull request as ready for review October 21, 2024 02:54

ramonjd requested a review from spacedmonkey as a code owner October 21, 2024 02:54

ramonjd added a commit to ramonjd/wordpress-develop that referenced this pull request Oct 21, 2024

Syncing WordPress/gutenberg#66155

bd36ced

Theme JSON: cached resolved URIs

ramonjd mentioned this pull request Oct 21, 2024

Theme JSON: cached resolved URIs WordPress/wordpress-develop#7596

Open

ramonjd requested review from oandregal, tellthemachines, andrewserong and aaronrobertshaw October 21, 2024 03:14

ramonjd mentioned this pull request Oct 21, 2024

Performance Benchmarks for WordPress 6.7 WordPress/performance#1572

Closed

ramonjd commented Oct 21, 2024

View reviewed changes

lib/class-wp-theme-json-resolver-gutenberg.php Outdated Show resolved Hide resolved

ramonjd commented Oct 21, 2024

View reviewed changes

spacedmonkey requested review from joemcgill and felixarntz October 21, 2024 16:57

aaronrobertshaw reviewed Oct 22, 2024

View reviewed changes

mukeshpanchal27 reviewed Oct 23, 2024

View reviewed changes

lib/class-wp-theme-json-resolver-gutenberg.php Outdated Show resolved Hide resolved

mukeshpanchal27 reviewed Oct 23, 2024

View reviewed changes

ramonjd added 6 commits October 24, 2024 15:43

A pretty basic caching test for resolved theme URIs in WP_Theme_JSON_…

c8660e3

…Resolver

Add a test

6dea724

Merge tests with the same data

436486f

Add annotation for version

5cdb27e

Backport entry

2f172a9

Use hashed key built using stringified theme.json

739d40c

Fix your tests, man!

b9762eb

ramonjd force-pushed the try/cache-resolved-theme-uris branch from 9d34c56 to b9762eb Compare October 24, 2024 06:00

remove dupe call

6140eb0

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Theme JSON: cached resolved URIs #66155

Theme JSON: cached resolved URIs #66155

ramonjd commented Oct 16, 2024 •

edited

Loading

github-actions bot commented Oct 18, 2024

github-actions bot commented Oct 21, 2024 •

edited

Loading

ramonjd Oct 21, 2024

ramonjd Oct 21, 2024

ramonjd Oct 21, 2024

aaronrobertshaw Oct 22, 2024 •

edited

Loading

spacedmonkey commented Oct 21, 2024

aaronrobertshaw left a comment

mukeshpanchal27 Oct 23, 2024

ramonjd Oct 24, 2024

mukeshpanchal27 commented Oct 24, 2024

Theme JSON: cached resolved URIs #66155

Are you sure you want to change the base?

Theme JSON: cached resolved URIs #66155

Conversation

ramonjd commented Oct 16, 2024 • edited Loading

What?

Why?

How?

Testing Instructions

github-actions bot commented Oct 18, 2024

github-actions bot commented Oct 21, 2024 • edited Loading

ramonjd Oct 21, 2024

Choose a reason for hiding this comment

ramonjd Oct 21, 2024

Choose a reason for hiding this comment

ramonjd Oct 21, 2024

Choose a reason for hiding this comment

aaronrobertshaw Oct 22, 2024 • edited Loading

Choose a reason for hiding this comment

spacedmonkey commented Oct 21, 2024

aaronrobertshaw left a comment

Choose a reason for hiding this comment

mukeshpanchal27 Oct 23, 2024

Choose a reason for hiding this comment

ramonjd Oct 24, 2024

Choose a reason for hiding this comment

mukeshpanchal27 commented Oct 24, 2024

ramonjd commented Oct 16, 2024 •

edited

Loading

github-actions bot commented Oct 21, 2024 •

edited

Loading

aaronrobertshaw Oct 22, 2024 •

edited

Loading