小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
现象
有一天:领导过来说,你能不能把页面再优化一下,提升一下页面的访问速度啊? 因为我们是移动端页面, toC产品,体验要做好一点。
听到领导的请求后,我说,没问题,包在我身上。
于是,我就打开掘金,搜索如何能快速提升页面访问速度的方法。果不其然,掘金真是干货满满(摸鱼的好地方),然后我在页面上使用优化的方法,速度果然有了提升,嘿嘿嘿。
下面我把使用的方法总结一下。
方法
图片采用cdn地址
我们之前图片是跟项目一起打包的,虽然图片都有压缩,但是访问速度在300ms左右,如果要提升访问速度,资源这些是重中之重。
于是我们换成了阿里的cdn源,顿时图片的访问速度降到了几十ms,提升速度杠杠的。
文件采取gzip压缩
我们对图片采用了cdn加速,还有打包出来的文件该怎么处理,比如css文件,js文件等,本质上这些也是可以放到cdn上的,但是我们目前只是针对图片采用cdn加速。
针对打包的文件,我们采用的是在nginx
上采用gzip压缩
。
配置如下:
#gzip
gzip on;
gzip_min_length 10k;
gzip_comp_level 2;
gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript;
gzip_vary on;
gzip_disable "MSIE [1-6]\.";
复制代码
开启缓存
通过开启浏览器的强缓存和协商缓存,来缓存页面,下次访问的时候可以快速打开。
浏览器具体是怎么缓存的可以查看我这篇文章。
以上就是我在提升页面访问速度的几种常用方法,大家有更好的办法,可以评论沟通。