墨码

关于本站

墨码是一个基于 Astro 构建的个人博客,用来记录 Web 开发过程中的学习与思考

「墨」取自中国传统文化中的水墨,代表书写与沉淀;「码」则代表代码与创造。两者结合,便有了墨码这个名字 —— 希望用文字记录代码,用代码承载想法。

为什么建立这个站点

最初搭建博客的原因其实很简单。

学习技术的过程中,经常会遇到很多零散的知识点。当时记录在笔记软件里,时间久了很难再次整理和回顾。于是便萌生了建立个人博客的想法,希望能够把学到的知识沉淀下来,用文章的形式重新梳理和表达。

写作的过程本身也是一次学习。当能够把一个知识点完整地讲清楚时,往往意味着自己已经真正理解了它。

视觉设计

墨码以中国传统水墨风格为设计灵感。

我一直希望技术博客不仅仅是信息的堆砌,也能够拥有自己的审美表达。因此在页面设计中加入了大量留白、宣纸纹理、印章元素以及中式排版的设计思路,希望在阅读技术内容时,也能保留一些东方美学的气息。

站内部分插画与装饰素材由 AI 辅助生成,并结合后期处理进行适配。

字体方面:

希望在保证阅读体验的同时,也保留一些独特的视觉辨识度。

主题与外观

为了满足不同用户的阅读习惯,本站提供了较高程度的外观自定义能力。访客可以根据自己的喜好组合出不同的阅读风格。

  • 深色模式与浅色模式切换
  • 多套主题配色方案
  • 页面背景切换
  • 纹理样式切换

内容归档

随着文章数量逐渐增加,仅依靠分页浏览会变得越来越低效。

因此本站提供了日历归档视图,以日历的形式展示所有文章,方便快速回顾过去的学习记录,也能直观看到博客的成长轨迹。

评论与交流

本站评论系统基于 Giscus 构建。评论数据存储于 GitHub Discussions 中,无需额外数据库即可实现完整的讨论功能。与此同时,我也对默认界面进行了样式重构,使其能够更好地融入站点整体设计风格。

如果文章中的内容存在错误、遗漏或有更好的实现方式,欢迎在评论区交流讨论。

技术栈

本站主要使用以下技术构建,在保证开发体验的同时,也尽可能追求页面性能与访问速度。

  • Astro
  • TypeScript
  • React
  • Tailwind CSS
  • GSAP
  • Giscus
  • Cloudflare Workers

关于性能

相比复杂的动态博客系统,我更偏向于静态优先的设计思路。

墨码采用 Astro 的 Island Architecture(孤岛架构)进行构建,大部分页面以静态 HTML 输出,仅在必要时加载客户端 JavaScript,从而减少资源消耗并提升首屏加载速度。

在部署层面,通过 Cloudflare 全球边缘网络进行分发,以获得更快的访问体验。

未来计划

目前仍有许多想法正在逐步实现:

  • 更完善的主题系统
  • 阅读统计与数据可视化
  • 文章关系图谱
  • 全文搜索优化
  • 更多中式视觉设计元素
  • 更丰富的交互动画

这个站点不会追求内容数量,而更希望持续积累有价值的内容。如果某篇文章恰好帮助到了你,那么它就已经完成了自己的意义。

感谢你的到来,也欢迎常来看看。

墨痕留声