关于WEB性能的思考
有关WEB性能的思考，不涉及方法论。
之所以萌生出写这篇文章的想法，主要是最近看的一些参考资料，让我联想到了web性能。可能会好奇，我最近究竟看的是什么呀？啊哈，是有关虚拟DOM以及DOM操作为什么慢的问题。
一开始好奇虚拟DOM技术，看看了实现的算法，后来发现，虚拟DOM是为了解决DOM慢的问题，于是开始重点关注DOM为什么慢，然后就发现这其实是WEB性能问题。
不过，DOM为什么慢和DOM性能这两个问题也不是完全重合，因为这里所说的DOM慢，是属于WEB性能问题的一部分。还是先说一下DOM慢在何处吧。
DOM慢，主要来源两方面：DOM操作本身慢，DOM操作的影响导致页面响应慢。
DOM操作本身慢，主要涉及DOM操作的时间复杂度。
DOM操作的影响，是指网页渲染。DOM操作会导致布局，绘制，图层合并等浏览器行为，而这些行为统称为渲染，需要注意的是，渲染是WEB的性能瓶颈。
WEB性能问题中，一般分为两个主要问题：首屏加载性能和交互性能（渲染性能）。
从上面可以看出DOM慢直指WEB渲染性能差。WEB渲染性能主要发生于重排和强制同步布局（重复读写DOM操作等），那么解决问题的方法之一是减少重排的可能性，尽量一次性操作，或者集中批量操作读或者写操作。针对这个问题的解决方案有fastDOM，另外一种就是上面提到的虚拟DOM技术。
【关于WEB性能的思考】这里还想说一下虚拟DOM技术，上面提到虚拟DOM主要是为了解决DOM慢而提出的，通过集中处理DOM树中的改变，从而提高DOM渲染的效率。虚拟DOM是利用原生JS对象表示（代理）原始DOM树的信息和结构，当用户操作或浏览器行为需要页面状态发生改变时，那就根据状态的改变重构这个原生JS对象，然后对比新的对象树和旧的对象树，得到两树的差异，最后只针对变化的地方修改原始DOM树，重新渲染视图。这样一来，就可以集中处理DOM树的操作，较少渲染次数，提高渲染效率。因为针对原始DOM树的操作都可以在JS对象树中执行，而原生JS对象的操作快很多，算法实现也更容易，所以虚拟DOM技术很火。如果你使用过React或者Vue，肯定了解过这两个前端框架均采用了virtual DOM。此外，virtual DOM的核心算法是diff算法，即比较两棵DOM树的差异。
推荐阅读
- 关于QueryWrapper|关于QueryWrapper,实现MybatisPlus多表关联查询方式
- 四首关于旅行记忆的外文歌曲
- 醒不来的梦
- 关于自我为中心的一点感想
- 私有化轻量级持续集成部署方案--03-部署web服务（下）
- 「按键精灵安卓版」关于全分辨率脚本的一些理解（非游戏app）
- 关于Ruby的杂想
- 关于读书的思考
- 关于this的一些问题（1）
- 《声之形》