性能优化一条龙

性能优化

根据实际情况做性能优化的流程和分析。

性能优化的话，可以从很多方面，ui优化，组件优化，打包体积优化，页面优化等，但我们要监控这个页面哪些指标需要优化，比如FP，FCP，FMP，如果是fp时间过长，就要从网络层面进行优化，现在普遍的都是http1.1的请求方式，就要去考虑要不要升级到http2，采用一种多路复用的能力，或者再上一层，可以考虑dns解析的速度是否过慢，可以考虑是否用dns缓存或者dns预解析去解决问题，然后做一些预加载的过程。如果是fcp时间过长，那就是说浏览器渲染第一块时间过长，我们浏览器接收的包的体积过大，导致我们解析过慢，我们考虑一下是否要进行拆包处理，也要对图片进行一些压缩操作，大概能想到的，也就这两种。如果是fmp时间过长，那就是说浏览器绘制时间过长，这要从代码层面去解决问题，可以通过ssr，在服务端进行渲染，然后返回，其实压缩图片体积，也能优化FMP的时间。

FP：first paint 白屏时间，如果是fp时间过长，就要从网络层面进行优化，现在普遍的都是http1.1的请求方式，就要去考虑要不要升级到http2，采用一种多路复用的能力，或者再上一层，可以考虑dns解析的速度是否过慢，可以考虑是否用dns缓存或者dns预解析去解决问题，然后做一些预加载的过程。

FCP：如果是fcp时间过长，那就是说浏览器渲染第一块时间过长，我们浏览器接收的包的体积过大，导致我们解析过慢，我们考虑一下是否要进行拆包处理，也要对图片进行一些压缩操作，大概能想到的，也就这两种。

FMP：如果是fmp时间过长，那就是说浏览器绘制时间过长，这要从代码层面去解决问题，可以通过ssr，在服务端进行渲染，然后返回，其实压缩图片体积，也能优化FMP的时间。

多路复用：http1.1中，浏览器同一时间只能发送一个请求。当一个请求占用通道时，其他请求只能等待，即使他能立即响应，消耗了很多等待时间。h2中通过多路复用的方式解决了对头阻塞的问题。提高了传输效率，h1.1是通过文本方式进行传输的，而http2引入了帧和流的概念，链接成功后，一条链接上，可以以二进制的方式发送多条消息，彼此之间互不影响，这就解决了对头阻塞的问题。

DNS解析：

就是当你进行请求的时候，服务器会把你的域名解析成ip，这个过程就是dns的解析过程，优化dns过慢的问题，可以通过cdn服务进行dns负载均衡，或者进行dns缓存，dns预解析，都能提高速度。

cdn服务进行dns负载均衡：即cnd服务器会将用户请求导向最近的cdn服务站，然后当进行dns解析时，cdn服务站会返回距离最近的服务站的ip地址，从而加速内容的运输。

dns缓存：对请求的域名和ip结果在本地进行缓存，以便在将来的DNS查询中重复请求。

dns预解析：预解析是一种浏览器技术，它可以在后台对网页中的域名进行解析，以便提前获取域名对应的IP地址或其他资源，从而加速网页的加载速度。预解析可以通过

标签来实现。

ssr服务端渲染：

这个晚些会单出一个文档，这里就放一个链接了

深入浅出 SSR 及 Nuxt.js 初体验 - 掘金