@1 第一步：
URI(统一资源标识符)= URL（统一资源定位符）+URN（统一资源名称）；
@2 传输协议：
HTTP: 超文本传输协议
HTTPS: HTTP + SSL（加密证书）相对于http传输会更加安全
FTP: 文件的传输 上传工具 资源共享
域名：域名是外网IP一个标识，相对于IP来说牢记比较困难，域名会更加便捷。
端口号：0-65535，每个端口号对应统一服务器 中不用的项目，默认http:80, https:443.
编码问题，如果url对应参数存在中文特殊字符等，传递的时候会解析出错，这时候需要编码
encodeURL / decodeURL ; (适合解析url所有的)，
encodeURLComponent / decodeURLComponent ; 适合解析url特殊字符中的
@3 强缓存与协商缓存
强缓存：
http/1.1 Cache-Control max-age = 259200
http/1.0 Exprices Sun, 15 May 2022 20:14:22
存在问题， 如果本地有缓存， 然而服务器更新了资源如何保障客户端获取最新的？
这个时候我们可以把 css js 最缓存，但是不能对 html 页面 做缓存。因为html页面是渲染的入
口，其他资源在渲染解析HTML的时候再去请求的。
协商缓存: 哪怕本地有缓存也要和服务器进行协商
第一次请求页面，本地没有缓存，向服务器发送请求，如果需要设置协商缓存，在响应头返
回相对应的字段。【last-modified 记录资源最后一次更新的时候】【Etag 记录资源最后一次
更新的标识】，客户端浏览器看到标识，会把标识和资源全部做缓存。
第二次向服务器发送请求的时候也是会重新发送的，会把协商缓存存储的标识和资源通过
【if-modified-since/if-None-math】传递给服务器，服务器如果返回的304则说明资源没有更
新，从本地缓存中获取就可以了。 如果资源更新了，则返回200，使用服务器新的资源，同
时把最新的资源缓存起来。
真实项目开发中，建议HTML页面采用协商缓存，其他界面采用协商和强缓存。
@4 数据缓存：前端开发者对于不常更新的数据做本地缓存。
本地缓存分类：
1 localStorage: 持久化存储，内存5M，默认和服务器没有关系。手动设置有效期。
2 cookie：具有时间性，存储内存4KB, 如果不跨越的情况下，每次请求会自动把cookie携带
给服务器，造成请求慢
3 sessionStorage：浏览器关闭或者页面刷新 缓存清除。
@5 DNS域名解析：
浏览器输入URL地址之后，会去DNS服务器寻找对于的外网ip，找到服务器。
DNS解析也会有缓存【谷歌浏览器缓存在1min】
前端优化： 尽可能减少DNS解析的次数（也就是所有的资源 部署到相同的服务器）
真实项目中：不会部署到同一服务器中，【web服务器 图片服务器 数据服务器】
解决方法、DNS预解析，利用<link></link>的异步性。在GUI渲染的过程中 同时解析域名。
@6 TCP三次握手【客户端与服务器建立一个稳定的传输通道】
TCP:稳定可靠，经过三次握手确定传输稳定性 消耗时间久 常规业务都用他。
UDP:快速传递，省略三次握手，存在丢包的情况。
@7 数据传输：
http请求报文：请求体 请求起始行 请求主体
http响应报文：响应头 响应起始行 响应主体
@8 TCP的四次挥手，【断开用户端和服务器的链接】
http1.1版本默认开启了Connection:keep-alive长链接，当前请求数据传输完成后不会断开链
接，下次请求会基于这个传输通道继续，减少了tcp三次握手，四次挥手的问题。
@9 性能优化总结:
1 利用缓存： 协商缓存 强缓存 本地存储
2 DNS优化： 分服务部署，采用DNS预解析
3 Tcp三握四挥，采用Conenction:keep-alive
4 数据传输： 服务器开启GZIP压缩，大数据分批次请求，减少HTTP请求次数 CDN采用分布
式, 骨架屏 图片延迟加载