啪的一下就进来了,很快哦

5 篇文章 0 订阅
4 篇文章 0 订阅

博客已经陆续转到个站 : dancingcode.cn,欢迎访问。


刚开始自己的博客是基于 `hexo` 这个框架搭建的,跟着教程一步步的把博客部署到 `github page`, 但是其速度真的是太感人了,甚至导致自己一度失去了写博客的兴趣。 心有不甘,随着 云服务 的普及以及其低廉的价格,自己入手了一个最便宜的阿里云服务器,不得不说,直到现在,仍然觉得是真的香。

买了服务器之后就按照网上的教程一步一步的部署到 nginx 上,但是谁让咱年少无知呢,服务倒是安了一大堆,但真正用起来的没几个,唉,还不是怪自己菜。

部署到阿里云之后我感觉访问速度是快了一点,但是并没有像访问别人的网站那么流畅,甚至,感觉根本就没什么效果,还真的是恼火,讲道理, nginx 为一个区区的小博客服务,根本就不是个事。但现实就是这样,这个问题一直想解决,但由于手头一直没有空,拖到现在,就在今天,这个问题终于被解决了。

追根溯源

要想解决问题,我要知道你为啥这个慢的。
首先看原因
在浏览器中访问自己的网站 :dancingcode.cn,使用开发者工具查看网络情况:

好家伙,加载博客主页就花费了 18.83 s,我直接好家伙,恐怕大多数人等不到加载完就已经退出去了吧。
我们仔细看一下时间到底花在哪了。
按访问完成时间进行排序:

可以看到上图中的第一个文件 all.css 访问失败,花费的时间是 17.74 秒,显然就是这个东西的原因。据我有限的知识,这个其实是 font-awesome 国外的图标库网站,但是国外嘛,要么是速度贼慢要么根本访问不到,这不就翻车了。

第一想法就是直接干掉这个文件,不要这个图标字体库了,但是要先找到这个文件你是在哪里中引入的,追根溯源,可以看到:

该引入是在 index.html 的第 47 行引入,第一想法就是注释掉不就行了。于是找到了该文件将这一行注释掉:

本以为已经很快了,谁想到还是大意了,随便点击进入一篇文章,同样遇到了加载 all.css 文件失败的问题:

原来我使用的整个主题框架都用到了这个字体库。
并且在每次提交的时候都进行 hexo cleanhexo g -d,每次 主页面都会被重新生成,每次都在服务器中注释这一行显然是不现实的。

咳,google 吧。

使用 CDN 加速解决

在网上看到这样一篇博客 博客地址,内容大概是这样:


原来是有一个 js 文件专门用来设置 font_providers,于是找到这个文件,在网上随便找到了一个 font-awesomeCDN 加速地址:

https://cdn.bootcss.com/font-awesome/5.13.0/css/all.css

然后在文件中将 icon_providers 地址改为上述地址:

然后重新再 hexo clean 以及 hexo g -d.

可以发现效果显著:

访问博客主页只花了 1.8 秒的时间,而且没有 all.css 这个访问失败的问题。同样访问任何一篇博客也不会再从 font-awesome 加载,时间大大缩短,大概只要 1s 左右就可以全部加载完毕,达到了想要的效果。

匆匆开始,匆匆结束,拜拜!


每天进步一点点!


2020/11/24   成都


博客已经陆续转到个站 : dancingcode.cn,欢迎访问。


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值