0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2025-03-24 23:21:57 -05:00

fix: client prerender fallback (#10295)

* fix: client prerender fallback

* Use Speculation Rules prefetch as prerender fallback instead of link tag, improve changeset

* Update .changeset/warm-spoons-fetch.md

---------

Co-authored-by: Bjorn Lu <bjornlu.dev@gmail.com>
This commit is contained in:
Ross Robino 2024-03-07 08:31:30 -05:00 committed by GitHub
parent d121311a3f
commit fdd5bf277e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 15 additions and 1 deletions

View file

@ -0,0 +1,5 @@
---
"astro": patch
---
Adds a prefetch fallback when using the `experimental.clientPrerender` option. If prerendering fails, which can happen if [Chrome extensions block prerendering](https://developer.chrome.com/blog/speculation-rules-improvements#chrome-limits), it will fallback to prefetching the URL. This works by adding a `prefetch` field to the `speculationrules` script, but does not create an extra request.

View file

@ -1653,7 +1653,7 @@ export interface AstroUserConfig {
* @description
* Enables pre-rendering your prefetched pages on the client in supported browsers.
*
* This feature uses the experimental [Speculation Rules Web API](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API) and overrides the default `prefetch` behavior globally to prerender links on the client.
* This feature uses the experimental [Speculation Rules Web API](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API) and enhances the default `prefetch` behavior globally to prerender links on the client.
* You may wish to review the [possible risks when prerendering on the client](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API#unsafe_prefetching) before enabling this feature.
*
* Enable client side prerendering in your `astro.config.mjs` along with any desired `prefetch` configuration options:

View file

@ -330,6 +330,15 @@ function appendSpeculationRules(url: string) {
urls: [url],
},
],
// Currently, adding `prefetch` is required to fallback if `prerender` fails.
// Possibly will be automatic in the future, in which case it can be removed.
// https://github.com/WICG/nav-speculation/issues/162#issuecomment-1977818473
prefetch: [
{
source: 'list',
urls: [url],
},
],
});
document.head.append(script);
}