为什么使用react
1、React虚拟DOM是什么
2、虚拟DOM简单实现
3、虚拟DOM内部工作原理
HTML element, Element, GlobalEventHandler. 继承了很多属性: width, height, offsetHeight, style, title
方法:onfocus, onclick.
element挂载: 默认styles, computed属性,EventListener,DOM Breakpoints, 大量properties.
js操作DOM过程,dom本身繁重,js操作也需要浪费时间,如果js操作DOM的方式不合理,那么更糟糕,所以出现了使用React操作虚拟DOM。虽然解决不了DOM自身繁重,但是虚拟DOM可以对Javascript操作DOM这一部分内容进行优化。
fux,redux (data flow): store->view->action->store
虚拟DOM跟DOM区别: 虚拟DOM每个element实际上只是几个重要且常用的属性。
react: 根据数据生成一个全新虚拟DOM,然后根据原来的DOM去对比,得到Patch,然后把这个patch打到浏览器DOM。这个patch是新虚拟DOM跟原虚拟DOM对比后差异化部分。
生成virtual dom(需耗费时间), 跑diff(需耗费时间),根据patch简化了那些DOM操作节省时间依然可观。(时间差>virtual dom生成时间+diff时间)。总体来说很快。