由于部署到服务器上面的项目,受带宽限制,受资金限制,导致不得不把项目优化到极致,下面就把思路分析给朋友们,喜欢的就点赞,不喜欢也不要喷。(备注一下 这里优化的是静态资源,程序的优化(大多看设计思想和架构了)
未优化前:
100 requests请求 --传输 1.3M --finish 完成大概20多S (这个根据服务器带宽而且,1M带宽 传输大概125kb/s 越大带宽钱越多,当然传输越快,速度越快)
这个从服务器地址访问的截图 --优化效果图:
26 requests 请求 — 传输141KB — finish完成 355ms
从哪些方面下手优化呢:
(1)css放到页面前面 js放到末尾 (面试题哟)
CSS放头部在加载html生成DOM tree的时候,就可以同时对DOM tree进行渲染。
javascript可能会改变DOM tree的结构,所以需要一个稳定的DOM tree。
javascript加载后会立即执行,中断html的解析过程 如果外部脚本加载时间很长 同时会阻塞后面的资源加载。
(2) 多个css 合并成一个css 多个js合并成一个js
通过自动化构建工具gulp webpack这些都可以搞定
(3) 适当采用CDN加速,通过国内的CDN加速 效果还是比较明显
CDN系统能够实时地根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求
重新导向离用户最近的服务节点上 。如果你服务器加载访问资