前端面经-性能优化

笔记-性能优化

服务器端

1.使用内容分发：

在现有的网络中增加一层新的网络架构，将网站的内容发布到最接近用户的cache服务器内，通过DNS负载均衡技术，判断用户来源就近访问cache服务器取得所需要的内容。

2.静态资源缓存，移动端资源离线缓存：

利用缓存头expires、配置etag等；

配置Etag：通过if-none-match来判断缓存是否过期，一般叫做协商缓存；

添加expires头：服务器端通过响应告诉浏览器，在什么时间之前或多长时间之内，不要再请求服务器了。这叫做强缓存。

Appcache主要是利用manifest文件，告知浏览器需要缓存的内容

localStorage等

网络方面

1.减少请求数量：小图片合并雪碧图；js、css文件选择性合并；避免重复性的资源请求

2.减少文件大小：压缩css、js文件（删除不必要的空行、注释、重复的代码等，以及开启gzip压缩）；尽可能控制dom节点数

3.使用合理的静态资源域名：使用短小且独立的域名，短小是可以减少头部开销，域名越短，请求头起始行的URI就越短，之所以独立，是因为独立域名不会共享主域的cookie，可以有效减轻头部开销；并且页面中并不是域名越多越好，浏览器对相同域名的并发数量有限制，一般允许同域名并发6-8个。每一个域名都要经历DNS查询等，比较耗时；

客户端

1.使用外链css和js，css放在头部，js放在尾部，防止js的加载阻塞页面的渲染；

2.html的代码优化，避免空的src，使用类选择器，不建议使用很长的base64，避免css表达，避免使用eval和with、减少作用域链的查找，使用事件委托、减少dom操作，尽量使用dom缓存；

3.合理分配资源加载时间，按需加载，包括css、js文件以及图片、业务模块等