优化Github Pages访问速度,去除Coding Pages的广告页

Updated at 2017-06-05:

前几天访问博客才发现,Coding 给每个绑定了自定义域名的站都加了一个广告页,等5s后才跳转到主页,想去掉也可以,199元飞升黄金段位即可,唉,白银选手都是辣鸡啊。这真是太恶心了,咱们这小站本来就人迹罕至,再加一5s施法前摇,GGWP。政策一出,群情激愤,于是官方针对我等穷sir,推出 “ Hosted by Coding Pages “免广告服务,就是在你的主页某个位置加上这个超链接文本或图片,审核通过既可去除。

文字版需要添加的代码如下:

1
<p>Hosted by <a href="https://pages.coding.me" style="font-weight: bold">Coding Pages</a></p>

我用的是 NEXT 主题,去修改它的源码,

/Users/……/……/themes/next/layout/_partials/footer.swig

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<div class="copyright" >
{% set current = date(Date.now(), "YYYY") %}
&copy; {% if theme.since and theme.since != current %} {{ theme.since }} - {% endif %}
<span itemprop="copyrightYear">{{ current }}</span>
<span class="with-love">
<i class="fa fa-{{ theme.authoricon }}"></i>
</span>
<span class="author" itemprop="copyrightHolder">{{ config.author }}</span>
</div>
{% if theme.copyright %}
<div class="powered-by">
{{ __('footer.powered', '<a class="theme-link" href="https://hexo.io">Hexo</a>') }}
</div>
<div class="theme-info">
{{ __('footer.codingPages') }}
<a href="https://pages.coding.me" style="font-weight: bold">Coding Pages</a>
</div>
{% endif %}

修改了最后一段 div 代码,其中footer.codingPages 是我定义的一个常量 “Hosted by” ,这样就改为我的博客底部的样式了。


日常废话

GitHub 是程序猿必备神器,通过它不仅能找到各种开源代码,还能快速搭建个人博客,具体教程可以看这 传送门。幸运的是,我们天朝子民访问 GitHub 还不受GFW限制,但毕竟它的老家在国外,访问速度自然有些拙计。如何提升 GitHub 博客的访问速度呢,一番搜索,学到几发新姿势。

各种姿势

  1. 迁移到国内平台

    将博客部署到国产代码托管平台,我用的是 Coding。实现步骤跟 GitHub 类似,可以参考 官方教程。 我在添加新的ssh公钥到 Coding 时,遇到了问题,请看 mac下管理多个ssh秘钥对。将代码部署到 Coding 上后,我们得到了一个新的域名,xxx.coding.me,修改一下博客根目录下的配置文件 _config.yml,在 deploy 项下添加 Coding对应的 repo,这样每次执行 hexo d 命令之后,博客内容就会分别部署到 GitHub 和 Coding 了。

  2. 绑定一个域名,实现双线访问

    如上文所说,迁移到国内平台后,我们又得到一个域名。但是对于同一个博客来说,没有必要,也不利于传播。所以我在万网上买了个域名,即 zhanghao.studio,通过设置域名解析,实现一个域名,双线访问。

    首先设置域名解析,下图是万网的域名管理界面:

    点击解析后进到编辑界面,万网的记录线路类型有很多,关于每种类型的介绍如下图:

    我用到的只有 CNAME 和 A 类型两种,前者的记录值是某一域名,后者记录值是 ip 地址。主机记录填www,会将 zhanghao.studio解析成www.zhanghao.studio;不填则显示为@,直接解析成zhanghao.studio。解析线路有很多,国内访问设置为默认,国外访问设置为海外。记录值是 GitHub 和 Coding 提供的域名,如下图。

    到这一步,我们完成了一半的设置,剩下一半的是去 GitHub 和 Coding 绑定你买的域名。

    Coding

    进到你托管博客代码的仓库,再进入 Pages 服务,即可看到如上所示界面。Coding 可以绑定5个自定义域名,而 GitHub只能绑定1个。

    GitHub

    绑定 GitHub 时需要注意,如果你想像我一样绑定顶级域名 xxx.com,而不加前缀 www,那么必须用 A 记录类型的,详情看 GitHub 官方教程

    至此,我们便实现了博客的双线访问,国内访问走 Coding Pages,国外走GitHub Pages。

  3. 利用 CDN

    内容分发网络Content delivery networkContent distribution network缩写CDN)是指一种通过互联网互相连接的电脑网络系统,利用最靠近每位用户的服务器,更快、更可靠地将音乐、图片、视频、应用程序及其他文件发送给用户,来提供高性能、可扩展性及低成本的网络内容传递给用户。

    对于 CDN ,我仅仅只是了解了一下,就不多讲了。优化思路来自 Next 主题的官方文档 进阶设定

0%