Preloading navigations

Introduction

Serwist allows developers to enable navigation preloading in their service worker through the use of the NavigationPreloadManager interface. This has to be manually enabled.

If this functionality is enabled, Serwist will check whether navigation preloading is supported in the current browser, and if it is, an activate event handler will be automatically created to enable it.

The shared code that handles making network requests across all of Serwist automatically takes advantage of a preload response if it's available.

Who should enable navigation preloading?

Developers who are already handling navigations by responding with precached HTML do not need to enable navigation preload! This feature is intended to reduce navigation latency for developers who can't precache their HTML, but still want to use Serwist to handle caching of other assets on their sites.

Basic usage

import { enableNavigationPreload, NavigationRoute, NetworkFirst } from "serwist";
import { registerRoute } from "serwist/legacy";

enableNavigationPreload();

// Swap in NetworkOnly, CacheFirst, or StaleWhileRevalidate as needed.
const navigationStrategy = new NetworkFirst({
  cacheName: "cached-navigations",
});

const navigationRoute = new NavigationRoute(navigationStrategy, {
  // Optionally, provide a allow/denylist of RegExps to determine
  // which paths will match this route.
  // allowlist: [],
  // denylist: [],
});

registerRoute(navigationRoute);