Document Object Model(DOM,文档对象模型)是W3C(World Wide Web Consortium,万维网联盟)的标准,定义了访问HTML和XML文档的标准方法:W3C文档对象模型(DOM)是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。简单来说,就是用于连接document和JavaScript的桥梁。
每个页面都有一个DOM树,用于对页面的表达。真实场景中用户的很多操作会导致浏览器的重排(引起DOM树重新计算的行为)。一般的写法都是手动操作DOM,获取页面真实的DOM节点,然后修改数据。在复杂场景或需要频繁操作DOM的应用中,这样的写法非常消耗性能。当然也有许多方式可以避免页面重排,比如把某部分节点position设置为absolute/fixed定位,让其脱离文档流;或者在内存中处理DOM节点,完成之后推进文档等。这些方法维护成本昂贵,代码难以维护。
React为了摆脱操作真实DOM的噩梦,开创性地把DOM树转换为JavaScript对象树,这就是虚拟DOM(Virtual DOM)。
简单理解,虚拟DOM就是利用JS去构建真实DOM树,用于在浏览器中展示。
资料来源:带你读《React+Redux前端开发实战》之一: React入门,文章链接:https://developer.aliyun.com/article/727343
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。