3

2017 年中随笔

 2 years ago
source link: https://blog.uiharu.top/archives/at-mid-2017-something-to-say.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client
2017 年中随笔
2017-06-07发表2020-09-02更新浮生记8 分钟读完 (约1256字)41次访问

2017 年中随笔

素练风霜起,苍鹰画作殊。高考第一晚简单写几笔总结下2017的前半段

博客新采用的优化

localStronge —— 优化 css 和 js 的加载

localStronge 是 Material 主题的 1.4.0 中添加的新特性,你可以尝试,在控制台中关闭 Disable cache 后,你会发现只加载了极少的 css 和 js 。这都归功于启用了
localStorage , localStorage 相比 cookie ,可以缓存大体积的数据,而且是永久有效。所以,如果把 js 资源和 css 资源存储在 localStorage 中,则可以省去发送 http 请求所消耗的时间,大大提高用户的浏览体验。

下图是各浏览器对 localStorage 的兼容性列表
Can I use localStorage?

Service Worker —— 离线浏览博客

本博客在5月起启用了 Service Worker ,方便访客离线访问。尽管并没有什么访客 ←_←

Service的意思是服务, Worker 的意思是工人,那么 Service Worker 的意思就是服务员。这个员工是2014年6月 HTML5 新招的实习生,目前在试用中。在此之前,已经有一位老员工,它叫 Web Worker 。那么问题来了,Boss 是谁? Boss 就是浏览器。准确来说,每个页面的 javascript 运行主线程都是一个 Boss 。
这里先谈一下大的背景。 Boss 很厉害,在页面上指点江山,呼风唤雨。但他有个局限:同一时刻只做一件事 ( 单线程 ) 。当一些很耗时的杂事让 Boss 去处理时,在处理的过程中他就无暇顾及其它重要的事了。在用户看来,页面没人管了, Boss 不干事了!这时 Boss 就很郁闷。为了保证 Boss 能处理更重要的事情,董事会 ( W3C ) 终于招聘了一个新员工: Web worker 。这下, Boss 终于可以从耗时的杂事中解放出来了,他只需要把 Web worker 叫过来说:“这些事情拿去做,没做完不要来找我”。 Web worker 领到任务后默默地到自己的工位 ( 线程 ) 去干活,完成之后给 Boss 发了个邮件 ( postMessage ) 。 Boss 收到邮件 ( onmessage ) 后欣慰地点了点头。
扯了半天好像还没谈到新员工啊。不急,下面就讲到了。
Boss 下班了 ( 页面关闭 ) , Web worker 也收拾东西回家了。这样执行了很久,直至 2014年6月 ,董事会发现一个问题:“居然没有人在老板下班后加班?”。于是,又招了一个专职加班的:Service Worker 。它被赋予的绩效目标如下:

  • 入职 ( install ) 后永不下班,而能更新。
    能处理 Boss 需要的资源 ( HTTPS请求 ) ,以便离线时也能让 Boss 取到数据 ( 从 cache 中 ) 。
  • 能向客户推送消息 ( push notifications ) ,不允许越权管理 Boss 的事 ( DOM ACCESS ) 。
    总的来说, Service worker 是独立于页面的一个运行环境,它在页面关闭后仍可以运行。同时,也能对它负责的页面的网络请求进行截取和返回请求 ( 类似于Fiddler ) 。
    ——页面守护者:Service Worker作者:IMWeb coolriver-IMWeb社区

简而言之, Service Worker 就是缓存网页后,通过劫持方式访问缓存网页,达到离线访问的目的的黑科技。
当然,该技术只能在大部分的浏览器Safari 这个辣鸡还是不支持中体验到。

Service Worker 实现原理

下图是各浏览器对 Service Worker 的兼容性列表
Can I use Service Worker?

通过这两个技术的优化,再加上静态资源的 upyun 缓存,访问速度和体验都大大提高了。

下一步致力于优化

  • HSTS启用
  • PWA 的支持
  • 主页和 offline.html将由个人完全原创重构

接下来的个人安排

虽然是一个高二党,但的的确确真真切切准备体验一次完整的延时1h高考,体验一番。高考第一天晚更新一波。
预计接下来的半年,完成期末考试前,更新不会太频繁是一直很少,很不频繁!!

最后念几句诗

画鹰
素练风霜起,苍鹰画作殊。
㧐身思狡兔,侧目似愁胡。
绦镟光堪擿,轩楹势可呼。
何当击凡鸟,毛血洒平芜。


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK