基于虚拟DOM的Web前端性能优化研究

• 作者: 戴志诚 程劲草
• 来源期刊: 计算机应用与软件
• 学科: 工学
• 关键词: Web前端性能优化 虚拟DOM Diff算法 ReactJS
• 年，卷（期）: 2017,（12）
• 所属期刊栏目: 软件技术与研究
• 页码范围: 21-25,31
• 页数: 6页
• 分类号: TP302.7
• 字数: 3802字
• 语种: 中文
• DOI: 10.3969/j.issn.1000-386x.2017.12.004

摘要

随着Web前端的不断发展,Web页面变得越来越复杂,强交互性带来页面状态的疯涨,用于更新页面的DOM操作也越来越多.然而频繁的DOM操作使得页面渲染缓慢,造成前端性能瓶颈.在分析造成此问题原因的基础上,介绍一种由虚拟DOM和Diff算法来优化DOM操作的方法.通过分析传统Tree-Diff与DOM-Diff算法,对现有Diff算法做出改进.最后搭建测试平台,对改进后算法(Virtual-DOM)、ReactJS以及原生JS进行渲染性能测试,并对测试结果进行对比分析.测试结果表明:虚拟DOM确实可以优化浏览器的渲染性能,且在特定的情况下,DOM-Diff改进算法效果比ReactJS更理想.

作者信息

序号	姓名	单位	发文数	被引次数	H指数	G指数
1	戴志诚	华中师范大学国家数字化学习工程技术研究中心	4	32	3.0	4.0
2	程劲草	华中师范大学国家数字化学习工程技术研究中心	1	21	1.0	1.0