-
Notifications
You must be signed in to change notification settings - Fork 222
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Cache Playground assets to enable offline support #1535
base: add/vite-cache-paths-plugin
Are you sure you want to change the base?
Conversation
Playground can now load from the cache when there is no server. There is still an issue on the first load where some static assets aren't pulled from cache. Other TODOs:
|
packages/php-wasm/web-service-worker/src/initialize-service-worker.ts
Outdated
Show resolved
Hide resolved
packages/php-wasm/web-service-worker/src/initialize-service-worker.ts
Outdated
Show resolved
Hide resolved
#1541 adds a cache version to the Web service worker. |
// Get the cache manifest and add all the files to the cache | ||
const manifestResponse = await fetch('/cache-files.json'); | ||
const websiteUrls = await manifestResponse.json(); | ||
await cache.addAll([...websiteUrls, ...['/']]); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@adamziel this will download all PHP and WP versions into cache.
Is this ok for v1 or should we limit it to the current WP and PHP version?
If yes, users won't be able to switch versions while offline.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I would limit this for v1 to avoid adding 200-300mb of extra transfer. No switching is fine for now, we'll find the right way of downloading the missing assets and communicating that to the user as a part od the webapp redesign issue.
Motivation for the change, related issues
The promise of Playground is WordPress anywhere.
Playground can run in the browser without a server, but it still requires the internet on every load.
This PR adds asset caching of Playground assets and ensures they are available when offline.
Implementation details
The PHP-wasm service worker will now start the cache when initialized and clean previous versions if they exist.
On each unscoped fetch request, it will attempt to load data from the cache by using the
cachedFetch
method.The WorkerCache class uses the browser cache to preload data when the service worker is installed. It also caches any other valid unscoped fetch request to speed up reloads of Playground. The
isValidHostname
method checks if the request should be cached.To ensure remote assets are available while offline they are loaded during boot.
If Playground is online they will still be loaded in the background to reduce the number of server requests.
Testing Instructions (or ideally a Blueprint)
Note: In Chrome the offline checkbox sometimes stops working. When this happens Playground will load without remote assets and admin styles (including the admin bar) will look broken. If it happens you can confirm it by running
window.navigator.onLine
. To resolve it uncheck and check the Offline checkbox and reload.TODO
These issues will be resolved by the redesign #1561, but we should still decide what's the best solution in the meantime.