Comment by emmanueloga_

In the meanwhile, I found that enabling page transitions is a progressive enhancement tweak that can go a long way in making HTML replacement unnecessary in a lot of cases.

1) Add this to your css:

    @view-transition { navigation: auto; }

2) Profit.

Well, not so fast haha. There are a few details that you should know [1].

* Firefox has not implemented this yet but it seems likey they are working on it.

* All your static assets need to be properly cached to make the best use of the browser cache.

Also, prefetching some links on hover, like those on a navbar, is helpful.

Add a css class "prefetch" to the links you want to prefetch, then use something like this:

    document.addEventListener("mouseover", ({target}) => {
      if (target.tagName !== "A" || !target.classList.contains("prefetch")) return;
      target.classList.remove("prefetch");

      const linkElement = document.createElement("link");
      linkElement.rel = "prefetch";
      linkElement.href = target.getAttribute("href");
      document.head.appendChild(linkElement);
    })

There's more work on prefetching/prerendering going on but it is a lil green (experimental) at the moment [2].

--

1: https://developer.mozilla.org/en-US/docs/Web/CSS/@view-trans...

2: https://developer.mozilla.org/en-US/docs/Web/API/Speculation...