在哪里放置ServiceWorker片段 - 头部或身体?

时间:2017-01-12 14:02:26

标签: javascript service-worker offline-mode

我是从服务工作者开始的(派对有点晚了,但从来没有好过),我将<script>if ('serviceWorker' in navigator) {..}</script>片段放在最底部,低于我的其他片段({{1 }})。

这是一个好地方吗?我应该在哪里将标准脚本片段放在页面上:头部或者可能是身体的开始?或者将其外部放在另一个脚本中?

更重要 - 为什么?

2 个答案:

答案 0 :(得分:4)

根据您的服务工作者的重量级以及初次访问期间您需要在页面上执行多少JavaScript,它可能会也可能不会产生影响。但是,您可以阅读this article有关服务工作者注册最佳做法的信息,以便更深入地了解它何时可能很重要。

文章的内容是使用合理的模式

if ('serviceWorker' in navigator) {
  window.addEventListener('load', function() {
    navigator.serviceWorker.register('/service-worker.js');
  });
}

注册您的服务人员。只要它在load事件被触发之前运行,它几乎可以出现在页面的任何位置。

答案 1 :(得分:1)

FWIW,我认为最好先进行注册,以防万一您有一些第三方请求在进行,并且您需要配置一些运行时缓存...

...
    <link href='/favicon.png' rel='icon' type='image/png'>
    <link href="/manifest.json" rel="manifest">

    <script>
        'serviceWorker' in navigator && window.addEventListener('load', navigator.serviceWorker.register('/service-worker.js'))
    </script>

    <link href="https://fonts.googleapis.com/icon?family=Material+Icons&display=swap" rel="stylesheet">

    <link rel="stylesheet" href="/bundle.css">
</head>
...