1.回流:
当render tree中的一部分(或全部)因为元素的规模尺寸,布局,隐藏等改变而需要重新构建。这就称为回流(reflow)。每个页面至少需要一次回流,就是在页面第一次加载的时候,这时候是  一定会发生回流的,因为要构建render tree。
2.重绘:
在回流的时候,浏览器会使渲染树中受到影响的部分失效,并重新构造这部分渲染树,完成回流后,浏览器会重新绘制受影响的部分到屏幕中,该过程成为重绘。
区别:
  回流必将引起重绘,而重绘不一定会引起回流。比如:只有颜色改变的时候就只会发生重绘而不会引起回流
  当页面布局和几何属性改变时就需要回流 。比如:添加或者删除可见的DOM元素,元素位置改变,元素尺寸改变——边距、填充、边框、宽度和高度,内容改变

转载于:https://www.cnblogs.com/Alice-67/p/10896036.html

回流,重绘的概念,以及他们的区别?相关推荐

  1. css3动画会造成回流重绘吗,重绘和回流以及如何优化

    1.浏览器渲染机制 浏览器采用流式布局模型(Flow Based Layout) 浏览器会把HTML解析成DOM,把CSS解析成CSSOM,DOM和CSSOM合并就产生了渲染树(Render Tree ...

  2. 回流(reflow)和重绘(repaint)

    回流(reflow)与重绘(repaint) 一.概念 首先我们要明白的是,页面的显示过程分为以下几个阶段: 生成DOM树(包括display:none的节点) 在DOM树的基础上根据节点的集合属性( ...

  3. 深入浅出:了解前端回流跟重绘

    1. 浏览器把获取到的HTML代码解析成1个DOM树,HTML中的每个tag都是DOM树中的1个节点,根节点就是我们常用的document对象.DOM树里包含了所有HTML标签,包括display:n ...

  4. 浏览器的回流与重绘 (Reflow Repaint)

    参考<极客学院--浏览器工作原理与实践> 渲染流程大致可总结为如下: 1. 渲染进程将 HTML 内容转换为能够读懂的 DOM 树结构. 2. 渲染进程将 CSS 样式表转化为浏览器可以理 ...

  5. 介绍下重绘和回流(Repaint Reflow),以及如何进行优化

    1. 浏览器渲染机制 浏览器采用流式布局模型(Flow Based Layout) 浏览器会把HTML解析成DOM,把CSS解析成CSSOM,DOM和CSSOM合并就产生了渲染树(Render Tre ...

  6. 重绘和回流----降低回流减少性能影响

    回流和重绘 原创 2016年02月29日 14:49:02 标签: 布局 / dom 640 回流与重绘 1. 当render tree中的一部分(或全部)因为元素的规模尺寸,布局,隐藏等改变而需要重 ...

  7. 提高网站的性能----回流与重绘

    2019独角兽企业重金招聘Python工程师标准>>> 以前在写网页的时候很少关注到网站的性能,时间进入今天,一个网站不在是单纯几张图片或者几段文字,组成一个网站,今天的用户更加注重 ...

  8. 【转】高性能WEB开发系列之重绘与回流

    原文转载:http://www.cnblogs.com/wangzhichao/archive/2011/05/16/2047633.html 页面呈现流程 在讨论页面重绘.回流之前.需要对页面的呈现 ...

  9. 读书笔记 --- 再次阅读回流与重绘

    参考 - 强烈推荐看看,这个作者写了很多特别好的文章. 浏览器渲染过程 解析HTML,生成DOM树; 解析CSS生成CSSOM树 将DOM树和CSSOM树合并,生成渲染(Render)树 Layout ...

最新文章

  1. .NET多线程编程入门
  2. [译]GC专家系列2:Java 垃圾回收的监控
  3. 并发数据结构 : SpinWait
  4. org.apache.maven.archiver.MavenArchiver.getManifest错误
  5. list ilist java_C#中IList与List区别
  6. win7建立服务器文件夹权限,win7 ftp服务器 文件夹权限
  7. 使用apache+mod_wsgi方式部署完成后,访问网站时400(Bad Request)
  8. 智能算法浅介----模拟退火,遗传算法,禁忌搜索,神经网络等
  9. Dart基础第10篇:类 静态成员 操作符 类的继承
  10. matlab图例显示均值方差,MATLAB中均值、方差、均方差的计算方法
  11. 保研面试/考研复试英语口语常见问题整理
  12. Protect the self: defense mechanisms in action
  13. 微信小程序个人中心页面开发
  14. 大数据来临,商业银行面对合规挑战!
  15. 深度学习推荐系统_深度推荐系统
  16. postgis基本用法
  17. 一个网站从0到1搭建部署上线的完整流程(包教包会)
  18. ReSpeaker 4-Mic 声源定位
  19. Oracle数据库安装容易出错问题的解决方案
  20. ubuntu文件比较工具Meld

热门文章

  1. Eclipse Modeling Framework, 2nd Edition. (EMF)学习笔记(一)——EMF介绍
  2. Problem 77:Prime summations
  3. python 之 append extend
  4. 在Apache Tomcat 7设置redis作为session store
  5. 思科网络技术学院CCNA教程
  6. GRIDVIEW控件删除数据前如何给予客户端提示
  7. Oracle SQL 内置函数大全
  8. 雪鹰领主服务器维护,《雪鹰领主》7月14日维护更新公告
  9. 【转】计算机学会推荐国际学术期刊
  10. HtmlUnit动态执行js函数