web性能优化

1、浏览器请求并发限制：每个浏览器对同一域名下的资源的请求有并发限制，例如chrome就是最多为6条：
(1)搭建node服务器，接受图片请求服务：

(2)前端去node服务器那边同时请求8张图片：

(3)在chrome控制台network中查看，发现同一时间线下只能最多处理6个请求

优化：采用多域名访问的方式，因为浏览器对同一域名的并发请求有限制，那么可以将图片等静态资源放在另外不同域名的服务器中，那么这些请求就可以并发了。

2、HTML层级优化：
(1)减少HTML的层级嵌套：层级嵌套越多，浏览器遍历DOM所需的时间就越长，在Vue这种框架的组件中，组件也不应该嵌套过多，一个是遍历时间会变长，还有一个是父子组件间的通讯代价变大。
(2)减少空标签、无用标签的滥用：可以用after,before等伪元素代替
(3)避免在HTML标签中引用style属性, 浏览器解析HTML文件会增加压力。
(4)使用模板引擎，像是Vue等框架都自带模板语法。模板语法做的事情：给它一个模板和数据源，返回一个字符串，然后再把这个字符串写入页面（只触发一个回流，如果通过传统方法动态写入HTML,会触发多次回流）
(5)使用（是异步加载，@import是同步加载）：
① prefetch可以利用浏览器空闲的时候，就预加载将来页面可能用到的资源，然后缓存起来。可以提高后续页面的首屏速度。
②preload可以利用浏览器空闲的时间，就预加载当前页面需要的资源，可以提升当前页面的加载速度。
(6)标签： 给标签设置宽高100%，并给它外套一个

并设置固定宽高。可以避免图片替换时候的回流。给img添加alt属性，可以优化SEO,更容易被搜索引擎搜索。
(7)src属性：像是、