Service Workers 实现网站加速和离线缓存

  • 内容
  • 相关

最近看到了 Service Workers 这个东西,它可以根据配置为用户缓存网站静态与动态资源:截获用户的所有网络请求,根据缓存配置来决定是从缓存还是网络获取相应资源,从而可以极大提高网页的加载速度。优点有可定制性高、不需要服务端支持、效果显著。最后的效果就是当你第二次访问我的网站时只会加载大约80k 的资源(除去 AdSense 的情况下),这其中包括了所有图片和音频视频,这 80k 主要是 HTML 和我使用的 DPlayer 的 API。

Image

甚至可以在断开网络时访问(剪断网线试试吧):

Image

当然局限性也是有的:只支持 HTTPS,因为可以截获用户的网络请求,需要在一个安全的环境。兼容性不太好,点击查看兼容性报告,目前只有 Chrome Firefox Opera 和部分 Android 浏览器 支持。

Image

使用方法网上有很多教程,这里不赘述了,推荐这几篇吧:

使用service worker+sw-precache实现网站加速

使用Service worker实现加速/离线访问静态blog网站

Service Workers 与离线缓存

本文标签:

版权声明:若无特殊注明,本文皆为《会飞的鱼》原创,转载请保留文章出处。

本文链接:Service Workers 实现网站加速和离线缓存 - https://f162.cn/post/286

发表评论

电子邮件地址不会被公开。 必填项已用*标注

未显示?请点击刷新

允许邮件通知

评论

4条评论
  1. avatar

    惠勇 Lv.1 QQbrowser QQbrowser Android 6.0.1 Android 6.0.1 回复

    回复了(抽烟)

    广东省东莞市 电信

    1. avatar

      虫子 Sogou Explorer Sogou Explorer Windows Windows 回复

      回复了[滑稽]

      广东省东莞市 电信

      1. avatar

        虫子 Sogou Explorer Sogou Explorer Windows Windows 回复

        OωO( ̄へ ̄)回复了(便便)

        广东省东莞市 电信

        1. avatar

          虫子 Sogou Explorer Sogou Explorer Windows Windows 回复

          [img]http://www.17uw.cn/content/templates/FLY/img/logo.png[/img]

          广东省东莞市 电信