《响应式Web设计性能优化》笔记

Web性能定义:一个终端用户从请求一段内容开始到这段内容显示在用户设备上这段时间的度量值。

运行时性能:应用在运行时对用户输入响应式能力的一个表示。

浏览器请求一个页面的过程:

  1. 通过浏览器请求一个web页面,浏览器创建一个线程去执行该请求
  2. 发送请求,开始远程DNS查找,远程DNS将输入的URL对应的IP地址返回给浏览器
  3. 浏览器与远程web服务器通过三次握手建立一个tcp/ip连接
  4. tcp/ip连接建立后,浏览器通过连接发送一个HTTP Get请求到Web服务端。
  5. web服务器找到请求的资源,在HTTP响应中将其返回并返回相对应的状态码。(加载一个HTML不只需要一次这个过程,浏览器还要为页面链接的资源发起一个HTTP请求,包括图片、链接的css和js,但只要HTTP请求的源是形同的,浏览器可以重用响相应的tcp连接)

常用状态码:200表示服务端成功响应、301表示永久重定向、302表示临时重定向、403表示请求被拒绝、404表示请求资源不存在、500表示服务端处理请求出错、503表示服务不可用、504表示网关超时

6.浏览器接收HTML页面后开始渲染页面。

现代浏览器的架构:

  1. UI层:为浏览器绘制界面
  2. 网络层:处理网络连接,建立TCP/IP连接及HTTP请求,处理下载内容并将内容传递给渲染引擎。
  3. 渲染引擎:负责将内容绘制到浏览器上,如WebKit
  4. JavaScript引擎:负责解析并执行JavaScript,如V8

浏览器内部模型执行过程:

  • 用户在浏览器地址栏输入URL,UI层将URL请求传递给网络层
  • 网络层建立连接下载页面
  • 含有HTML块的数据包到达,传送给渲染引擎,渲染引擎对HTML字符进行解析转换成DOM,然后和CSSOM成渲染树,构建DOM节点,布局DOM元素的位置,描述DOM元素
  • 渲染引擎在遇到

你可能感兴趣的:(《响应式Web设计性能优化》笔记)