menu Xed.Go
search refresh more_vert
Shenzhen, China

对blog的疯狂优化,server worker + pjax + http2 + 查询缓存
2018-05-12 05:49:26

更新:

  写这篇文章的时候我已经取消了server worker这项功能,因为他与pjax有冲突,只能二选一,我选择了pjax,因为我希望在访客浏览的过程中,某些东西不要重新加载,比如音乐~。下面有给大家一张图展示server worker的强大之处【server worker支持离线访问】。另外你也可以访问这个网站来进行测试:https://flyhigher.top/

如果你有兴趣实现的话,可以几行代码实现,第一步:在首页加入以下js代码:


if ('serviceWorker' in navigator) {
    navigator.serviceWorker
        .register('/sw/sw.js', {scope: '/'})
        .then(registration => console.log('ServiceWorker 注册成功!作用域为: ', registration.scope))
        .catch(err => console.log('ServiceWorker 注册失败: ', err));
}

然后引入js文件(请将js文件下载本地,一定要放置在根目录): 


https://xedgo.com/sw.js

sw.js简单配置明细:


const offlineResources = [
  '/',
  'offline.html',//用户断网后,若没有注册过某个页面,则显示该页面
  '/static/highlight.pack.js',
  '/static/app.css',
  '/static/code_style.css',
  'https://cdn.bootcss.com/jquery.pjax/2.0.1/jquery.pjax.min.js',
  'https://cdn.bootcss.com/mdui/0.4.0/js/mdui.min.js'
];

目前支持的浏览器有如下: