为什么react这么快呢 

  因为react用了虚拟DOM;

  但是每次虚拟DOM转真实DOM不也是很浪费性能吗

  nice,所以关键点在Diff算法这里,去对比新旧DOM树,而后通过补丁去更新到真实DOM上

  这个比对不是也很浪费时间吗

  正常情况下,比较两个树形结构差异的算法的时间复杂度是O(N^3),这个效率显然是无法接受的。

  react通过总结DOM的实际使用场景提出了两个在绝大多数实践场景下都成立的假设,基于这两个假设,React实现了在O(N)时间复杂度内完成两棵虚拟DOM树的比较。

  两个假设是:

    (1)如果两个元素的类型不同,那么它们将生成两棵不同的树;

    (2)为列表中的元素设置key属性,用key标识对应的元素在多次;

  面对性能优化我们能做什么呢

    1、使用生产环境版本的库;

     2、避免不必要的组件渲染;

     3、使用key;  

  

  

react diff 极简版的更多相关文章

  1. Underscore源码阅读极简版入门

    看了网上的一些资料,发现大家都写得太复杂,让新手难以入门.于是写了这个极简版的Underscore源码阅读. 源码: https://github.com/hanzichi/underscore-an ...

  2. js消除小游戏(极简版)

    js小游戏极简版 (1) 基础布局 <div class = "box"> <p></p> <div class="div&qu ...

  3. SimpleThreadPool极简版

    package com.dwz.concurrency.chapter13; import java.util.ArrayList; import java.util.LinkedList; impo ...

  4. 极简版 react+webpack 脚手架

    目录结构 asset/ css/ img/ src/ entry.js ------------------------ 入口文件 .babelrc index.html package.json w ...

  5. Vue Virtual Dom 和 Diff原理(面试必备) 极简版

    我又来了,这是Vue面试三板斧的最后一招,当然也是极其简单了,先说Virtual Dom,来一句概念: 用js来模拟DOM中的节点.传说中的虚拟DOM. 再来一张图: 是不是一下子秒懂  没懂再来一张 ...

  6. 极简版ASP.NET Core学习路径及教程

    绝承认这是一个七天速成教程,即使有这个效果,我也不愿意接受这个名字.嗯. 这个路径分为两块: 实践入门 理论延伸 有了ASP.NET以及C#的知识以及项目经验,我们几乎可以不再需要了解任何新的知识就开 ...

  7. 【极简版】SpringBoot+SpringData JPA 管理系统

    前言 只有光头才能变强. 文本已收录至我的GitHub仓库,欢迎Star:https://github.com/ZhongFuCheng3y/3y 在上一篇中已经讲解了如何从零搭建一个SpringBo ...

  8. react实现极简搜索框效果

    hover.css内容 * { margin:; padding:; } li.hover { background: #ccc; color: darkgreen; } js内容 import Re ...

  9. 【极简版】OpenGL 超级宝典(第五版)环境配置 VS2010

    事先声明:该教程仅适用于VS2010环境下超级宝典第五版的配置 第一步:下载示例代码和环境包: 链接:https://pan.baidu.com/s/1llRRQ8ymBgMGuXp5M50pJw 提 ...

随机推荐

  1. windows 远程登录

    在我的电脑  属性当中开启远程登录功能 然后制作账号,这里对于账号的命名是有要求的,具体网上查找说是要用户名和全名一样,我没有做测试,不过新创建了一个用户用来登录,总是告知我密码错误,导致登录失败,所 ...

  2. jQuery实现全选与全部选

    为了便于用户理解,直接粘贴下面的代码即可 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  3. 沉默的QQ

    QQ很久没有叮咚了,一是没人发消息给我,二是我关了QQ的声音.现在除了几个还在接收消息的群外,其他的群都屏蔽了,有事才上去看看.我从来就没写过QQ空间,那些以前经常写空间的朋友也多数停止了喧闹.每次登 ...

  4. 过滤器 一 Filter

    import javax.servlet.Filter; 前言 过滤器是一个程序,依赖与servlet容器,它先于与之相关的servlet或JSP页面运行在服务器上.过滤器可附加到一个或多个servl ...

  5. NX二次开发-UFUN输入表达式名称,获取它的名称和值UF_MODL_ask_exp

    NX9+VS2012 #include <uf.h> #include <uf_modl.h> UF_initialize(); //创建一个新的表达式,有TAG tag_t ...

  6. 在jsp页面直接读取mysql数据库显示数据

    闲来无事,学学java,虽说编程语言相通,但是接触一门新知识还是有些疑惑,边学边记录,方便以后温故. 直接给出代码: <%@page import="java.sql.ResultSe ...

  7. 线性可分SVM中线性规划问题的化简

    在网上找了许多关于线性可分SVM化简的过程,但似乎都不是很详细,所以凭借自己的理解去详解了一下. 线性可分SVM的目标是求得一个超平面(其实就是求w和b),在其在对目标样本的划分正确的基础上,使得到该 ...

  8. Spring Boot 文件下载

    1. 文件下载类 import javax.servlet.http.HttpServletResponse; import java.io.*; public class DownloadUtil ...

  9. <Django>博客项目

    0.项目的通用流程 项目立项 需求分析 原型 前端 页面设计 UI及交互实现 后端 架构设计 数据库设计 代码模板实现 单元测试 网站整合 功能及集成测试 网站发布 1.BBS项目需求分析 需要哪些表 ...

  10. <面试题>学习面试

    1.代码中要修改不可变数据会出现什么问题? 抛出什么异常? 代码不会正常运行,抛出 TypeError 异常. # 比如修改元祖.会报错 TypeError: 'tuple' object does ...