refactor: Fetch and cache GutenbergKit editor settings #24417

dcalhoun · 2025-04-05T01:01:57Z

Fetch and cache editor settings before providing them to the editor, as it
allows improving offline support. The changes also communicate the
background activity with an activity indicator.

Ref CMM-200.

Important

Ensure the following experimental features are enabled:

Experimental block editor
Experimental block editor styles

1: Initial editor fallbacks to default settings

Enable airplane mode.
Open the post editor.
Verify the editor loads, using default settings—e.g., white background with black text.

2: Editor fetches site-specific settings

Disable airplane mode.
Open the post editor.
Verify the editor loads with site-specific settings—e.g., the theme's background and foreground colors.

3: Editor fallback to cached settings

Enable airplane mode.
Open the post editor.
Verify the editor loads with site-specific settings—e.g., the theme's background and foreground colors.

Regression Notes

Potential unintended areas of impact
Regressions in Gutenberg Mobile or Aztec editors.
What I did to test those areas of impact (or what existing automated tests I relied on)
Manually smoke tested the editors.
What automated tests I added (or what prevented me from doing so)
Deemed unnecessary for the experimental editor.
PR submission checklist:

I have completed the Regression Notes.
I have considered adding unit tests for my changes.
I have considered adding accessibility improvements for my changes.
I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

Testing checklist:

dangermattic · 2025-04-05T01:02:42Z

	2 Warnings
⚠️	`Modules/Package.swift` was changed without updating its corresponding `Package.resolved`. Please resolve the Swift packages as appropriate to your project setup (e.g. in Xcode or by running `swift package resolve`).
⚠️	PR is not assigned to a milestone.

Generated by 🚫 Danger

wpmobilebot · 2025-04-09T19:24:22Z

📲 You can test the changes from this Pull Request in WordPress by scanning the QR code below to install the corresponding build.

	App Name	WordPress
	Configuration	Release-Alpha
	Build Number	`27516`
	Version	`PR #24417`
	Bundle ID	`org.wordpress.alpha`
	Commit	`487ede4`
	Installation URL	5qc7k318n5vjo

Automatticians: You can use our internal self-serve MC tool to give yourself access to those builds if needed.

wpmobilebot · 2025-04-09T19:26:27Z

📲 You can test the changes from this Pull Request in Jetpack by scanning the QR code below to install the corresponding build.

	App Name	Jetpack
	Configuration	Release-Alpha
	Build Number	`27516`
	Version	`PR #24417`
	Bundle ID	`com.jetpack.alpha`
	Commit	`487ede4`
	Installation URL	2klik7q580q4g

Automatticians: You can use our internal self-serve MC tool to give yourself access to those builds if needed.

WordPress/Classes/ViewRelated/NewGutenberg/NewGutenbergViewController.swift

jkmassel · 2025-04-16T20:20:51Z

WordPress/Classes/Services/RawBlockEditorSettingsService.swift

