浏览器渲染流程

渲染的过程分为8个阶段
当浏览器接收到一个html 文档 会产生一个渲染任务
将其传递给渲染主线程的消息队列中
事件循环的作用下
渲染主线程取出消息队列中的渲染任务 开启渲染流程
开始解析
解析html成dom树和cssom树
样式计算
布局
分层
绘制 产生绘制指令 再将指令给到合成线程

合成线程 进行
分块
光栅化 优先去光栅化靠近视口的块
画
合成线程计算出每个位图在屏幕上的位置
交给GPU进程、GPU进程给到GPU硬件进行最终的页面显现

通过GPU进程通过GPU 硬件
显示到
到页面上

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • 浏览器的渲染流程--重排、重绘、合成
    HTML、CSS、JavaScript 数据，经过浏览器中间渲染模块的处理，再加上重排、重绘、合成的一个个环节，才...
    天問_专注于大前端技术阅读 4,933评论 0赞 9
  • 浏览器渲染流程解析
    前言 大家可能经常会听到 css 动画比 js动画性能更好这样的论断，或者是“硬件加速”，“层提升” 这样的字眼；...
    dqqbl阅读 4,910评论 1赞 1
  • 浏览器渲染流程
    HTML的内容由标记和文本组成、也称标签 CSS又称 层叠样式表、由选择器和属性组成 JS 使页面内容动起来 渲染...
    牛牛_735d阅读 1,098评论 0赞 0
  • 浏览器渲染流程
    渲染流程： 构建 DOM 树、样式计算、布局阶段、分层、绘制、光栅化 和 合成。 构建 DOM 树 这是因为浏览...
    _1633_阅读 3,258评论 0赞 1
  • 浏览器的渲染流程
    HTML、CSS和JavaScript，是如何变成页面的？ 渲染过程：构建 DOM 树、样式计算、布局阶段、分层、...
    QGMZTNLSLB阅读 1,937评论 0赞 0