上一回我们说到用 Canvas 去渲染图像，但是在高分屏中，我们会发现，同样的大小，在高分屏上显示的并不清晰，这个 demo 表示的非常清楚：https://jsfiddle.net/csvwolf/3gvs44vw/
实际上我们在屏幕中看到的都是逻辑像素，但对于设备中元素的实际像素，是逻辑像素 * 设备像素比
，也可以叫做物理像素。
实际上在 Canvas 绘制时，也需要绘制实际像素，再进行画布的缩放。
在 demo 中已经有了方案，先绘制逻辑像素 * 设备像素比大小的画布，用 CSS 把样式大小调整，这样实际上是把 canvas 像素点压缩到指定尺寸，但是这样字会变小，我们还需要利用缩放放大设备像素比倍的尺寸，让尺寸恢复正常。
这样一个支持高分屏的渲染就做完了。
接下来我们考虑，如果我们支持完高分屏，图片像素的坐标要怎么选定：答案是要扩大像素比倍进行选择，因为画布的像素点总数没有变化。
很惭愧，一点微小的实践经验，时间有限，就说这么多。
最近有一个需求，大致是要根据图片的背景色来切换前景色，也就是根据 background-color 的色值切换 color。
虽然这么一说，那么就能抽象出以下几个问题：
如何根据 color 划分、如何改变前景的（如 icon、font）color。
Swagger 是一个完整的从设计到文档到 Mock 的 API 生态体系。
它会帮助你进行一定的设计，对于不符合的设计会报错，你需要掌握它的 yaml 文件书写规范，可以通过 OpenAPI Specification 稍作了解。
最初写文档可能会因为 yaml 语法不熟报一堆 error，习惯之后基本上也没啥问题，这样可以摒弃一些不规范的文档带来的沟通成本。
当然，今天就不介绍这一部分的信息了，在http://editor.swagger.io/#/会存在默认的示例。
昨天整了一天的 SSR，卒，总结一些经验教训仅供参考。
这就要说到天下合久必分，分久必合的道理了——最初的时候，静态页面就是静态页面，前后端 MVC，服务端渲染出页面；之后，前后端分离，后端提供 API，由客户端渲染页面；最后，我们又回到了最初的起点，不过是前后端分离后再由后端多渲染一次。
这样做的优点当然有很多啦，比如说我们要照顾爬虫（不），照顾蜘蛛，Vue 官方文档写的几点都已经很清楚了：
目前前后端对接其实主要是面向 API 文档开发，而 API 的设计中，有一种 RESTful API 的设计，具有规范，从某一种角度，我觉得 RESTful API 可以很好的把后端 API 从繁杂的业务中抽象出来，更好地进行管理和编写，同时也具有良好的可读性。
对于一些现代化的 MVC 框架，在脚手架阶段可能就会自动生成 RESTful 风格的 Controller。
路由中 URI 中的资源都是名词，即一个个实体，对于代码而言，可以看做一个个类到 URI 的映射，比如：
Chrome 插件本身也提供了计划任务，使用起来也非常简单，我们主要顺着思路来解释一下事件页面的概念。
在使用之前，我们需要清楚，alarms 的 create 只包含了定时器名和一些定时器需要的相关信息，而具体执行什么，则是由 onAlarm 监听决定的，由 alarm 参数的信息来决定执行内容：
Chrome 的 Storage 有点类似于 HTML5 的 localStorage，最初我没有注意到这个 API 的时候也是用 localStorage 存储的，但是它可以通过 storage.sync 使用浏览器自带的自动同步，在禁用 localStorage 的隐身模式，storage.sync 也能够正常的使用，此外它是异步操作，因此比阻塞和串行化的 localStorage 更快，用户的数据也能够存储为 String 以外的类型。
当然由于历史原因（需要将过去的配置进行兼容迁移），我这里还是没有直接存储对象，而是处理成字符串存储。（因为在 localStorage 中存储的就是这样，挨个处理太麻烦了 /w\）
Vue2.x 中父子组件中 props 的属性不能在子组件中改变其值然后传出至父组件了，但是有的时候也会存在一些麻烦，比如我们想要实现一些自定义组件，总是会有值的传入传出改变的，比如我希望做一个 popup，那么肯定需要根据父节点的状态来确定子节点。
尽管官方推荐双向数据流，但还是有一些方法避免报错，实现或 hack 双向数据流：
最简单的当然是通过状态管理来管理我们的变量，但对于数据流不复杂的父子节点交互而言，未免太过浪费，因此通常我们不会特别的去考虑它，尤其是 popup / checkbox 这种基础组件的时候。
Object 的值是其内存地址，只改变 Object 内部的值不改变地址将不会出现报错。
今天有一个需求，需要给原来的列表加自定义拖拽排序，之前做过一个原生的 demo，还发了一篇：HTML5 Drag & Drop 入门。
不过我们也没必要重复造轮子，在 Vue 下面有个 Vue.Draggable 可供我们直接使用。
做项目的时候遇到过需要将静态资源长期缓存的情况，因为在我们的需求里，最初一个静态资源上传完毕，针对此链接一次发布终生受益——于是乎，是时候研究一波缓存策略了：
我们都知道缓存状态码：304 Not Modified. 然而实际上，命中缓存也不一定是 304 的。
我们这里先要说明 HTTP Response 头中的 cache-control 的几种不同类型或者说关键词：no-cache / no-store / public / private / max-age。