app流量优化
2016-01-09 19:07
183 查看
app上线后,发现应用比较费流量,因此考虑对应用进行优化,减小访问的流量。
首先最费流量的部分是新闻列表的获取,由于我们的新闻列表是带各种状态和权限的,如果进入新闻后退出,它的状态和权限可能就变了。因此没有在本地缓存网页数据,每次都是新下的。首先看打印日志,发现返回的数据,大量都是图片的网址,我们用的是七牛的图片服务器,所有的前缀都是一样的,因此首先将数据库保存的图片由网址修改为图片名字,前端请求的时候,直接返回图片名字,在前端拼接成完整的网址。这样既节省了带宽,也节省了数据库空间。从实际效果来看,流量省了一半。
接下来考虑对静态页面进行压缩,网上检索了一下,发现nginx配置一下,就可以对静态页面进行压缩,于是研究了一下,配置后,用测试网页压缩的工具进行测试,果然有用,压缩率还比较高,jquery这种工具能压缩到30k,其他我们自己写的js都快压缩没有了。突发奇想,看我们js调用返回的json数据能不能压缩,于是配置了一下,惊喜的发现,nginx竟然也能对代理的数据进行压缩,30多k的数据给压缩到了1k多,基本上不用再优化了。而且不用改前端代码就可以了,浏览器自动帮我们处理了解压缩的过程,不需要人工干预。配置如下即可
gzip on;
gzip_min_length 1k;
gzip_buffers 4 16k;
#gzip_http_version 1.0;
gzip_comp_level 3;
gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/javascript application/json;
gzip_vary off;
gzip_disable "MSIE [1-6]\.";
首先最费流量的部分是新闻列表的获取,由于我们的新闻列表是带各种状态和权限的,如果进入新闻后退出,它的状态和权限可能就变了。因此没有在本地缓存网页数据,每次都是新下的。首先看打印日志,发现返回的数据,大量都是图片的网址,我们用的是七牛的图片服务器,所有的前缀都是一样的,因此首先将数据库保存的图片由网址修改为图片名字,前端请求的时候,直接返回图片名字,在前端拼接成完整的网址。这样既节省了带宽,也节省了数据库空间。从实际效果来看,流量省了一半。
接下来考虑对静态页面进行压缩,网上检索了一下,发现nginx配置一下,就可以对静态页面进行压缩,于是研究了一下,配置后,用测试网页压缩的工具进行测试,果然有用,压缩率还比较高,jquery这种工具能压缩到30k,其他我们自己写的js都快压缩没有了。突发奇想,看我们js调用返回的json数据能不能压缩,于是配置了一下,惊喜的发现,nginx竟然也能对代理的数据进行压缩,30多k的数据给压缩到了1k多,基本上不用再优化了。而且不用改前端代码就可以了,浏览器自动帮我们处理了解压缩的过程,不需要人工干预。配置如下即可
gzip on;
gzip_min_length 1k;
gzip_buffers 4 16k;
#gzip_http_version 1.0;
gzip_comp_level 3;
gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/javascript application/json;
gzip_vary off;
gzip_disable "MSIE [1-6]\.";
相关文章推荐
- 异步流程控制:7 行代码学会 co 模块
- [译] React 入门
- 如何优雅处理前端异常?
- Android编程实现监控各个程序流量的方法
- 深入探讨前端框架react
- Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(一)
- 自己动手写的javascript前端等待控件
- 实时查看系统流量的Shell脚本分享
- 前端必备神器 Snap.svg 弹动效果
- Centos下查看网卡的实时流量命令
- 四步完成asp网页设计流量统计
- 一张Web前端的思维导图分享
- 浅谈AngularJS--基础
- 浅谈AngularJS--域变量(scope)
- AngularJS' Internals In Depth(深入理解 AngularJS)
- 3ff8 javascript 获取Flash下载进度兼容IE, FireFox,Chrome浏览器
- Pongo网页版JavaScript源代码及设计思路