zoukankan      html  css  js  c++  java
  • 浏览器渲染页面的流程(参考网上有关资料整理)

    浏览器渲染页面也就表示我们网上的资源已经请求成功

    首先我们要明确浏览器渲染页面大致分为这几个步骤

    1.浏览器解析html文档从而使构建成dom文档树=>2.构建render树=>3.布局render树=>4.绘制render树

    1.浏览器会将html文档解析成一个dom文档树,dom树构建的过程是一个深度遍历的过程,只有当当前节点的所有子节点都构建好了以后,才会去构建当前节点的下一个兄弟节点。Dom树的构建过程为:将字节转换成字符,确定tokens,将tokens转换成节点,然后构建dom树

    2.接下来再解析css样式,得到css规则树(cssom)

    3.根据得到的dom树和css来构建render树,渲染树不等于dom树,像header和display:none;这种没有具体内容的东西就不会出现再渲染树中

    4.根据render树,浏览器可以计算出网页中有哪些节点,以及各个节点的css从属关系,然后计算出每个节点再屏幕中国的位置

    5.遍历render树进行绘制页面中的各个元素

    (页面重拍(回流)的话,会重新加载dom树,影响页面加载速度)

    导致页面重拍的原因如下

    (1).页面初始化

    (2).操作dom时

    (3).某些元素发生改变时

    (4).css的属性发生改变时

    浏览器在解析html的过程中:它采用的是自上而下的解析方式,

    在页面中重绘和重排一般会在(1)增加或删除dom节点(2)display:none(重排并重绘)visibility:hidden(重排)(3)移动页面中的元素的时候(4)增加或者修改样式的时候(4)用户改变窗口大小,滚动页面的时候触发

    减少重绘和重排提高页面性能的方法

    就是将它所要替换的属性提前先写好,当触发某个事件的时候,只要改变他的classname即可

  • 相关阅读:
    Northwind数据库下载地址
    MSSQL跨服务访问数据库
    MSSQL基于一致性的I/O错误,解决方法之一
    DataGridView单元格ComboBox控件添加事件
    线程安全类 跨线程修改窗体UI
    数据库字段名
    SELECT INTO 和 INSERT INTO SELECT
    链表
    因为数据库正在使用,所以无法获得对数据库的独占访问权
    代替游标的循环
  • 原文地址:https://www.cnblogs.com/violinh/p/11728857.html
Copyright © 2011-2022 走看看