美文网首页
前端学习-浏览器在网页展示过程中负责干什么

前端学习-浏览器在网页展示过程中负责干什么

作者: 熊妹妹 | 来源:发表于2016-09-27 10:30 被阅读19次
WebKit 主流程
  1. 用户输入URL,浏览器向web服务器发送一个http请求,接受文档内容(HTML、CSS、JS、Images等等)。
  2. 渲染引擎开始解析 HTML 文档,并将各标记逐个转化成DOM Tree上的节点
  • 由 DOM 元素和属性节点构成的树结构。DOM 是文档对象模型 (Document Object Model) 的缩写,是 HTML 文档的对象表示,同时也是外部内容(例如 JavaScript)与 HTML 元素之间的接口。 解析树的根节点是Document对象。
  • 解析 HTML由两个阶段组成:标记化和树构建
  1. 解析CSS生成CSS Rule Tree
  2. 解析完成后,浏览器引擎会通过DOM Tree 和 CSS Rule Tree 来构造 Rendering Tree
  • 由可视化元素按照其显示顺序而组成的树,也是文档的可视化表示。它的作用是让您按照正确的顺序绘制内容。
  • Rendering Tree和 DOM 元素相对应的,但并非一一对应
  1. 进入布局处理,为每个节点分配一个应出现在屏幕上的确切坐标。
  2. 下一步是绘制。系统会遍历Rendering Tree,并调用Rendering器的“paint”方法,将内容显示在屏幕上。绘制工作是使用用户界面基础组件完成的。
  • 这是一个渐进的过程。为达到更好的用户体验,render力求尽快将内容显示在屏幕上。它不必等到整个 HTML 文档解析完毕之后,就会开始构建render tree和layout。在不断接收和处理来自网络的其余内容的同时,render tree会将部分内容解析并显示出来。

相关文章

  • 前端学习-浏览器在网页展示过程中负责干什么

    用户输入URL,浏览器向web服务器发送一个http请求,接受文档内容(HTML、CSS、JS、Images等等)...

  • 什么是前端?

    一、Web前端介绍 1. 什么是网页 网页是基于浏览器的应用程序,是数据展示的载体. 2. 网页的组成 浏览器...

  • postman-接口调试技巧(一)

    一.接口规则 我们在开发APP或者web网页过程中一般有前端,后台两类程序员; 后台负责业务逻辑,前端负责UI和展...

  • Java前端技术学习路线图(黑马程序员自学就业班)

    浏览器展示给用户看到的网页就是前端,前端三大基础技术分别为Html、CSS、JavaScript,这些学完后,为了...

  • iOS WebView设置UserAgent

    在和前端交互过程中,为了区分是我们APP内加载网页还是其他应用或浏览器加载的网页,我们需要使用在UserAgent...

  • vue本地开发mock数据.md

    [TOC] 一、为什么要mock数据? VUE项目开发过程中,前后端是完全分离,后端负责提供数据,前端负责数据展示...

  • JavaScript入门

    html:负责网页结构css: 负责网页美观javascript:负责用户与浏览器交互。javacript的来由1...

  • 网页渲染机制

    网页通过浏览器展示在我们面前,说网页的渲染机制就是说浏览器怎么渲染页面的。市面上浏览器主流浏览器chrome,fi...

  • 前端之路-学习笔记(一)

    前端必须掌握的三个技能 HTML-负责网页的结构语义化。 CSS-负责网页的样式美化。 JS-负责网页的动态效果。...

  • 前端发展个人梳理

      前端的本质就是展示数据给用户,最原始的前端工作就是从服务器获取html文档,然后渲染展示在浏览器上面。随着互联...

网友评论

      本文标题:前端学习-浏览器在网页展示过程中负责干什么

      本文链接:https://www.haomeiwen.com/subject/nejcyttx.html