TypeScript 中 import JSON 的正确姿势
最近 TypeScript 中毒，想想我一个弱类型出身的人，怎么就喜欢上了类型约束……当然这不是重点，重点可能还是 JS 没有接口，我没法靠 class 语法糖写的非常 OO……
关于 TS 的安利部分结束，今天我想说的其实是在 ts 中如何正确的 import json 格式。
首先我使用了基本姿势
import * as variable from './fooooooo.json'标签 代码段 下的文章
Stream 与 Buffer 的相互转换
在工作的时候突然就有了这样一个需求，这一次正好也对本来不太熟的 Stream 有了一点更加深刻的理解……（好吧本来是根本没搞清楚状况）。
Stream，中文叫做流，和我们平时充值信仰的那个 Steam 还是差了那么一点的。所谓流，是一种消费的模型，被消费完就木有了，所以如果我们需要重复使用，就得存下来，也就是把 Stream 转成别的东西——Just Like Array or Buffer。
CSS 像 font 一样使用 svg 与上色
这周在切图的时候拿到了 svg，之前自己一直是用 font-icon 的，感觉挺方便的，svg 相比 font-icon 有一些优点（这个以前在网上看到过），本文暂时不展开讲述了。
但是一些图标，在 Element 里自带的 el-icon-xxx 的方式非常统一，其实是根据 class 设置的，我也不喜欢 svg 的插入方式（太硬），所以希望尽可能的让项目中的 font 保持统一。
然后就发现了 svg 没法像 font icon 一样设置 color。
谈谈对 URIEncode 的一些处理
最近斗志非常差，当然很大程度还是自己的锅……这又不是个情感博客我就不细说了……
这周公司里又开始做新的东西了，大概是类似于反向代理，但是授权了私有库的权限，需要做一些限制，比如 GitHub 路径限制为 dist。
最初的时候我们这么验证路径：
CSS 揭秘笔记 - 文字效果
CSS 其实还是有很多学问的，上次正好说到了文字的一些效果，干脆就把 CSS Secret 中的文字效果都做一下笔记，还是有很多自己原来不知道的黑科技的。
CSS 文字描边效果的研究
前一阵在做 Chrome 插件研究了一波文字前景色的问题，最终我们还是把思路望向了描边，又正好最近看了一波《CSS 揭秘》，里面正好讲到了描边的问题。
最快捷的方法：text-stroke
有个神奇的 text-stroke 属性，如同名字所描述的那样，就是用于文字描边的。
缺点是，它的描边是内描边，占用了字体本身的空间，其二，兼容性太差，这并不是一个标准的属性，目前只支持很少的浏览器，关于它可以阅读：https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-text-stroke
CSS 文字反色的研究
在之前我们使用 Canvas 去计算颜色和反色，之后经过大佬提醒，原来 CSS 本身也是能根据背景色取反显示的。在这里，我们会学习一个新的特征：mix-blend-mode。
引用 MDN 的介绍：
mix-blend-mode CSS 属性描述了元素的内容应该与元素的直系父元素的内容和元素的背景如何混合。Canvas 优化指南
Canvas 性能是一个非常值得关注的问题，这次用 Canvas 也同样遇到了需要性能优化的点：我们在之前使用 Canvas 实现了 background: cover 的效果，但是这导致了 resize 的反复绘制，CPU 使用率飙升。
使用离屏渲染
对于这种场景，MDN 中的解释是「在离屏canvas上预渲染相似的图形或重复的对象」。
JavaScript 优化拖移效果
上次我们在 Canvas 实现根据背景色更改前景色中使用了一个拖动效果，刚开始非常智障的用 Drag & Drop，后来由于我们更关注一个即时的反馈，所以用 mousedown / mousemove / mouseup。
最初我们绑定 mousemove 在待拖动的 element 中，结果在移动中如果速度过快，会导致 mousemove 离开 element，于是我们把 mousemove 改绑到 document 中。
这样的效果其实仍然有些卡，或者说移动的延迟，尽管最终会到达鼠标所在的位置，高速移动时却不时刻在鼠标下面。之后我们用捕获来代替默认 addEventListener 的冒泡阶段触发：
之后，如果需要在移动时取消所有鼠标的响应时间，可以通过调整 pointer-events 样式来修改，在变更拖动状态时修改 body 的 style 即可。
记一个年久失修的 Chrome Alarms Bug
在 Chrome 插件的开发中，我们遇到了需要定时提醒的功能，Chrome 官方推荐的 Alarms + 事件页面的做法，之前我也发过：Chrome 插件开发：Alarms 定时与事件页面，起到了计划任务的效果，但是后来我们发现了一个奇怪的问题：计划任务有时执行，有时不执行，有时会延迟执行，而且延迟可以多达几个小时。
这个 bug 很奇怪，最初收到反馈是最近一个星期，我以为是最新更新了什么代码，结果看了一下 Git Log 并没有改动这一段代码，也没有增加其他 Chrome 提供的 API 的调用，理论上是不受影响的。