最初我没打算做暗色模式。

理由很简单——我觉得这是个”管理后台”,又不是用户产品,谁会盯着看那么久。

事实证明我盯着看的时间比谁都长。

凌晨两点调代码,白屏一打开整个人都精神了。不是干活的精神,是被刺到的精神。两天后我决定先把暗色加上。

加完之后才发现这事远比想象的麻烦。

第一个坑是刷新闪白。浏览器从加载到 JS 跑起来之间,会先用默认主题渲染一遍——光这一下就能晃你眼睛。后来我加了内联样式做兜底,刷新前先用 visibility:hidden 把页面藏起来,等主题确定再露出来。

第二个坑是跟随系统。Mac 的深色切换不是瞬间生效,他有过渡动画,过渡期间 prefers-color-scheme 媒体查询会有一两秒的不稳定。这段时间监听到的事件可能是错的。

第三个坑是闲鱼官网。你管理后台再黑,跑业务还得回闲鱼网页看消息——那一边只有亮色,两窗口跳来跳去眼睛非常累。后来我顺手用油猴写了一份闲鱼聊天页面的暗色样式,一并塞进了项目仓库。

写完一回头我才意识到——

暗色模式不是装饰功能。

它是只要你晚上还干活,就一定会自己用上的功能。