课程简介：

本课程共分为 7 大模块。

1. 宏观视角下的浏览器

本模块通过 Chrome 的多进程架构来介绍 HTTP 请求流程、导航流程和页面的渲染流程，带你从宏观视角建立浏览器的知识体系。

2. 浏览器中的 JavaScript 执行机制

虽然语法上和 C 语言很像，但是 JavaScript 背后的机制却又完全不同，很多人学习 JavaScript 时经常处于似懂非懂的状态。本模块则是站在浏览器的视角，来分析 JavaScript 代码的执行过程。如果你能掌握这些执行过程，那么很多诸如闭包、变量提升等疑难问题就会迎刃而解。

3. V8 工作原理

继续深入探讨来自 Google 的 JavaScript 引擎 V8，分析其执行流程，细化讲解 JavaScript 中数据是如何存储和回收的。通过本模块的学习，你离打造高性能且节约内存的 Web 应用就更近一步了。

4. 浏览器中的页面事件循环系统

要让不同类型的任务在主线程中有条不紊地执行，这就需要有一个事件循环系统，用来负责接收、调度这些不同的事件。本模块会深入探讨 Web 页面中的事件循环系统，讲解页面中的微任务和宏任务的实现机制，最后还会介绍一些 WebAPI 是如何与页面的事件循环系统结合使用的。理解事件循环，能让你从更高维度理解页面是如何运行的，并加深你对页面中异步事件的理解。

5. 浏览器中的页面

页面是浏览器的核心，浏览器中的所有功能点都是服务于页面的。本模块会对页面做全面的介绍，包括构建页面的核心流程、页面性能的分析过程。最后还会介绍一些应用场景，比如流行的前端框架为什么要有虚拟 DOM，最近比较火的 PWA 的工作原理，以及 WebComponent。

6. 浏览器中的网络

网络的重要性毋庸置疑，但是很多前端工程师却往往忽视它的存在。本模块通过 HTTP/1、HTTP/2 和 HTTP/3 的介绍，让你全面了解浏览器中的网络，并最终让你能向下理解其底层原理、向上理解其应用方向。

7. 浏览器安全

和浏览器打交道的内容都是通过网络进行的，但通常通过网络传输的内容是不被浏览器信任的，所以对于可能存在危险的地方都要重点防护。本模块会通过实例，向你介绍为何会出现各种安全问题，以及如何避免这些安全攻击。

课程目录：

