Hexo 主题:Hezelitta

date
Apr 28, 2022
slug
hexe-theme-Hezelitta
status
Published
tags
代码
summary
最近将黑历史 Lightime 重新开发了一下,得到了这个主题。因为详细的使用说明可以在 GitHub 上看,所以这里也就不做说明。
type
Post
最近将黑历史 Lightime 重新开发了一下,得到了这个主题。因为详细的使用说明可以在 GitHub 上看,所以这里也就不做说明。

Why Hezelitta

这是 Hezelitta。(是二次元(o゜▽゜)o☆) 那为什么呢,因为都是蓝色的!
notion image

开发过程

主题相比前身 Lightime 主要还是优化了很多没有必要的东西。针对前端性能,用我基本为零的前端知识做了点小优化。
首先是比较重要的懒加载,本来是想和 InstantClick 一起上的,但是这东西真的难用,暴露了我 JS 技能为 0 的事实,放弃了。
后面选用了 Instant.Page,本质上就是创建一个 <link rel="prefetch"> 来进行预加载并缓存,之后进入页面会直接使用缓存的内容来达到一个加速的效果。和 Service Worker 搭配简直无敌。而且不会和任何JS冲突,很完美。不过这样的视觉观感会比 pjax 这些差一点,于是用了一个淡出淡入的 CSS 动画来补救,现在看起来也不错。
基本上所有 CSS 和 JS 都换成了异步加载。一些过程写在了《关于这几日对博客做的一些优化·壹》
又加入了友链页面,直接从卜卜口那里偷了份样式。(卜卜口的风格真的强)
文章内加入了 toc 目录,顺便吐槽一下 Hexo 的文档写的真的烂,我写这个主题遇到的 75% 的问题都无法通过看文档解决,全是去看类似主题的写法来解惑的。
关于谷歌统计插件,用了 SukkaW/cloudflare-workers-async-google-analytics
这几年深色模式也是完全普及了,我自己手机和电脑是全天深色模式的,现在看纯白色已经受不了了,被惯坏了。所以也顺便给主题加了个简单的深色模式,用的是 CSS 实现,没有设置开关切换。
highlight.js 支持的语言比较少,而且 hexo 新版貌似可以直接生成 prism.js 结构了,就换成了 prism.js。

好像没什么能说的了。Cesirdy/hexo-theme-Hezelitta

© Cesirdy 2022

粤ICP备2022045639号又拍云