Architecture#

页面和文章在构建时由 Astro 生成为静态 HTML。文章使用 Markdown 编写，并通过自定义的 Remark、Rehype 和 Expressive Code pipeline 处理代码块、数学公式、提示块、GitHub Card、图片和其他扩展内容。

网站只在需要交互的部分使用 Svelte，包括：

• Music Player
• Search
• Archive filters

页面导航由 Swup 负责。导航过程中只替换 route content，Topbar、Footer 和 Music Player 则保留在持久的 Shell 中，因此切换 页面时不需要整页刷新，正在播放的音乐也不会被重新加载。

全文搜索由 Pagefind 在静态构建完成后生成，不依赖单独的搜索服务器。

UI Migration#

2026 年，网站原有的 Fuwari 界面被逐步替换为现在的 Black Archive。

这次 migration 并不是重新制作整个网站，而是在保留原有 URL、Markdown 内容、搜索、Archive、RSS、Sitemap 和播放器状态的前 提下，替换全部可见 UI。

新的界面采用固定深色设计，以蓝黑作为外壳、米灰作为主要信息颜色，并只在焦点和活动状态中使用少量 cyan。页面由统一的 Shell、Plane、Band、Rail 和 Log Row 组成，通过规则线、排版和内容层级建立结构，而不是依赖圆角卡片和阴影。

迁移被拆分为 24 个阶段，依次处理：

• Design tokens、字体和背景系统
• Persistent Shell 与无刷新导航
• Home、Article 和 Archive 页面
• Markdown、代码、表格和图片
• Music Player、Search 和移动导航
• Accessibility、responsive layout 与 legacy cleanup

每个阶段都通过 Playwright 在多个 viewport 下验证，并检查直接加载、Swup 导航、Back/Forward、播放器连续性、键盘操作、 reduced motion、RSS 和 Sitemap 等行为。

最终结果仍然是一个静态网站，但拥有接近应用程序的导航和状态连续性。