Loading Demo

In plain javascript:

document.title = 'Loading.';
const loadingTextTimeout = setInterval(() => {
  if (document.title !== 'Loading.....') {
    document.title += '.';
  } else {
    document.title = 'Loading.';
  }
}, 250);

const onLoaded = () => {
  clearInterval(loadingTextTimeout);
  document.title = 'Success!';
  var link = document.querySelector("link[rel~='icon']");
  link.href = "./success.gif"
}
  

With a framework (like svelte):

<svelte:head>
  <title>{isLoading ? `Loading${loadingDots}` : 'Success!'}</title>
  <link rel="icon" href={isLoading ? './loading.svg' : './success.gif'} />
</svelte:head>
  

You can have a lot of fun manipulating the title tag and favicon with JavaScript. Watch your browser tab as the title text is updated until some arbitrary time later when it declares itself done loading. This is a very basic example, but you can be as creative as you want with it! Some browsers (Firefox, for example) even support GIFs as favicons.