Arkylin的小屋

root@arkylin

Arkylin的小屋

202608-10

主页标签栏留白修复:min-width 与溢出收缩的冲突

前阵子折腾主题(ark)的编辑器标签栏,发现固定在最左边的"主页"标签格外宽,右侧拖着一串空白,跟旁边的文章标签放一起很突兀。这篇记录定位与修改过程,以及为什么最后又回滚了。 现象:主页标签太长,一串空白 标签栏( )长这样:左边贴着一个固定不动的"主页"标签,后面是当前打开的文章标签。主页标签只有一个小图标加"主页"两个字,却占了整整 132px,右边一大片空白。 上排是修改前,下排是修改后(宽度贴着内容走)。视觉上就是"太长,有一堆空白" vs "刚好贴合"。 定位:132px 来自基础规则的 min-widt

202608-06

构建与部署的增量双双失灵:9 张图片和 1915 个文件背后的三个坑

连续跑两次 ,输出几乎一模一样: 两个"增量"全失灵了:postbuild 的图片缓存每次都有 9 张要重处理,OSS 部署则 1915 个文件一个不少全部重传。逐个排查,最后发现是三个互不相干的坑叠在一起:一个被静默吞掉的 Windows 文件锁错误、一个恒为假的 if 条件、一个非确定性的混淆器。完整记录一下。 坑 1:那 9 张图片为什么永远处理不完 postbuild 的图片缓存是内容寻址的:先算文件 md5,拿 去 里找处理好的成品,命中就 回 dist,否则重新压图加水印并存缓存。设计上,只要某张图成功

202608-06

Astro 构建再提速:把侧边栏从组件改成字符串生成器,13.4s → 6.9s

上一篇把构建从 31s 干到 13.4s 之后,剩余的大头就很明显了:每页都要重新渲染一遍 ~195KB 的侧边栏。这篇记录把侧边栏从 Astro 组件改成纯字符串生成器的过程——包括中途踩的两个坑(日期格式化居然要 14ms/页、Astro 的属性转义和文本转义规则不一样),以及如何用字节级 diff 保证输出零变化。最终 13.4s → 6.9s,侧边栏输出与改前逐字节一致。 现状:侧边栏是最后的成本大头 先量化。临时把 里的 注释掉,对比构建: 指标 优化前(13.4s) 去掉侧边栏后 --- --- ---

202608-06

静态站点文章加密实现详解:PBKDF2 + AES-256-GCM 全流程

本站最近上线了文章加密功能——给文章 frontmatter 加一个 字段,正文就会以密文形式发布,访客输入密码才能阅读。这篇把整个实现过程完整记录下来:加密算法的选择、构建期如何加密、浏览器端如何解密、以及配套的防泄露处理。 先说明一个重要前提:本站是纯静态站点(Astro 构建产物直接丢 OSS),没有任何服务端。所以加密只能在"构建时"做、解密只能在"浏览器端"做。这意味着它本质上是"防君子不防小人"的伪装加密——后面会专门讨论这个问题。 整体架构 关键点:dist 产物里永远没有明文。搜索引擎爬虫、RSS

202608-06

Astro 构建提速 2.3 倍:从构建日志里揪出 Intl.DateTimeFormat 的隐形开销

这两天给博客加了不少新文章,发现 越来越慢(31 秒)。盯着构建日志看,有个现象很蹊跷:带 前缀的跳转页生成飞快(+1ms),而 下一堆页面却要 50~130ms。本来以为是 aliases 跳转页拖慢的,查到最后发现——慢的根本不是 aliases,而是一个藏在日期格式化里的隐形开销。完整记录一下排查过程,顺便把 这个坑分享出来。 起因:先量化"慢" 站点结构大致是: - 里把 842 条旧链接别名配进 ,构建时生成静态跳转页; - 文章页由 生成; - 首页、分类、标签、归档、设置页等是常规列表页。 直接把构建

202608-06

全站滚动条改版:Butterfly 风格 5px 主题色细条

前阵子把文章按状态重组成 后,顺手整理主题(ark)的滚动条。这篇记录改版思路与最终方案。 问题:滚动条要么没有,要么很丑 改版前全站的滚动条状态其实很乱: 1. 文章页正文完全没有滚动条。正文的滚动容器 被设了 ,滚轮能用,但右边光秃秃的,完全没有视觉反馈; 2. 其他地方都是系统原生滚动条。侧边栏、代码块、终端、弹窗各自为政,Windows 上 Chrome 的原生灰条既粗又丑,和暗色主题格格不入; 3. tabline 的横向滚动条只有 3px、16% 透明度,几乎看不见。 需求很朴素:全站滚动条统一,藏进页

202608-05

资源管理器引导线与缩进布局:对齐、等比网格与紧凑/宽松开关

侧边栏资源管理器(文件树)的引导线一直有几处视觉问题:层级一变深引导线就断、线出现在目录行本身上、缩进层级忽宽忽窄。这篇记录这几轮的排查、修复思路与最终方案,以及新加的"紧凑/宽松资源管理器布局"设置开关。 问题清单 从用户视角看,引导线的问题可以归纳为五类: 1. 引导线被子目录中断。原本每行只画自己那一层深度的竖线,子目录一展开,父层级的竖线就在子目录行处断掉,树形连接不连续。 2. 引导线出现在目录行上。云端(带 🔒 的工作区根行)的下拉符号正下方多了一条线:没对准 chevron 的尖端,还压在了锁图标所

202608-05

侧边栏云端文件树改造记录:中文目录、分类树与 SPA 导航

WordPress 迁移到 Hugo 后,顺手把主题(ark)的侧边栏云端文件树整体重构了一遍。这篇记录改造的思路、结构与踩坑,方便日后维护。 需求来源 原本的侧边栏云端树只有"按分类分组的文章 + 散落的页面链接",分类和文件都是英文 slug,页面路径直接裸暴露(如 ),既不美观也不符合中文站点的使用习惯。改造目标是: 1. 目录全部中文化,文件树里显示文章标题而不是英文 slug 2. 结构分层:页面 / 归档 / 分类 / 标签 / 管理 五个一级目录 3. 分类、标签做成文件树,可配置显示哪些分类 4.

202608-05

WordPress 迁移 Hugo 全记录:Plan、工具、代码与流程

2026 年 8 月,我把自己的 WordPress 博客完整迁移到了 Hugo。这篇文章记录整个迁移的计划、工具、核心代码和流程,给以后做同类迁移留个参考。 背景与数据盘点 旧站是 1Panel 面板部署的 Docker WordPress,备份包里有: - (2.7MB,MySQL 全量导出,内容都在这里) - (370 个媒体文件) 先摸清家底(用 Python 解析 SQL 统计): 类型 数量 --- --- 文章 post(已发布) 211 文章 post(草稿) 12 文章 post(回收站) 9 文