浏览器工作原理与实践/
├──01-开篇词 (1讲)
| ├──00开篇词丨参透了浏览器的工作原理，你就能解决80%的前端难题.html 3.31M
| ├──00开篇词丨参透了浏览器的工作原理，你就能解决80%的前端难题.mp3 6.27M
| ├──00开篇词丨参透了浏览器的工作原理，你就能解决80%的前端难题.mp4 122.19M
| └──00开篇词丨参透了浏览器的工作原理，你就能解决80%的前端难题.pdf 6.86M
├──02-宏观视角下的浏览器 (6讲)
| ├──01丨Chrome架构：仅仅打开了1个页面，为什么有4个进程？.html 3.62M
| ├──01丨Chrome架构：仅仅打开了1个页面，为什么有4个进程？.mp3 8.59M
| ├──01丨Chrome架构：仅仅打开了1个页面，为什么有4个进程？.pdf 3.49M
| ├──02丨TCP协议：如何保证页面文件能被完整送达浏览器？.html 2.61M
| ├──02丨TCP协议：如何保证页面文件能被完整送达浏览器？.mp3 5.63M
| ├──02丨TCP协议：如何保证页面文件能被完整送达浏览器？.pdf 2.26M
| ├──03丨HTTP请求流程：为什么很多站点第二次打开速度会很快？.html 4.65M
| ├──03丨HTTP请求流程：为什么很多站点第二次打开速度会很快？.mp3 7.52M
| ├──03丨HTTP请求流程：为什么很多站点第二次打开速度会很快？.pdf 4.18M
| ├──04丨导航流程：从输入URL到页面展示，这中间发生了什么？.html 5.61M
| ├──04丨导航流程：从输入URL到页面展示，这中间发生了什么？.mp3 6.74M
| ├──04丨导航流程：从输入URL到页面展示，这中间发生了什么？.pdf 5.32M
| ├──05丨渲染流程（上）：HTML、CSS和JavaScript，是如何变成页面的？.html 6.16M
| ├──05丨渲染流程（上）：HTML、CSS和JavaScript，是如何变成页面的？.mp3 5.88M
| ├──05丨渲染流程（上）：HTML、CSS和JavaScript，是如何变成页面的？.pdf 5.50M
| ├──06丨渲染流程（下）：HTML、CSS和JavaScript，是如何变成页面的？ .html 5.49M
| ├──06丨渲染流程（下）：HTML、CSS和JavaScript，是如何变成页面的？ .mp3 5.97M
| └──06丨渲染流程（下）：HTML、CSS和JavaScript，是如何变成页面的？ .pdf 4.88M
├──03-浏览器中的JavaScript执行机制 (5讲)-更多精彩课程请加AG1101201
| ├──07丨变量提升：JavaScript代码是按顺序执行的吗？.html 2.69M
| ├──07丨变量提升：JavaScript代码是按顺序执行的吗？.mp3 5.65M
| ├──07丨变量提升：JavaScript代码是按顺序执行的吗？.pdf 2.10M
| ├──08丨调用栈：为什么JavaScript代码会出现栈溢出？.html 4.83M
| ├──08丨调用栈：为什么JavaScript代码会出现栈溢出？.mp3 5.14M
| ├──08丨调用栈：为什么JavaScript代码会出现栈溢出？.pdf 4.50M
| ├──09丨块级作用域：var缺陷以及为什么要引入let和const？.html 3.32M
| ├──09丨块级作用域：var缺陷以及为什么要引入let和const？.mp3 6.63M
| ├──09丨块级作用域：var缺陷以及为什么要引入let和const？.pdf 2.69M
| ├──10丨作用域链和闭包：代码中出现相同的变量，JavaScript引擎是如何选择的？.html 4.59M
| ├──10丨作用域链和闭包：代码中出现相同的变量，JavaScript引擎是如何选择的？.mp3 5.87M
| ├──10丨作用域链和闭包：代码中出现相同的变量，JavaScript引擎是如何选择的？.pdf 3.77M
| ├──11丨this：从JavaScript执行上下文的视角讲清楚this.html 2.66M
| ├──11丨this：从JavaScript执行上下文的视角讲清楚this.mp3 5.60M
| └──11丨this：从JavaScript执行上下文的视角讲清楚this.pdf 2.23M
├──04-V8工作原理 (3讲)
| ├──12丨栈空间和堆空间：数据是如何存储的？.html 4.49M
| ├──12丨栈空间和堆空间：数据是如何存储的？.mp3 6.04M
| ├──12丨栈空间和堆空间：数据是如何存储的？.pdf 3.72M
| ├──13丨垃圾回收：垃圾数据是如何自动回收的？.html 4.24M
| ├──13丨垃圾回收：垃圾数据是如何自动回收的？.m4a 10.67M
| ├──13丨垃圾回收：垃圾数据是如何自动回收的？.pdf 2.76M
| ├──14丨编译器和解释器：V8是如何执行一段JavaScript代码的？.html 3.49M
| ├──14丨编译器和解释器：V8是如何执行一段JavaScript代码的？.m4a 9.31M
| └──14丨编译器和解释器：V8是如何执行一段JavaScript代码的？.pdf 2.95M
├──05-浏览器中的页面循环系统 (6讲)-更多精彩课程请加AG1101201
| ├──15丨消息队列和事件循环：页面是怎么“活”起来的？.html 3.95M
| ├──15丨消息队列和事件循环：页面是怎么“活”起来的？.m4a 9.38M
| ├──15丨消息队列和事件循环：页面是怎么“活”起来的？.pdf 3.03M
| ├──16丨WebAPI：setTimeout是如何实现的？.html 2.07M
| ├──16丨WebAPI：setTimeout是如何实现的？.m4a 8.22M
| ├──16丨WebAPI：setTimeout是如何实现的？.pdf 1.74M
| ├──17丨WebAPI：XMLHttpRequest是怎么实现的？.html 2.69M
| ├──17丨WebAPI：XMLHttpRequest是怎么实现的？.m4a 10.34M
| ├──17丨WebAPI：XMLHttpRequest是怎么实现的？.pdf 2.37M
| ├──18丨宏任务和微任务：不是所有任务都是一个待遇.html 2.05M
| ├──18丨宏任务和微任务：不是所有任务都是一个待遇.m4a 9.96M
| ├──18丨宏任务和微任务：不是所有任务都是一个待遇.pdf 1.71M
| ├──19丨Promise：使用Promise，告别回调函数.html 2.83M
| ├──19丨Promise：使用Promise，告别回调函数.m4a 9.66M
| ├──19丨Promise：使用Promise，告别回调函数.pdf 2.33M
| ├──20丨async-await：使用同步的方式去写异步代码.html 2.05M
| ├──20丨async-await：使用同步的方式去写异步代码.m4a 10.01M
| └──20丨async-await：使用同步的方式去写异步代码.pdf 1.75M
├──06-浏览器中的页面 (8讲)-更多精彩课程请加AG1101201
| ├──21丨Chrome开发者工具：利用网络面板做性能分析.html 3.93M
| ├──21丨Chrome开发者工具：利用网络面板做性能分析.m4a 9.39M
| ├──21丨Chrome开发者工具：利用网络面板做性能分析.pdf 3.13M
| ├──22丨DOM树：JavaScript是如何影响DOM树构建的？.html 3.43M
| ├──22丨DOM树：JavaScript是如何影响DOM树构建的？.m4a 9.45M
| ├──22丨DOM树：JavaScript是如何影响DOM树构建的？.pdf 2.70M
| ├──23丨渲染流水线：CSS如何影响首次加载时的白屏时间？.html 2.36M
| ├──23丨渲染流水线：CSS如何影响首次加载时的白屏时间？.m4a 7.18M
| ├──23丨渲染流水线：CSS如何影响首次加载时的白屏时间？.pdf 2.04M
| ├──24丨分层和合成机制：为什么CSS动画比JavaScript高效？.html 1.82M
| ├──24丨分层和合成机制：为什么CSS动画比JavaScript高效？.m4a 8.50M
| ├──24丨分层和合成机制：为什么CSS动画比JavaScript高效？.pdf 1.59M
| ├──25丨页面性能：如何系统地优化页面？.html 2.32M
| ├──25丨页面性能：如何系统地优化页面？.m4a 9.68M
| ├──25丨页面性能：如何系统地优化页面？.pdf 1.93M
| ├──26丨虚拟DOM：虚拟DOM和实际的DOM有何不同？.html 2.20M
| ├──26丨虚拟DOM：虚拟DOM和实际的DOM有何不同？.m4a 7.72M
| ├──26丨虚拟DOM：虚拟DOM和实际的DOM有何不同？.pdf 1.64M
| ├──27丨渐进式网页应用（PWA）：它究竟解决了Web应用的哪些问题？.html 1.10M
| ├──27丨渐进式网页应用（PWA）：它究竟解决了Web应用的哪些问题？.m4a 6.97M
| ├──27丨渐进式网页应用（PWA）：它究竟解决了Web应用的哪些问题？.pdf 1.03M
| ├──28丨WebComponent：像搭积木一样构建Web应用.html 1.65M
| ├──28丨WebComponent：像搭积木一样构建Web应用.m4a 7.41M
| └──28丨WebComponent：像搭积木一样构建Web应用.pdf 1.66M
├──07-浏览器中的网络 (3讲)-更多精彩课程请加AG1101201
| ├──29丨HTTP-1：HTTP性能优化.html 2.27M
| ├──29丨HTTP-1：HTTP性能优化.m4a 10.05M
| ├──29丨HTTP-1：HTTP性能优化.pdf 1.99M
| ├──30｜HTTP-2：如何提升网络速度？.html 2.24M
| ├──30｜HTTP-2：如何提升网络速度？.m4a 9.52M
| ├──30｜HTTP-2：如何提升网络速度？.pdf 2.26M
| ├──31｜HTTP-3：甩掉TCP、TLS的包袱，构建高效网络.html 1.73M
| ├──31｜HTTP-3：甩掉TCP、TLS的包袱，构建高效网络.m4a 8.37M
| └──31｜HTTP-3：甩掉TCP、TLS的包袱，构建高效网络.pdf 1.57M
├──08-浏览器安全 (5讲)-更多精彩课程请加AG1101201
| ├──32丨同源策略：为什么XMLHttpRequest不能跨域请求资源？.html 2.41M
| ├──32丨同源策略：为什么XMLHttpRequest不能跨域请求资源？.m4a 7.49M
| ├──32丨同源策略：为什么XMLHttpRequest不能跨域请求资源？.pdf 1.97M
| ├──33丨跨站脚本攻击（XSS）：为什么Cookie中有HttpOnly属性？.html 4.89M
| ├──33丨跨站脚本攻击（XSS）：为什么Cookie中有HttpOnly属性？.m4a 8.91M
| ├──33丨跨站脚本攻击（XSS）：为什么Cookie中有HttpOnly属性？.pdf 6.24M
| ├──34丨CSRF攻击：陌生链接不要随便点.html 3.37M
| ├──34丨CSRF攻击：陌生链接不要随便点.m4a 9.96M
| ├──34丨CSRF攻击：陌生链接不要随便点.pdf 2.39M
| ├──35丨安全沙箱：页面和系统之间的隔离墙.html 3.44M
| ├──35丨安全沙箱：页面和系统之间的隔离墙.m4a 10.85M
| ├──35丨安全沙箱：页面和系统之间的隔离墙.pdf 2.17M
| ├──36丨HTTPS：让数据传输更安全.html 4.35M
| ├──36丨HTTPS：让数据传输更安全.m4a 11.47M
| └──36丨HTTPS：让数据传输更安全.pdf 2.78M
├──09-结束语 (1讲)-更多精彩课程请加AG1101201
| ├──结束语丨大道至简.html 1.77M
| ├──结束语丨大道至简.m4a 2.78M
| └──结束语丨大道至简.pdf 1.50M
└──10-课外加餐 (1讲)-更多精彩课程请加AG1101201
| ├──加餐二｜任务调度：有了setTimeOut，为什么还要使用rAF？.html 4.38M
| ├──加餐二｜任务调度：有了setTimeOut，为什么还要使用rAF？.m4a 11.97M
| ├──加餐二｜任务调度：有了setTimeOut，为什么还要使用rAF？.pdf 3.12M
| ├──加餐三｜加载阶段性能：使用Audits来优化Web性能.html 6.11M
| ├──加餐三｜加载阶段性能：使用Audits来优化Web性能.m4a 9.93M
| ├──加餐三｜加载阶段性能：使用Audits来优化Web性能.pdf 3.86M
| ├──加餐一丨浏览上下文组：如何计算Chrome中渲染进程的个数？.html 6.63M
| ├──加餐一丨浏览上下文组：如何计算Chrome中渲染进程的个数？.m4a 8.74M
| └──加餐一丨浏览上下文组：如何计算Chrome中渲染进程的个数？.pdf 4.74M