早在我最初从 Ruhoh 迁移博客到 Hexo 时,我就有动手写一个本地的搜索引擎的想法。比起使用第三方服务的站内搜索,本地搜索引擎有几个好处:
- 更可靠。不用担心
由于某些显而易见的原因导致第三方服务不可访问。
- 速度更快。不管是 Google 还是 Swiftype ,第三方搜索服务的加载速度总是比较慢,影响浏览体验。
- 定制性更强。由于是自己写的插件,检索的具体策略、界面样式都可以自己定义,满足极客们 Bigger than Bigger 的需求。
这个想法起初是受了 Christian Fei 的 Simple Jekyll Search 启发。在了解了它的原理后,我认为在 Hexo 上实现一个本地搜索引擎并不复杂。大致的思路是:
- 写一个 generator ,生成站点所有文章的索引数据;
- 当在搜索框中输入关键词时,触发 Javascript 的特定函数,在这个索引数据里头检索包含该关键词的文章;
- 利用 jQuery 在页面中动态插入检索结果。
Read More
前言
在上篇文章中,我简单提到了在升级 Hexo 3 过程中遇到的一些痛苦。其实还有很多问题没有在上篇文章中提及。比如,我的渲染器使用的是 pandoc ,在 2.x 的时候,hexo-tag-plugins 里头的文字可以通过调用 renderSync
方法传给 markdown 进行渲染,而到了 3.0 ,这些文字无论怎么做都不能被 pandoc 或者 markdown 渲染。
早在我决定挥刀动斧定制我的个人博客之前,我早已经做好了发生这种情况的心理准备。我的博客最早是使用 Ruhoh 编写的,从主题到渲染器进行了大量的个人定制,后面出于种种原因我决定切换到Hexo ,于是我又花了很多力气把原来的博客移植到 Hexo 2.x 上。与其说是移植,不如说是一个基于 Hexo 2.x 的山寨版。现在 Hexo 一旦做了大幅更新,相当于我又得经历和前两次一样的折腾,实在是有心无力呀。考虑再三,我决定放弃使用 Hexo 3 ,而将我的博客所使用的环境 冻结
为 2.8.3 。
但这样又带来了问题:为了方便使用我的主题和插件的朋友们,我已经对这几个项目进行了升级以支持最新的 Hexo 3 。如果我只在我的机器上安装 Hexo 2.8.3 ,那我接下来维护这几个项目就变得非常不方便。
出于以上的原因,我决定使用 Docker 将 Hexo 2 和 Hexo 3 两套写作环境各自打包成镜像。这样,当我需要编写自己的博客时,就使用 Hexo 2 的镜像;当我需要维护几个 Hexo 主题和插件时,就使用 Hexo 3 的镜像。我也顺便将整个过程记录下来,形成此文,以供其他朋友参考借鉴。
Read More
Hexo 3 自从放出更新到现在已经有很长一段时间了,相信很多人跟我一样都经历了一个非常曲折的升级过程。
第一个问题是我所编写的主题和插件全都阵亡了,这个问题在我决定升级 Hexo 之前已经被很多用户轰炸过,于是我花了两个晚上的时间对所有的主题和插件进行了大幅修改和升级。
另一个让我无比郁闷的问题是:官方虽然宣称 3.0 之后站点渲染速度更快了,但实际测试时我发现结果正好相反——全站 168 篇文章,在 Hexo 2.8.3 环境中渲染只需 3~4 秒时间,而更新到 Hexo 3.0 之后,网站的渲染居然花了一个多钟!
为了找出导致这个问题的 bottleneck ,我通过二分的手段很快定位出了问题文章 《ArchLinux安装配置OpenGL》,这篇文章乍一看没啥特别之处,但问题就出在文中这段长长的目录结构图:
Read More
自从我将博客的主题 Freemind 开源了之后,我收到了很多朋友的来信,希望我也能把博客里的 Wiki 部分也开源。
当初没有将 Wiki 的部分放进博客,主要是考虑到主题的简单性。原来的主题包含了很多我个人的特殊定制,虽然自己用着方便,但对别人就不见得适用了。比如,由于我的博客有 post 和 wiki 两套主要的 layout,为了创建草稿的时候有所区分,原来的 hexo new
就不适用了,于是我都是用自己写的工具来创建草稿。再比如,由于是自己用的东西,也就无所谓代码的模块化,有些 hard-code 的地方要做到灵活可定制又得折腾一顿功夫,而且太多定制项又会增加用户的学习负担。考虑再三,我决定将 Wiki 部分去除,尽可能保证主题整体的简单和模块化。本来我开源了 Freemind 主题后也不打算再写其他主题了,但因为来信询问 Wiki 主题的朋友实在太多,于是也给了我动力编写第二个主题 Wixo 。
Read More
Freemind 是我为 Hexo 编写的一个开源主题。
特点
Freemind 和 HaHack 所用的主题的基本相似,特点在于:
- Bootstrap - 基于 Bootstrap 3.1.1 ;
- 标签插件 - 专门编写了一系列的 Bootstrap tag plugins ,以最大程度的发挥 Bootstrap 的威力。包括:
- textcolor - 插入一段带有特殊颜色标记的文本;
- button - 插入一个按钮,并允许为其指定超链接、文本及颜色;
- label - 插入一个标签,并为其指定文本和样式;
- badge - 插入一个徽章,并为其指定文本;
- alert - 插入一段警报文本信息,并为其指定样式。
- 本地搜索 - 自带一个 本地搜索引擎 ,基于我的另一个项目 hexo-generator-search ;
- 颜色主题 - 内置多套颜色主题。总有一套符合你的口味;
- 文章置顶 - 将重要文章置于首页顶部;
- 内置评论系统 - 内置的评论系统,基于我的另一个项目 comment.js 。
Read More