diff --git a/docs/2-features/02-asset-bundling.md b/docs/2-features/02-asset-bundling.md index be2372109a..5d8cab0d49 100644 --- a/docs/2-features/02-asset-bundling.md +++ b/docs/2-features/02-asset-bundling.md @@ -1,7 +1,7 @@ --- title: Asset bundling description: "Web applications usually need to serve assets to users. Tempest provide a seamless integration with Vite, the most popular front-end development server and build tool" -keywords: ["vite", "frontend", "js", "css", "ts", "typescript", "javascript", "sri", "manifest", "assets"] +keywords: ["vite", "frontend", "js", "css", "ts", "typescript", "javascript", "sri", "manifest", "assets", "prefetch"] --- ## Overview @@ -102,6 +102,21 @@ By default, assets are compiled in the `public/build` directory. This directory This directory is already in your `.gitignore` if you used the `{sh}php tempest install vite` command. ::: +## Prefetching assets + +Tempest can instruct the browser to prefetch lazily loaded chunks in the background, so the user doesn't have to wait for them to download later. To enable it, configure the `prefetching` parameter in a `vite.config.php` file: + +```php app/vite.config.php +return new ViteConfig( + prefetching: new PrefetchConfig( + strategy: PrefetchStrategy::WATERFALL, + concurrent: 3, + ), +); +``` + +The `WATERFALL` strategy downloads `concurrent` assets at a time, while `AGGRESSIVE` downloads all of them at once. Prefetching starts on the `load` event by default, which you may change with the `prefetchEvent` parameter. + ## Using a `nonce` attribute If your application uses a [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/CSP), you may need to include `nonce` attributes to the tags generated by `{html}`.