<section class="full-height center">
  <div class="column space-around">
    <h2 class="subtitle">Thanks for watching!</h2>
  </div>

  <footer class="footer center">
    <div class="column">
      {{ if isset .Site.Params "social" }}
      <ul class="list-inline intro-social-buttons">
        {{ partial "social.html" . }}
      </ul>
      {{ end }}
    </div>
  </footer>
</section>

<pwa-update-available class="update-available" hidden>
  <button class="update-available__button">Update available</button>
</pwa-update-available>

</body>
<script type="module" async>
  if ('serviceWorker' in navigator) {
    window.addEventListener('load', () => {
      navigator.serviceWorker.register('/sw.js');
    });
  }
  import './js/pwa-helper-components/pwa-update-available.js';
</script>

</html>

<section class="full-height center">
  <div class="column space-around">
    <h2 class="subtitle">Thanks for watching!</h2>
  </div>

  <footer class="footer center">
    <div class="column">
      {{ if isset .Site.Params "social" }}
      <ul class="list-inline intro-social-buttons">
        {{ partial "social.html" . }}
      </ul>
      {{ end }}
    </div>
  </footer>
</section>

<pwa-update-available class="update-available" hidden>
  <button class="update-available__button">Update available</button>
</pwa-update-available>

</body>
<script type="module" async>
  if ('serviceWorker' in navigator) {
    window.addEventListener('load', () => {
      import('./js/pwa-helper-components/pwa-update-available.js');
      navigator.serviceWorker.register('/sw.js');
    });
  }
</script>

</html>

Load only after page is loaded
fix(pwa-update-available): Load only after page is loaded
