我们经常谈论 http2 与 http1.1，却经常忽视一些细节的区别。最近谈到 keep-alive 与 http2 链路复用的区别。虽然我知道 http2 的多路复用技术是源自通信工程里的时分复用，但对 keep-alive 的复用却有些模糊。下面看来这些技术之间的进化。

react 异步渲染的最新进展

一年多来，react 团队在实现异步渲染上做了许多工作。上个月的冰岛 JSConf 演讲上，Dan 揭晓了一些令人兴奋的解锁异步渲染的可能性。现在我们想与您分享一些我们研究这些功能时的一些经验，以及帮助你准备用于异步渲染的组件的一些秘诀。

我们了解到的最大的教训就是我们传统的一些组件生命周期倾向于鼓励不安全的实践。它们是：

• componentWillMount
• componentWillReceiveProps
• componentWillUpdate

这些生命周期经常被误解或不知不觉地误用。此外，我们预料到这些潜在的滥用可能会给异步渲染造成更多问题。因此，我们将会在接下来的版本给这些生命周期添加 “UNSAFE_” 前缀。（这里，“unsafe” 指的不是安全，而是想传达在这些生命周期里编程可能会在未来的 react 版本引起 bug，尤其是异步渲染开启的情况下。）

优化关键渲染路径

网页优化涉及到浏览器输入网址后的每一步，这里取关注相对少的浏览器渲染这一步来看看。

浏览器渲染页面有以下五个步骤：

1. 处理 HTML 标记并构建 DOM 树。
2. 处理 CSS 标记并构建 CSSOM 树。
3. 将 DOM 与 CSSOM 合并成一个渲染树。
4. 根据渲染树来布局，以计算每个节点的几何信息。
5. 将各个节点绘制到屏幕上。

优化关键渲染路径 就是指最大限度缩短执行上述第 1 步至第 5 步耗费的总时间.

优化关键渲染路径不仅对首屏呈现有重大意义，对于渲染页面帧率，流畅用户体验很关键。

By Ilya Grigorik

构建 DOM 对象模型和 CSSDOM 对象模型

浏览器渲染页面前需要先构建 DOM 和 CSSOM 树。因此，我们需要确保尽快将 HTML 和 CSS 都提供给浏览器。

TL;DR

• 字节 → 字符 → 令牌 → 节点 → 对象模型。
• HTML 标记转换成文档对象模型 (DOM)；CSS 标记转换成 CSS 对象模型 (CSSOM)。
• DOM 和 CSSOM 是独立的数据结构。
• Chrome DevTools Timeline 让我们可以捕获和检查 DOM 和 CSSOM 的构建和处理开销。

React’s ⚛️ new Context API

这是一种更人性化的方式，不再是“实验性功能”，并且现在它是一级API。并且使用了 render prop!

javascript 判断正负0

ES 2015/ ES 6 新增了一个方法用于 javascript 相等性判断 – Object.is()。它与之前的相等比较运算符有什么不同呢？

通过微信小游戏跳一跳，看加密算法的选择

近期微信更新，有跳一跳的游戏，并被网友找出源码并刷分，我也试了一下，成功刷了 1024。其中看到这个游戏使用了常用加密库 crypto-js（不支持RSA），它可以在浏览器端使用。而 nodejs 也有 crypto 模块，而且支持的加密算法更多。下面就来看看加密算法有哪些，并如何根据场景选择算法。

让 css 像编程语言一样实现计数，IE 8 也支持的 css 计数器

css counters 是一个我们可以利用特定属性增减计算的变量。通过它，我们可以做一些类似编程语言的通用的迭代。

这个方式可以用于一些创造性的解决方案，包括一些重复代码的计数器。

简洁代码与冗余代码

这篇文章将重点介绍适用于现代 react 软件开发的简洁代码之道。我还会谈谈 ES6/ES2015 带来的一些“语法糖”。

Dynamic import() 有哪些特点

Dynamic import() 已被 Chrome 63 和 Safari Technology Preview 24 支持。

Dynamic import() 采用 类函数 的方法来塑造 import，相比 static import 解锁了新功能。这篇文章对比了两者并概览新功能。