网络性能优化

主要从以下几个方面入手：

• 压缩代码，优化大包体积，以及拆包，如：vue这种不会更改的库进行拆包加载
• 利用CDN缓存，大幅度缩减静态资源的访问时间，尤其公共库或不会变更的库，如：Vue等。
• 利用缓存，对于一些静态资源可开启协商缓存，利用构建文件生成的hash值来置换缓存
• 开启http2/http3，利用多路复用、头部压缩等特点，充分利用带宽，快速传递大量文件数据
• 利用script的defer、async属性，尽快让页面加载js文件
• 利用refetch、preload属性

prefetch：可以让页面在空闲时预先下载其他页面可能用到的资源

preload：可以让页面预先下载本页面可能用到的资源

• 多个静态资源域，对应不使用http2的场景，将对象独立的静态资源分到多个域下保持，可以让浏览器同时客气多个TCP链接，进行并行下载（主要原因是浏览器对同一个域下的 TCP 连接数是有限制的，这样就导致某个网页如果外部资源多了，比如图片很多的网页，在解析页面时，由于 TCP 连接数受限，就无法同时发起多个下载连接，无法充分利用带宽资源。因此，可以把静态资源放到多个域名下，这样就绕开了连接数的限制，做到了并发下载）