让网页打开速度加快的办法大合集

前言

刚开通博客的时候,我对网页打开的速度要求比较高,天天找各种地方测速,尝试各种办法做毫秒级的优化。也可能是那时候跑pop比较多,对网页打开速度关注比较多。

那时买的阿里云的VPS,用七牛CDN,还挂着百度云加速,打开速度飞快。直到有天发现网站上被挂了莫名其妙的悬浮广告(运营商搞的劫持),点开是个抽红包骗人注册p2p的Landing Page……那种感觉,难以形容,就好像人贩子被人拐卖了。没办法只能换成https的,结果发现百度和七牛的免费政策里竟然没有https加速。

后来想想,反正写国外affiliate marketing免不了要涉及科学上网的技术,干脆一不做二不休,把服务器换到国外去,才有了更多折腾。于是打算开个帖子把网速优化的东西全记录下来。

STEP 1 使用优质服务

一说提高网页打开速度,第一条就是使用线路快的服务器和域名服务器。

就像我这个博客的服务器,从国内阿里云搬到了日本,再怎么优化打开也很慢,毕竟距离远。所以网页托管在离访客近的服务器是首选,你看那些跑pop的人把Landing Page都放在目标国家当地的服务器上。

除了服务器还有域名NS,选个速度快的NS域名解析也能稍微快一点。大家可以在这里查查DNS解析的速度。

DNS Performance Compare the speed and uptime of enterprise and commercial DNS services www.dnsperf.com

STEP 2 动静分离

除了换服务器再马上就能想到的是动静分离。也就说把图片,js,css这样的文件放到CDN上。

原理和上面一样,CDN就是把这些文件存到全球各个地方的节点里,需要时从离访客最近的节点里取。

国内提供服务有七牛,又拍,阿里云,腾讯云等;国外的有MaxCDN, KeyCDN, CDN77等。基本都提供免费的服务或者试用,具体可以自己查查。关于wordpress的cdn插件也有很多,这里不再说了。

STEP 3 压缩

压缩后文件变小,传输速度块这个道理都懂。媒体文件压缩之后能小不少,对网页提速很有帮助。我也在导航里也放了几个在线压缩图片的工具。
https://123.cuihuanghuang.com/favorites/图片处理/

除了压缩图片,还能压缩网页文件HTML/JS/CSS。其实压缩网页文件就是把里面多余的空格回车去掉了。不过压缩JS/CSS后有可能让某些功能失效,压了之后记得测试一下。

http/https在传输也可以压缩,gzip和brotil都可以达到加速的目的,具体开通方法自己搜吧。

STEP 4 缓存

缓存可以把动态文件存成静态,浏览器缓存也可以把文件放在本地,下次用的时候直接调用,达到加速的目的加速。

WordPress缓存插件有很多,比较推荐的是wprocket,功能强大设置简单。其他Litespeed Cache, W3 Total Cache等免费插件也不错。

还可以开启php的Opcache缓存加速PHP执行;开启Memcached、Redis缓存数据库查询结果。这里不再展开了。

STEP 5 网页上的小技巧

网页代码上也可以做些手脚让网页体验更好。比如LazyLoad懒加载。懒加载就是不加载可视区域外的图像,等滚到了再加载。

除了懒加载还有预加载,就是提前加载后面需要的内容缓存起来,等用的时候可以马上打开。这里推荐一个比较简单的:instant.page,他的原理就是在鼠标指向链接的时候就开始加载链接的内容,等用户点击的时候达到立即显示的效果。具体可以看他的网站。

Make your site’s pages instant in 1 minute And improve your conversion rate by 1% instant.page

UI方面,可以开启加载动画,告诉用户块加载完了,再稍微等一下就好。可以用这个网站:https://github.hubspot.com/pace/docs/welcome/

今天先写到这里,下一篇分享一下关于CDN的。

暂无评论

发表评论

您的电子邮件地址不会被公开,必填项已用*标注。

相关推荐

微信扫一扫

微信扫一扫

微信扫一扫,分享到朋友圈

让网页打开速度加快的办法大合集