1. URL解析
2. 缓存检测
这个是产品性能优化的重点。包括有强缓存，协商缓存，数据缓存。前两个主要是针对静态资源文件（图片，css，不太更新的js文件等）缓存。另外这两个缓存都不需要前端做什么，都是浏览器自动完成的。
检测顺序：先检测是否有强缓存，有且未失效使用强缓存；没有或者已失效则检测是否有协商缓存，没有才请求服务器拿新数据
其中数据缓存的位置有两个地方：内存缓存（Memory Cache）和硬盘缓存（Disk Cache）。其中缓存存放情况及强缓存对应的标识见下图：
强缓存 （Expires/Cache-Control）
浏览器对应强缓存的处理，根据第一次请求资源时响应头返回来确定的（见上图），通常情况html文件是不做强缓存的。
强缓存存在的问题：数据更新了，如果有缓存还是会使用，这就会导致数据未及时更新，显示的是旧数据。解决方案有三个：
1. 服务器更新资源后，让资源名称和之前的名称不一样，让页面导入全新的资源名称。webpack上对应的是名字加hash值。
2. 当文件更新后，在html文件引入资源时候文件名后设置一个后缀（如时间戳）
3. 不使用强缓存，使用协商缓存。
协商缓存（Last-Modified-Since（http1.0）/ ETag（http1.1））
协商缓存就是未设置强缓存或强缓存失效后，浏览器携带缓存标识向服务器发起请求，由服务器根据携带过来的标识判断是否使用缓存的过程。服务器判断数据没有更新便会返回状态码304，通知浏览器使用缓存信息。
强缓存和协商缓存的区别是协商缓存总是要跟服务器协商，所以一定会发http请求，所以相对来说强缓存性能是比协商缓存好的。
协商缓存的流程：
Last-Modified-Since是http1.0的标识，ETag是http1.1的标识；前者指的是最后更新时间，且只能精确到秒，所以存在误差。所以出现了ETag，ETag是每次更新都会重新生成一个新的。
数据缓存
针对ajax请求返回的数据等
3. DNS解析（域名解析）
DNS解析也是有缓存的，如果之前解析过，会在本地有缓存（不一定）。
解析过程分为两步查询：
-
递归查询（查询本地DNS服务器是否有解析缓存过该域名）
-
迭代查询（本地没有）
每次解析耗时预计在20-120毫秒。所以优化可能会考虑减少DNS请求次数，这就需要一个页面尽可能用相同的域名，即资源放在相同的服务器。但实际情况却是相反的。因为不同资源所需服务器性能，并发量等是不相同的，像图片就会需要更好的性能，更多的服务器来存储，存文本的就少很多。
所以实际大型项目，大公司一定是服务器分布式，或服务器集群共享的。这样才能资源合理运用，做到高并发，高可用。
项目中常见的DNS优化方案是：DNS预获取：
4. TCP三次握手（建立连接通道）
5. 数据传输
6. 四次挥手（断开/释放连接通道）
由于每次请求服务器都需要三次握手四次挥手这样一套下来，对性能消耗还是很大的。所以http1.1以后浏览器默认都使用Connection：keep-alive；这种规范来建立一个长连接，来保证TCP通道建立完成后，可以不关闭连接。
另外http1.0 keep-alive是需要手动设置的
7. 页面渲染
这里开始就是开始js层面的优化了。
最后是http1.0，http1.1，http2.0的区别：
http1.0和1.1的区别
http1.x和http2.0的区别
