zoukankan      html  css  js  c++  java
  • vue虚拟dom和diff算法学习笔记

    什么是虚拟dom

    用一个对象来描述dom结构,这个对象就是虚拟dom。

    为什么要用虚拟dom

    因为操作dom 需要耗费性能。计算出Virtual DOM中真正变化的部分,并只针对该部分进行原生DOM操作,而非重新渲染整个页面可以减少dom操作,提高性能。 怎么比对?

    • 如果type、key不一样:->直接replaceChild新节点替换掉老节点。
    • type、key一样,都是文本类型:->直接修改textContent。
    • type、key一样,都是节点类型:->比对props,根据新节点的属性更新老节点的属性 。

    对比children

    • 老节点有,新节点没有->删除老节点的innerHtml;
    • 老节点没有,新节点有->给新节点的添加子节点;
    • 老节点有,新节点有->updataChildren(标记新老节点的开始和结束指针,分5种情况:新头节点-老头结点比、 新尾结点-老尾结点比、 新头结点-老尾结点比、 新尾结点-老头结点比,暴力对比(根据map结构,看老节点中是否有某个子节点,有的话,移动,没有的话添加。)
  • 相关阅读:
    qq
    构造方法
    Java模块化开发
    q
    qqq
    qq
    qqq
    Git服务器搭建及SSH无密码登录设置
    php面向对象中的魔术方法中文说明
    计算机中丢失 msvcr110.dll 怎么办
  • 原文地址:https://www.cnblogs.com/superlizhao/p/12635479.html
Copyright © 2011-2022 走看看