vdom就是用JS模拟DOM结构,DOM变化的对比放在JS层来坐,提高重绘性能
首先先来看下DOM节点body的属性,下图可以看出属性非常大,所以DOM的操作是“昂贵”的,js的运行效率高,将dom的对比放在js层提高效率,我们要尽量减少DOM的操作,项目越复杂,DOM操作影响越严重
如何用JS模拟DOM结构,如下
<ul id='test'>
<li class='item'>111</li>
</ul>
//js模拟
{
tag:'ul',
attrs: {
id: 'test'
}
children: [
{
tag: 'li',
attrs: {
//为什么用className来表达class,因为class是js保留字,不可以使用
className: 'item'
},
children: [
'111'
]
}
]
}
vdom的库有s