博客静态化全纪录

用过 WordPress 的小伙伴都知道 WP 是出了名的重，要是不上缓存的话 TTFB 大概很难进到 100ms 之内，正好最近打算开始尝试一下国内的 Serverless 服务，就开了这个巨坑

从现有的 WordPress 转到 Hexo 主要需要干下面这几件事：

• 在 Hexo 找到自己喜欢的主题 / 移植现有主题
• 导入原文章
• 选择评论系统并导入评论
• Hexo 主体优化

那咱就一件一件说吧

移植现有主题

还是比较喜欢小影这个 WP 主题 C7V5 的，当时也是花了 99 买过来的，如果换个平台就换主题感觉有点小亏

移植后的主题主要将原来的 JS 全部重写了一遍，压缩后只用 10kb 左右，虽然相比起原版 4kb 还大了一些，但是现在代码就不要要任何的依赖 (jQuery) 都能运行了

CSS 目前还是完全照搬的原主题，但是看了下自动检测使用率也只有 60%出头，以后有空的话可能会考虑重写一遍 CSS 吧 (咕咕咕

(偷偷附上开发时候的 Twitter #1 #2

虽然不能开源但还是可以康康主题的结构哒:

用的是 Hexo 原生支持的 EJS 模板引擎，总的来说还是非常易用的 (偷偷吐槽一波 Hexo 的文档，很多东西都没有讲明白🤪

第一版测试的时候发现加上 AdSense 页面的 Load 时间会被大大延长，就算 script tag 上加 async 或者 defer 也没有用，所以就封装了一个骚函数来实现”全异步”加载统计及广告代码：

const loadScript = (url, cb, data = {}) => {
    let script = document.createElement('script');
    script.src = url;
    for (let i in data) script.dataset[i] = data[i];
    if (cb) script.onload = cb;
    script.async = true;
    let eles = document.getElementsByTagName('html')[0];
    eles.appendChild(script);
}

(虽然有点骚但是还是很有用的 (小声 (辩解

现在在疼讯 CDN 的加持下已经可以可以做到首屏全部资源 200ms 左右了，还是非常满意的，这个后面再讲

导入原文章

因为原来的文章本来就不是很多，再加上筛掉了一些质量捉急的文章，总共也就剩下十来篇文章，所以就用了全手动的方式来转换格式

在网上转了一圈发现提供的在线工具效果都不是很理想，而 Hexo 自带的迁移工具也感觉不是很好用，最后找到了个写作软件可以兼任这个工作，叫做 Typora，少数派有篇文章详细地介绍了这个软件，咱就不过多赘述了

转换的过程也非常简单，直接在网页上选中原来的文章然后 Copy Paste 一梭子就可以了，图片的话如果在设置里开启了自动保存也会帮你保存到文章属于的目录下

非要说一个缺点出来的话就是文档库不能根据文章的 Front-Matter 来排序，所以咱现在文档的命名都是以日期开头的，如下图：

选择评论系统并导入评论

既然是静态博客系统那肯定就不会有原生评论系统的嘛，本来准备就着苏卡卡的 DisqusJS 用 Disqus 来解决的，但一是考虑 Disqus 在国内被某神奇的东西拦住了，二是这玩意儿有点重，不上 Lazy Load 的话会灰常慢，然而最主要的原因是要登录 ((

咱期望的评论系统是像原生 WordPress 那种只用昵称、邮箱和内容就能留言的系统，但是转了一圈好像没看到类似的，于是就自己造轮子造了一个 Say-Anything，纯 JSON 数据库无 UI 界面，附带支持 reCAPTCHA 和邮件提醒，后续有空应该会加上 Akismet Anti-Spam。至于现在泥萌看到的 UI 是附在主题里的，样式还是照抄的原主题，头像 API 用的是 V2 的 CDN，不用 static.xiaolin.in 的主要原因是 One 这玩意儿咱大概又双叒叕要重构了 (毕竟黎明在年度简报里下了战书呢 (大雾

Hexo 主体优化

最后就是 Hexo 本身的优化啦

在萨摩的提议下用了 GitHub Action 进行持续集成然后上传到疼讯 COS 上面

压缩的话小霖自己写了个小轮子来将博客的所有图片压缩成 WebP 及 PNG，默认显示的是 WebP，如果 JS 脚本觉得浏览器不支持的话就会自动替换成 PNG 格式，开源在 Gist

然后就是记得加上 sitemap 插件，不然 Google 不收录就悲催了 (

(悄悄再来吐槽一波辣鸡疼讯云，都过了 9102 年了依然不能自动添加 Cache-Control 头，源站 COS 也不能自动加头，还得手动加

总结 (小声逼逼 (大雾

嘛半年没写文章了手感还是掉了很多，既然转到了静态博客那以后可能就真成长草博客了 ((

等疫情过去了估计学业也会开始紧张起来，毕竟耽误了差不多一个月的课程，所以大概就咕咕咕咕咕咕咕了?

那就这样吧 (溜球