写在博客三周年

有的时候事情就是这么巧。比如这篇博文，并非专程为三周年而写，而是恰好在这个时间节点博客有了一些质的进步，值得记录一下。

引

翻修博客的起因源自写游记的需求，今年过年在泰国玩了十来天，想在博客上记录心得。一直拖到现在还未动笔，除了年后工作较忙外，也是考虑想给博客找一个合适的图床托管图片，毕竟游记涵盖大量照片，而目前图片都托管在 GitHub 上，访问速度得不到保障，时常还会被墙，非常影响阅读体验。此外偶尔也想过距离博客搭建之初已久，会不会在最新版本的博客框架中支持一些新的特性可以提升博客书写和访问的体验，例如支持视频、音乐播放等。

于是，在清明假期的第一天，我看了下本博客使用的 NexT 主题，发现都已经更新到第七个版本，支持不少新功能，如从 CDN 加载第三方库、支持 quicklink、代码可复制等等。翻着翻着，又突然好奇博客的创建时间，在 GitHub 上惊奇地发现第一次 commit 是在 2016.04.28，也就是说博客即将年满三岁！因此趁着假期，干脆把博客的技术框架升级，同时整理博文内容，作为三周年的纪念。

升级思路

关于博客是怎么搭建的，在最初建站时就写了一篇简单的文章，随后两年多的时间里还添加了评论功能、统计功能、小修小补了一些地方。照理说这类静态博客的核心就是文章，只要把文章挪到新的工程里，剩余工作主要就是配置框架。

因此首先更新 hexo 脚手架，用脚手架生成一个最新版的工程样例。对比现有博客的工程结构，把属于内容的部分抠出来放到新工程里，主要是 source 目录下的资料。接着对照旧版 _config.yml 文件，一点点把新的配置文件填好即可。这时候在本地把博客运行起来，应该要和线上运行的版本一模一样，毕竟主题没变。

接下来就要更新主题框架了。这里并没有按照官方推荐的方式去 git clone master 分支，而是出于稳定性考量从 releases 页面下载了最新版的 zip 包。考虑到之前可能魔改过一些主题的 layout 文件（这种做法显然不可取），而新版主题可能已经升级过一些样式细节，因此遵循新版主题的所有设计，只对照 _config.yml 文件重新配置，舍弃过去魔改的部分，未来哪里看着不顺眼再改进。

7.1.0 版本的 NexT 主题配置文件已达到一千两百多行，内容非常的丰富，把每一个配置过一遍也是学习博客功能的过程。就这么了解每一个配置的功能，确认当前博客是否配置过、如何配置的，然后决定在新版博客里要怎么配。通常依赖到 hexo 第三方库的功能，要额外通过 yarn add 安装；而主题自身支持的功能，函数库一般以 theme-next- 开头的，其实并不用把代码下载到指定的 source/js/ 目录下，因为配置已经支持 CDN 加载，非常的方便！

在配置博客的过程中，可以通过 hexo server 在本地起一个服务实时查看效果，有的配置也是通过这样的调试方式才了解其作用。完成配置后，本地生成静态资源，使用脚手架推送到 gh-pages 分支，最后进行线上验证。另外有些问题，如百度打点推送功能，也只有线上环境才能验证。

此外，在整个升级过程中，由于新增分类页、支持主页文章的预览、更换图床链接等，对博文内容也进行了一些相应的修改。后续时间充裕时还可以补充一些标签以便更好地发挥”相关热门文章”功能，甚至是给一些适合的文章添加合适的音乐 ;)

改善点

此次博客改版主要有以下更新：

• 顶部菜单加入了”招聘”菜单，是的微软中国正在招人喔！
• 为每篇博文添加 Creative Common 版权信息。选择 BY-ND 而非 BY-NC-ND 是考虑到如果我的博文能帮助别人赚到钱，那么何乐而不为呢；
• 将所有图片从 GitHub 迁移到了 OneDrive，后者的 CDN 极大提升了图片的可访问性与访问速度；
• 优化了一些 SEO 配置项
  • 更新了蜘蛛协议的 robots.txt 文件；
  • 向 Google 和百度提交了 sitemap.xml 文件；
  • 将文章链接缩短为 年份+文章名 的组合；
• 预加载页面内的链接内容，加速访问体验；
• 侧边栏
  • 社交媒体全部改为图标展示，新增邮箱链接；
  • 点击其他区域自动隐藏侧边栏；
  • 移动端文章页支持展示侧边栏；
• 博文
  • 首页支持博文预览；
  • Meta 信息添加了博文更新时间、分类以及预计阅读时长；
  • 代码区块支持复制；
  • 添加相关热门文章阅读推荐；
  • 添加打赏娱乐功能 XD；
  • 自动对文章内容进行空格处理；
• 优化搜索方案，从 Swifttype 切换为本地索引方式，搜索速度提升非常明显；
• 升级 Fancybox 版本，支持图片名称、查看文内所有图片等功能，浏览体验大大增强；
• 添加 pace 进度条，提升加载体验；
• 支持页面阅读位置保存。最早在微信公众号上体验到这个特性，对于阅读长文很有帮助；
• 隐藏标签菜单入口。考虑到目前已有大几十种标签，太多太杂，不如换成分类菜单。同时保留文章内的标签展示，作为二级入口可以查看某一标签的所有博文；
• 支持 Aplayer 音乐播放器。

2020.11.24 更新

没想到今天又更新了一版主题，将 NexT 主题升级到了 8.0.2 版。这次也非常偶然，原本准备写一篇关于机器学习入门的文章，里面需要使用到数学公式插件。其实原本 NexT 7.1.0 就有插件支持该功能，但我完全忘了这茬，一番 Google 后装了 hexo-math 插件，命令行报错发现它“Requires Hexo 5+”，再一看原本的 Hexo 还是 3.8.0 版，好家伙一下子差了两代，升！

主题升级带来的最大收益非黑暗模式莫属。其实去年做博客翻新工程期间，就恰好发现下一个小版本支持了黑暗模式，但当时尝试升级发现体验并不理想，小毛病不少，因此作罢。时隔一年半再次尝试，效果已经基本达到我的预期。其他方面，常规的升级依赖包括字体、修复 bugs、优化性能，还有一些小的 features 增删（不过未必在博客中启用），都可以在 NexT 的 Release Notes 中查看。

2024.02.24 更新

这次更新的契机来自Github Security Dependabot alerts，总共有56个问题，其中不乏数个Critical severity。那就刚好把Hexo、Next以及一众插件依赖都升到最新版看看能解决多少问题，剩下的再手动调整吧。

• 移除 Aplayer 插件，使用频率实在太低。
• 移除themes/next-x.x.x目录，改用NPM包。

尾巴

博客的升级花费大概两天的时间，一点点扣细节，既当产品又做技术，搞一个自嗨的项目，还是玩得非常开心。未来当然还是以输出文章为主，除了内容本身外，也试着丰富展现形式，达到一个比较舒服的阅读体验。最后关于博客的推广，其实在建站之初只想创造一个属于自己的空间，不过现在慢慢感受到，如果自己的文字能够帮助到更多人，是一件正能量满满的事情。

等到五周年时再看看又发生了哪些变化吧~