关于性能优化

渲染引擎

渲染页面的大致流程:
(1)解析HTML标签并生成DOM
(2)解析CSS规则并生成CSSOM树
(3)将DOM树与CSSOM树合并成一个渲染树
(4)根据渲染树来进行布局
(5)对渲染树上的节点进行绘制
写代码时要注意:
(1)避免编写复杂DOM结构,减少DOM层级,从而可以加快DOM树构建
(层级越少越好)
(2)避免编写复杂的CSS样式,从而可以加快CSSOM的树构建
选择器从右到左的原则,右边减少使用通用选择器,加快浏览器匹配样式规则速度
(3)修改样式时候避免引起重新布局

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 发送 & 接收信息 数据是以“数据包”的形式通过互联网发送,而数据包以字节为单位。当你编写一些 HTML、CSS ...
    mongofeng阅读 1,091评论 0 0
  • 发送 & 接收信息 数据是以“数据包”的形式通过互联网发送,而数据包以字节为单位。当你编写一些 HTML、CSS ...
    IT界中小PQ阅读 430评论 0 0
  • 渲染流程 一个页面呈现通过浏览器呈现到出来,会经过以下步骤 解析页面内容 构建DOM树 构建CSSOM树 合并DO...
    如是然阅读 634评论 0 1
  • 写在前面 本文来自iOS Tutorial Team 的 Marcelo Fabri,他是Movile的一名 iO...
    seeek阅读 586评论 0 0
  • 在深夜不要做任何决定,在今天之前我并不觉得这是一句至理名言,但在今早上我认可了。 若没有昨晚深夜阅读后的精神刺激,...
    素与舒阅读 156评论 0 1

友情链接更多精彩内容