本文说说系统优化的常用手段吧，其中可能有一些内容在系列前面的文章里已经总结过了，这里还是再系统地整理出来，方便将知识汇总，有个整体上的认识。本文只讲方法论，没有具体实现。限于水平总结得可能不全，后面还会补充。
本文将系统主要分为前端优化和架构优化两个层面来说。
前端优化
1.页面优化
延迟加载
对一些还没有访问到的元素实行延迟加载，尤其是首页上的内容。
预加载
对用户即将访问到的元素进行预加载，提升用户体验。
减少DOM元素数量
可提升页面渲染速度。
iframe数量尽量少
众所周知iframe用于在页面中嵌入页面，如果数量过多也会降低页面加载速度。
压缩html文件大小
减少网络请求字节数，提升加载速度。
减少http请求数
分为三个方面：一是合并js或css文件；二是对图标类文件，使用css的sprites和background-image、background-position属性进行切图使用；三是使用浏览器缓存。
减少DNS查找次数
我们知道，我们是通过DNS服务器将网址解析成对应的服务器地址的，如果每次请求都去询问DNS服务器访问速度会很慢，因此我们第一次获取到对应的IP地址后将其缓存本地，不要每次去取。
避免跳转
页面的跳转都是通过301或302实现的，每次跳转也增加了网络消耗。
使用Ajax的GET请求
使用Ajax和服务器交互时，GET是交互一次，而POST是交互两次，分别发送文件头和请求数据。因此当我们只是为了加载数据时，通过GET方式即可，需要注意的是此方式限制数据量大小为2KB。
控制cookie大小
每次请求都会带上cookie，如果cookie过大爷会造成响应缓慢。建议不要将不常用的信息写入cookie。
2.CSS优化
将CSS置于页面顶端
因为页面是顺序加载的，预先加载css样式，可以保证后面的元素以我们设计的方式占线，用户体验更好。
避免使用CSS表达式
因为页面每加载到这个元素，就会重新计算一次，频率太高影响加载速度。
使用外部CSS
可减少HTML文件大小
3.JS优化
脚本放于页面底部
因为脚本的加载不影响页面内容的展示。
剔除重复的脚本
有效减少脚本大小，加速加载速度。
减少不必要的DOM访问
对已访问过的元素进行保存，因为DOM访问速度并不高。
判断条件多时用switch
尽量将概率大的case放在上面。
类型相同判断使用"==="
"==="判断类型相同的元素，而"=="会做类型转换。
4.图片
不在HTML中缩放图片
页面每次加载该图片，都是一个重新计算的过程。建议直接将图片切好尺寸载入。
架构优化
1.负载层
CDN加速
关于CDN的介绍可以系列这篇文章。使用CDN技术可以保证来自不同运营商网络的请求获取相差不多的访问速度。
动静分离
网站包括动态数据和静态数据。动态数据只能每次回到我们服务器上去取，而一些静态数据则可以部署在CDN服务器上，不要每次回源，加快加载速度。
负载均衡
通过随机、轮询、加权或哈希取模等方式，将请求尽量均衡地散布到我们的服务器上。详见系列这篇文章。
2.应用层
串行改并行、同步改异步
对热门数据或大的资源的加载，可考虑将其储存在多台服务器节点上，访问时启用多个线程去获取，加快访问速度。对于一个流程上对多个服务的调用，可考虑采用异步的方式(放入消息队列)，快速响应用户请求。
连接复用、请求合并
不要每次连接都重新申请，可引入资源池的概念进行管理(线程池)。对高频次访问的请求，可考虑合并为一个请求处理，节约连接资源。
熔断、隔离、限流、降级
对服务调用的一系列治理措施。详见此文。
3.数据层
缓存
对经常访问的数据储存在缓存中，不要每次访问数据库。详见此文。
读写分离
针对数据库而言，使读和写操作互不影响。
分库分表
当数据库数据达到一定量级，可考虑分库分表。详见此文。
扫一扫
1824
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
