流量优化
- 防盗链处理
防盗链处理 |
---|
减轻服务器及带宽压力 工作原理: 通过Referer或者签名,网站可以检测目标网页访问的来源网页,如果是资源文件,则可以跟踪到显示它的网页地址。一旦检测到来源不是本站,即进行阻止或返回指定的页面。 通过计算签名的方式,判断请求是否合法,如果合法则显示,否则返回错误信息。 |
Referer: 加密签名: |
前端优化
- 减少HTTP请求
- 添加异步请求
- 启用浏览器缓存和文件压缩
- CDN加速
- 建立独立图片服务器
减少HTTP请求 |
---|
改善响应时间:减少图片、js、css、flash等组件数量,由此减少HTTP请求的数量。 HTTP连接产生的开销: 域名解析--TCP连接--发送请求--等待--下载资源--解析时间 图片地图 CSS Sprites(CSS精灵:指定background-image和background-position来显示图片) 合并脚本和样式表 图片使用Base64编码 减少页面请求数(直接嵌入到网页,而不是从外部载入) |
启用浏览器缓存 |
---|
缓存分类: HTTP缓存模型中,请求成功有3种情况 200 from cache:直接从本地缓存中获取响应,最快速,最省流量,因为没有向服务器发送请求; 304 Not Modified:协商缓存,浏览器在本地没有命中的情况下,请求头中发送一定的校验数据到服务端,如果服务端数据没有改变,浏览器从本地缓存响应,返回304; 快速,发送的数据很少,只返回一些基本的响应头信息,不发送实际响应体。 200 OK:以上2种缓存全都失败,服务器返回完整影响。没有用到缓存,相对最慢。 |
本地缓存:(浏览器认为本地缓存可用,不会去请求服务端) 3个相关Header头优先级: Pragma > Cache-Control > Expires Pragma:HTTP1.0时代遗留产物,设置为no-cache时,会告知浏览器禁用本地缓存,即每次都向服务器发送请求; Cache-Control:HTTP1.1针对Expires时间不一致的解决方案,运用Cache-Control告知浏览器过期的时间间隔,而不是时刻,即使具体时间不一致,也不影响缓存的管理。 no-store :禁止浏览器缓存响应no-cache :不允许直接使用本地缓存,先发起请求和服务器协商max-age=delta-seconds :告知浏览器该响应本地缓存有效的最长期限,以秒为单位。Expires:http1.0时代用来启用本地缓存的字段,expires值对应一个(Thu, 31 Dec 2037 23:55:55 GMT)格林威治时间,告诉浏览器缓存实现的时刻,如果还没到该时刻,表明缓存有效,无需发送请求。 浏览器与服务器的时间无法保持一致,如果时间差距大,就会影响缓存结果。 协商缓存:当浏览器没有命中本地缓存,如本地缓存过期或响应中声明不允许直接使用本地缓存,那么浏览器肯定会发起服务端请求。服务端会验证数据是否修改,如果没有,通知浏览器使用本地缓存。 相关Header: Last-Modified :Mon, 28 Sep 2018 08:06:43 GMT #通知浏览器资源的最后修改时间If-Modified-Since :Mon, 28 Sep 2018 08:06:43 GMT #得到资源的最后修改时间后,会将这个信息通过If-Modified-Since提交到服务器做检查,如果没有修改,返回304状态码ETag :"78437822c-6739" #HTTP1.1推出,文件的指纹标识符,如果文件内容修改,指纹会改变If-None-Match :78437822c-6739 #本地缓存失效,会携带此值去请求服务端,服务端判断该资源是否改变,如果没有改变,直接使用本地缓存,返回304缓存策略的选择 适合缓存的内容 :不变的图像,logo图标等;js、css静态文件;可下载的媒体文件建议使用协商缓存 :HTML文件;经常替换的图片;经常修改的js、css;js、css文件的加载可以加入文件的签名来拒绝缓存 :index.css?签名 index.签名.js 不建议缓存的内容 :用户隐私敏感数据;经常改变的api数据接口Nginx配置缓存策略 本地缓存配置: add_header指令 :添加状态码为2XX和3XX的响应头信息add_header name value [always]; 可以设置Pragma/Expires/Cache-Control ,可以继承expires指令:通知浏览器过期时长 expires time; 为负值 时表示Cache-Control:no-cache;为正或0 时,表示Cache-Control:max-age=指定的时间;当为max 时,会把Expires设置为 "Thu, 31 Dec 2037 23:55:55 GMT",Cache-Control设置到10年;ETag指令 :指定签名etag on|off; #默认是on 用的最多的是expires |
资源压缩 |
---|
JS、CSS、图片、HTML代码的压缩: CSS, JavaScript 压缩, 美化, 加密, 解密 JS:UglifyJS、YUI Compressor、Closure Compiler CSS:CSS Compressor 图片:tinypng Gzip压缩(Nginx配置): vim nginx.conf文件,保存退出,重新加载Nginx。 gzip on|off; #是否开启gzip gzip_buffers 4 16k; #缓冲 gzip_comp_level [1-9]; #压缩级别 推荐6(级别越高,压的越小,越浪费CPU计算资源) gzip_min_length 1k; #开始压缩的最小长度 gzip_http_version 1.0; #开始压缩的http协议版本 gzip_proxied; #设置请求者代理服务器,该如何缓存内容 gzip_disable "MSIE [1-6]\."; #正则匹配UA 什么样的Uri不进行gzip<br>gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png; #对哪些类型的文件用压缩 如txt,xml,html,css gzip_vary on|off; #是否传输gzip压缩标志 |
CDN加速 |
---|
CDN(内容分发网络): 尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节,使内容传输更快、更稳定。 在网络各处放置节点服务器所构成的在现有的互联网基础之上的一层智能虚拟网络。 CDN系统能够实时地根据网络流量和各节点的连接、负载状况以及到用户距离和响应时间等综合信息,将用户请求重新导向离用户最近的服务节点上。 使用CDN的优势: 1.本地Cache加速,提高站点访问速度; 2.跨运营商的网络加速; 3.自动生成服务器的远程Mirror镜像cache服务器,减少访问带宽,分担网络流量,减轻原站点服务器负载等; 4.有效预防黑客入侵。 CDN的工作原理: 用户发起请求-->智能DNS解析-->取得缓存服务器IP-->将内容返回给用户(如果缓存中有)-->向源站发起请求-->将结果返回给用户-->将结果存入缓存服务器 CDN的适用场景: 站点中大量静态资源的加速分发,如:图片,CSS,JS,HTML; 大文件下载; 直播网站…… CDN的实现: BAT等提供的CDN服务; LVS做4层负载均衡; Nginx,Varnish,Squid,Apache TrafficServer做7层负载均衡和cache; 使用squid反向代理,或者Nginx等的反向代理。 |
建立独立的图片服务器 |
---|
独立的必要性: 1.分担Web服务器的I/O负载-将耗费资源的图片服务分离出来,提高服务器性能和稳定性; 2.能够专门对图片服务器进行优化-为图片服务设置有针对性的缓存方案,减少带宽成本,提高访问速度; 3.提高网站可扩展性-通过增加图片服务器,提高图片吞吐能力。 采用独立域名: 同一域名下浏览器的并发连接数有限制,突破浏览器连接数的限制。由于cookie的原因,对缓存不利,大部分Web cache都只缓存不带cookie的请求,导致每次图片请求都不能命中cache。 独立后的问题: 如何进行图片上传和图片同步? 1.NFS共享方式;2.利用FTP同步。(七牛云) |
服务端优化
- 页面静态化
- 并发处理队列处理
数据库优化
- 数据库缓存
- 分库分表、分区操作
- 读写分离
- 负载均衡
Web服务器优化
- 负载均衡