+    }
+
+    @MainActor
+    func fetchSettings() async throws -> [String: Any] {


What happens if we've never fetched the settings and the network connection fails?

In my testing it seems like it'll just show a spinner forever?

If we don't have locally cached settings and the network request fails we should probably:

Try again some number of times (maybe 2?)

Show an error message

I could see an argument for showing some kind of editor with no remote settings, but I don't know how feasible that is?

Your experience is surprising. These changes were built to accomplish what you describe. When I block the network request (via Charles Proxy) for the editor settings, the editor continues to load with default editor settings after a moment.

How are you causing the network connection failure in your testing?

The screen recording below showcases both the default settings and site-specific settings.

Screen.Recording.2025-04-16.at.16.44.12.mov

In fact, the situation you describe is a part of the testing instructions in the PR description. 😄 I'm perplexed as to why you may be experiencing a different outcome.

jkmassel · 2025-04-23T00:54:35Z

So it's not forever, but it is almost 5 minutes:

gutenbergkit-measure_editor-first-render: 298.35688507556915

I can consistently repro this by enabling the Network Link Conditioner (on a real device), setting it to "Very Bad Network", then running this PR on that device and following the testing instructions.

I suspect we can resolve the issue by putting a timeout on how long we wait for the remote network settings (I'd suggest 5 seconds – IINM, the connection timing out should automatically cause the "whoops, we couldn't load editor settings" dialog.

This reverts commit e4ec71b6c77e2439e9d98c0273f9bdcff64d098f.

This reverts commit 39ac9caf71089853e5f256697f4882cc55d2bffd.

Remove unnecessary completion handler structure.

Improve editor start performance.

Mitigate stale editor settings.

The cache was discarded each time the editor closed, which defeats the purpose of the cache. We must store it somewhere outside the editor view controller.

Avoid sending both foreground and background requests.

Revalidating the cache on each editor launch will ensure the latest settings are available.

Improve load speed of editor.

This conditional was overlooked when the local experimental feature toggle was augmented with a remote feature flag for roll out control. #24465

Avoid postponing the editor start for longer than three seconds. We instead present the editor without any site-specific settings.

jkmassel

Having discussed this in Slack, it seems this is as good as it'll get for now. We can control the settings loading prior to the editor being displayed, but unfortunately there's no UI inside the editor to show the other network operations that are happening.

This looks solid, and should work well in the vast majority of cases – if someone's network is this bad they're probably having a hard time using the app anyway.

jkmassel · 2025-04-24T19:29:46Z

WordPress/Classes/ViewRelated/NewGutenberg/NewGutenbergViewController.swift

+
+        Task { @MainActor in
+            // Start the editor with default settings after 3 seconds
+            let timeoutTask = Task {


This is a clever way to address this – I think ideally we'd just use the timeout property on URLRequest, but we don't really own WordPressOrgRestApi. I guess we'll come back to this when it's time to adopt the Rust-layer REST API, and we can switch it over then.

dcalhoun · 2025-04-24T19:40:40Z

[...] unfortunately there's no UI inside the editor to show the other network operations that are happening.

Long term, I believe we can improve the experience with WebView-driven UI so that it display a "skeleton" while additional requests complete.

That said, it gets complicated for the remote/site-specific editor. That editor fetches its React library (used for composing UI)—do we await React or build skeleton UI without React? We likely do the latter, and we can also finish implementing cached bundles to further improve the loading experience.

sonarqubecloud · 2025-04-24T20:03:07Z

Quality Gate passed

Issues
2 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

dcalhoun changed the title ~~feat: Provide GutenbergKit editor settings~~ refactor: Provide GutenbergKit editor settings Apr 5, 2025

This was referenced Apr 9, 2025

refactor: Host provides editor settings wordpress-mobile/GutenbergKit#114

Merged

refactor: Fetch and cache GutenbergKit editor settings wordpress-mobile/WordPress-Android#21791

Merged

dcalhoun force-pushed the feat/provide-editor-settings branch from 7cdf99a to 9ceb20e Compare April 9, 2025 19:13

dcalhoun added [Type] Enhancement Gutenberg Editing and display of Gutenberg blocks. labels Apr 9, 2025

dcalhoun force-pushed the feat/provide-editor-settings branch from 9ceb20e to 80f864d Compare April 11, 2025 14:59

dcalhoun changed the title ~~refactor: Provide GutenbergKit editor settings~~ refactor: Fetch and cache GutenbergKit editor settings Apr 11, 2025

dcalhoun marked this pull request as ready for review April 12, 2025 01:14

dcalhoun requested a review from jkmassel April 12, 2025 01:15

jkmassel reviewed Apr 16, 2025

View reviewed changes

WordPress/Classes/ViewRelated/NewGutenberg/NewGutenbergViewController.swift Show resolved Hide resolved

jkmassel requested changes Apr 16, 2025

View reviewed changes

dcalhoun force-pushed the feat/provide-editor-settings branch from d26a943 to c8aa2cf Compare April 17, 2025 18:47

dcalhoun requested a review from jkmassel April 18, 2025 17:00

dcalhoun added 12 commits April 24, 2025 11:22

hoist settings

3179db1

refactor: Update settings via JavaScript bridge

dfce8e6

fix: Fetch the entirety of the editor settings

1952cc9

Revert "refactor: Update settings via JavaScript bridge"

8ebe71e

This reverts commit e4ec71b6c77e2439e9d98c0273f9bdcff64d098f.

feat: Postpone editor initialization

b3b2129

Revert "feat: Postpone editor initialization"

f9231fa

This reverts commit 39ac9caf71089853e5f256697f4882cc55d2bffd.

refactor: Defer editor start

17d5798

refactor: Simplify RawBlockEditorSettingsService

de5e535

Remove unnecessary completion handler structure.

feat: Cache editor settings fetch

e5222b4

Improve editor start performance.

feat: Editor settings use stale-while-revalidate cache

45c644c

Mitigate stale editor settings.

style: Use shorthand

4ce5fd9

feat: Cache editor settings across editor sessions

0e4ba97

The cache was discarded each time the editor closed, which defeats the purpose of the cache. We must store it somewhere outside the editor view controller.

dcalhoun added 10 commits April 24, 2025 11:22

refactor: Avoid duplicative settings requests

c379b1a

Avoid sending both foreground and background requests.

feat: Remove time-based cache

e19b669

Revalidating the cache on each editor launch will ensure the latest settings are available.

build: Update GutenbergKit ref

09ffd57

build: Update GutenbergKit ref

676f0ff

build: Update GutenbergKit ref

bf7fcff

build: Update GutenbergKit ref

fe5ff15

perf: Preload editor settings within My Site

bfa177e

Improve load speed of editor.

fix: Enable GutenbergKit warmup via remote feature flag

8f12133

This conditional was overlooked when the local experimental feature toggle was augmented with a remote feature flag for roll out control. #24465

feat: Start editor without settings after three seconds

acd2567

Avoid postponing the editor start for longer than three seconds. We instead present the editor without any site-specific settings.

refactor: DRY up fetching editor settings

e8a892c

dcalhoun force-pushed the feat/provide-editor-settings branch from f294279 to e8a892c Compare April 24, 2025 15:22

jkmassel approved these changes Apr 24, 2025

View reviewed changes

build: Update GutenbergKit ref

487ede4

dcalhoun added this pull request to the merge queue Apr 24, 2025

Merged via the queue into trunk with commit d82fdd4 Apr 24, 2025
32 of 34 checks passed

dcalhoun deleted the feat/provide-editor-settings branch April 24, 2025 20:58

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

refactor: Fetch and cache GutenbergKit editor settings #24417

refactor: Fetch and cache GutenbergKit editor settings #24417

Uh oh!

dcalhoun commented Apr 5, 2025 •

edited

Loading

Uh oh!

dangermattic commented Apr 5, 2025 •

edited

Loading

Uh oh!

wpmobilebot commented Apr 9, 2025 •

edited

Loading

Uh oh!

wpmobilebot commented Apr 9, 2025 •

edited

Loading

Uh oh!

Uh oh!

jkmassel Apr 16, 2025

Uh oh!

dcalhoun Apr 16, 2025

Uh oh!

dcalhoun Apr 16, 2025

Uh oh!

jkmassel commented Apr 23, 2025

Uh oh!

jkmassel left a comment

Uh oh!

jkmassel Apr 24, 2025

Uh oh!

dcalhoun commented Apr 24, 2025

Uh oh!

sonarqubecloud bot commented Apr 24, 2025

Uh oh!

Uh oh!

Uh oh!

refactor: Fetch and cache GutenbergKit editor settings #24417

refactor: Fetch and cache GutenbergKit editor settings #24417

Uh oh!

Conversation

dcalhoun commented Apr 5, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Regression Notes

Uh oh!

dangermattic commented Apr 5, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

wpmobilebot commented Apr 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

wpmobilebot commented Apr 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

jkmassel Apr 16, 2025

Choose a reason for hiding this comment

Uh oh!

dcalhoun Apr 16, 2025

Choose a reason for hiding this comment

Uh oh!

dcalhoun Apr 16, 2025

Choose a reason for hiding this comment

Uh oh!

jkmassel commented Apr 23, 2025

Uh oh!

jkmassel left a comment

Choose a reason for hiding this comment

Uh oh!

jkmassel Apr 24, 2025

Choose a reason for hiding this comment

Uh oh!

dcalhoun commented Apr 24, 2025

Uh oh!

sonarqubecloud bot commented Apr 24, 2025

Quality Gate passed

Uh oh!

Uh oh!

Uh oh!

dcalhoun commented Apr 5, 2025 •

edited

Loading

dangermattic commented Apr 5, 2025 •

edited

Loading

wpmobilebot commented Apr 9, 2025 •

edited

Loading

wpmobilebot commented Apr 9, 2025 •

edited

Loading