WEB开发
前端应用的领域
- toB (toBusiness)：企业级应用，如银行系统、公有云平台、广告平台。规模大，很多是关于各类资源管理类的。
- toC (toCustomer)：面向个人的应用，如生活娱乐平台等。
- toD (toDevelop)： 面向开发者，如各类前端框架、代码编辑器等。
前端应用的领域
- 命令行/终端
- Webpack CLI
- Babel CLI
- Vue CLI
- React CLI
- 桌面跨端
- Electron
- NW.js
- 移动跨端
- React Native
- Flutter
从URL到渲染
现代浏览器是由多个进程组合实现的，其主要进程为：
- 浏览器进程：控制浏览器这个应用的chrome（主框架）部分，包括地址栏、书签、前进/后退按钮等，同时也会处理浏览器不可见的高权限任务，如发送网络请求、访问文件。
- 渲染器进程：负责在标签页中显示网站及处理事件。
- 插件进程：控制网站用到的所有插件。
- GPU进程：在独立的进程中处理GPU任务。之所以放到独立的进程，是因为GPU要处理来自多个应用的请求，但要在同一个界面上绘制图形。
导航的流程
用户在浏览器的地址栏输入URL之后，浏览器回通过互联网获取数据并显示网页。从请求网页到浏览器准备渲染网页的过程，叫做导航。浏览器进程主要包括UI线程、网络线程和存储线程，分别负责绘制浏览器的按钮和地址栏、处理网络请求并接收数据、以及访问文件和存储数据。导航主要由以下几个部分组成。
处理输入
因为浏览器的地址栏同时也是输入框，因此UI线程会判断用户输入的是查询字符串还是URL。
开始导航
若输入的是URL，UI线程会通知网络线程发起网络请求，此时网络线程会负责DNS查询、建立TLS（如果是HTTPS协议的话），于服务器连接的过程还需要TCP的三次握手等过程。若网络请求接收到的状态码为301，则会跟UI线程进行沟通，告诉它服务器要求重定向，然后发起新的网络请求。
读取响应
网络线程会检查响应头中的Content-Type字段，以了解数据类型。若没有这个字段，则需要MIME嗅探。若响应是HTML文件，则将数据交给渲染器进程。若是zip等其他文件，则意味着是下载请求，把数据交给下载管理器。
联系渲染器进程
所有查检完毕，网络线程确认浏览器可以导航到用户请求的网站，于是会通知UI线程数据已经准备好了。UI线程会联系渲染器进程渲染网页。
提交导航
数据和渲染器进程都有了，就可以通过IPC从浏览器进程向渲染器进程提交导航。渲染器进程也会同时接收到不间断的HTML数据流。当浏览器进程收到渲染器进程的确认消息后，导航完成，文档加载阶段开始。
联系渲染器进程
渲染
渲染器进程的核心任务是把HTML、CSS、JS转化为用户可以交互的网页。主要过程如下：
解析HTML
- 构建DOM树：其主线程会解析HTML字符串，并转为DOM
- 加载子资源：网站中一般包括图片、CSS和JS等外部资源。浏览器会从缓存或网络加载这些文件。
计算样式
主线程要解析CSS并计算每个DOM节点的样式。这个过程就是根据CSS选择符，确定每个元素要应用什么样式。
布局
找到元素间的几何位置关系。主线程会遍历DOM元素并进行样式计算，构造一棵布局树，每个节点都带有坐标和大小信息。
绘制
有了DOM、样式和布局，仍然不足以渲染页面。还要解决先画什么后画什么，即绘制顺序的问题。
合成
合成（composite）是将页面不同部分先分层并分别栅格化，然后再通过独立的合成器线程合成页面。这样当用户滚动页面时，因为层都已经栅格化，所以浏览器唯一要做的就是合成一个新的帧。而动画也可以用同样的方式实现：先移动层，再合成帧。
WEB标准组织及其指定的标准
- IETF (Internet Engineering Task Force，互联网工程任务组)：TCP/IP的标准化、HTTP协议(0.9/1.0/1.1/2/3)、TLS1.3、JSON。
- Ecma (Ecma International): JavaScript的标准化、ECMAScript标准的制定。
- W3C (World Wide Web Consortium，万维网联盟): BOM、DOM、CSS、HTML、XML、Web Audio API、Web Storage、Web RTC、WebAssembly JavaScript Interface等。
- WHATWG (Web Hypertext Application Technology Working Group，Web超文本应用技术工作组): 与W3C合作指定HTML和DOM标准，以及Fetch和Encoding。
