web前端性能优化总结

1em=16px(但不完全是)

em会继承父元素的字体大小。
ie 部分浏览器不支持em。

rem继承根元素的字体大小html。 px和rem

vue里面用jq只能在mounted里面或者updata里面才可以原因是：dom已经挂载。

什么是web语义化有什么好处？

Web语义化是指使用语义恰当的标签，使页面有良好的结构，页面元素有含义，能够让人和搜索引擎都容易理解。

web前端性能优化总结：
1、减少http请求，合理设置 HTTP缓存
2、使用浏览器缓存
3、在服务器端对文件进行压缩，在浏览器端对文件解压缩，可有效减少通信传输的数据量。如果可以的话，尽可能的将外部的脚本、样式进行合并，多个合为一个。
4、CSS Sprites
5、LazyLoad Images
6、CSS放在页面最上部，javascript放在页面最下面
7、异步请求Callback（就是将一些行为样式提取出来，慢慢的加载信息的内容）
8、减少cookie传输
9、CDN加速 CDN（contentdistribute network，内容分发网络）的本质仍然是一个缓存

性能优化的具体方法（way）
一）内容层面
1、DNS解析优化（DNS缓存、减少DNS查找、keep-alive、适当的主机域名）
2、避免重定向（/还是需要的）
3、切分到多个域名
4、杜绝404

网络传输阶段
1、减少传输过程中实体的大小
1）缓存
2）cookie优化
3）文件压缩（Accept-Encoding：g-zip）

2、减少请求的次数
1）文件适当的合并
2）雪碧图

3、异步加载（并发,requirejs）
4、预加载、延后加载、按需加载

渲染阶段
1、js放底部，css放顶部
2、减少重绘和回流
3、合理使用Viewport 等meta头部
4、减少dom节点
5、BigPipe

脚本执行阶段
1、缓存节点，尽量减少节点的查找
2、减少节点的操作（innerHTML）
3、避免无谓的循环，break、continue、return的适当使用
4、事件委托

this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定this到底指向谁，实际上this的最终指向的是那个调用它的对象