该笔记的内容主要来自本人在学习渡一课程的配套资料和个人总结而成
资源提示关键词在上一篇文章中，我们介绍了浏览器的渲染流程，这篇文章中，我们将重点聚焦在渲染阻塞上，来详细看一下渲染阻塞以及一些常见的解决方法。
本文主要包含以下内容：
渲染阻塞回顾
defer 和 async
preload
prefetch
prerender
preconnect
渲染阻塞回顾我们都知道，HTML 用于描述网页的整体结构。为了理解 HTML，浏览器必须将它转为自己能够理解的格式，也就是 DOM（文档对象模型）
浏览器引擎有一段特殊的代码，称为解析器，用于将数据从一种格式转换为另一种格式。
浏览器一点一点地构建 DOM。一旦第一块代码进来，它就会开始解析 HTML，将节点添加到树结构中。
构建出来的 DOM 对象，实际上有 2 个作用：
HTML 文档的结构以对象的方式体现出来，形成我们常说的 DOM 树
作为外界的接口供外界使用，例如 JavaScript（通过浏览器提供的 DOM API 来修改 DOM）。当我们调用诸如 document.getElementById 的方法时，返回 ...
该笔记的内容主要来自本人在学习渡一课程的配套资料和个人总结而成
浏览器的渲染流程本文主要包含以下内容：
浏览器渲染整体流程
解析 HTML
样式计算
布局
分层
生成绘制指令
分块
光栅化
绘制
常见面试题
浏览器渲染整体流程浏览器，作为用户浏览网页最基本的一个入口，我们似乎认为在地址栏输入 URL 后网页自动就出来了。殊不知在用户输入网页地址，敲下回车的那一刻，浏览器背后做了诸多的事情。
去除 DNS 查找等这些细枝末节的工作，整个大的部分可以分为两个，那就是网络和渲染。
首先，浏览器的网络线程会发送 http 请求，和服务器之间进行通信，之后将拿到的 html 封装成一个渲染任务，并将其传递给渲染主线程的消息队列。在事件循环机制的作用下，渲染主线程取出消息队列中的渲染任务，开启渲染流程。
网络线程和服务器之间通信的过程并非本节课咱们要讨论的，本节课咱们要研究的主要内容，是浏览器的渲染进程如何将一个密密麻麻的 html 字符串渲染成最终页面的。
我们先来看一下整体流程，整个渲染流程分为多个阶段，分别是： HTML 解析、样式计算、布局、分层、生成绘制指令、分块、光栅化、绘 ...
前端开发
未读该笔记的内容主要来自本人在学习渡一课程的配套资料和个人总结而成
vue 官方阐述：响应式原理
响应式数据的最终目标，是当对象本身或对象属性发生变化时，将会运行一些函数，最常见的就是 render 函数。
在具体实现上，vue 用到了几个核心部件：
Observer
Dep
Watcher
Scheduler
ObserverObserver 要实现的目标非常简单，就是把一个普通的对象转换为响应式的对象
为了实现这一点，Observer 把对象的每个属性通过Object.defineProperty转换为带有getter和setter的属性，这样一来，当访问或设置属性时，vue就有机会做一些别的事情。
Observer 是 vue 内部的构造器，我们可以通过 Vue 提供的静态方法Vue.observable( object )间接的使用该功能。
在组件生命周期中，这件事（data 配置返回的对象转换成响应式数据）发生在beforeCreate之后，created之前。
具体实现上，它会递归遍历对象的所有属性，以完成深度的属性转换。
由于遍历时只能遍历到对象的当前属性，因此 ...
该笔记的内容主要来自本人在学习渡一课程的配套资料和个人总结而成
HTTP1.0无法复用连接HTTP1.0 为每个请求单独新开一个 TCP 连接
sequenceDiagram
rect rgb(191,155,248)
客户端->服务器: TCP 三次握手，建立连接
end
rect rgb(196,223,252)
客户端->>服务器: 请求
服务器->>客户端: 响应
end
rect rgb(191,155,248)
客户端->服务器: TCP 四次挥手，销毁连接
end
rect rgb(191,155,248)
客户端->服务器: TCP 三次握手，建立连接
end
rect rgb(196,223,252)
客户端->>服务器: 请求
服务器->>客户端: 响应
end
rect rgb(191,155,248)
客户端->服务器: TCP 四次挥手，销毁连接
end
由于每个请求都是独立的连接，因此会带来下面的问题：
连接的建立和销毁都会占用服务器和客户端的资源，造成内存资源的浪费 ...
