From 0c94f2db87f8dbff0c73293cc90fb06a9f0d59f1 Mon Sep 17 00:00:00 2001
From: yuetsh <517252939@qq.com>
Date: Tue, 3 Nov 2026 14:36:11 +0800
Subject: [PATCH] =?UTF-8?q?perf(=E6=9A=97=E8=89=B2):=20=E6=AF=8F=E6=AC=A1?=
 =?UTF-8?q?=E6=89=93=E5=BC=80=E9=A1=B5=E9=9D=A2=E4=B8=8D=E5=86=8D=E7=99=BD?=
 =?UTF-8?q?=E7=99=BD=E5=BC=BA=E5=88=B6=E9=87=8D=E7=AE=97=E4=B8=A4=E6=AC=A1?=
 =?UTF-8?q?=E6=95=B4=E9=A1=B5=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

上一版全站共用一个 useDark 之后，它一进页面仍要把 <html> 的 class 同步两遍，每遍都插
style + getComputedStyle 逼整页重算。class 已经对了就跳过，只有真要切换时才走原来那套。
CPU 降速 6 倍下每页省约 25ms；切换暗色、暗色下刷新、切回亮色都核过。

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 apps/web/src/shared/composables/dark.ts | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/apps/web/src/shared/composables/dark.ts b/apps/web/src/shared/composables/dark.ts
index 27d7c31..aaa7d6e 100644
--- a/apps/web/src/shared/composables/dark.ts
+++ b/apps/web/src/shared/composables/dark.ts
@@ -13,4 +13,13 @@ import { createGlobalState, useDark as useVueUseDark } from '@vueuse/core'
  * 切筛选再来 30 次，右栏换一条又是三四次。2026-11 实测（生产构建、CPU 降速 6 倍）首屏
  * 光这一处就占了 1.3 秒。全站共用一个之后只在第一次挂载时同步，后面的调用都是读同一个 ref。
  */
-export const useDark = createGlobalState(() => useVueUseDark())
+export const useDark = createGlobalState(() =>
+  useVueUseDark({
+    // 剩下的那一次（一进页面它还要同步两遍）也省掉：<html> 上的 class 已经对了就不动。
+    // 只有真要切换时才走它原来那套（关过渡 + 重算），切暗色不会有颜色慢慢渐变的过渡
+    onChanged(dark, defaultHandler, mode) {
+      if (document.documentElement.classList.contains('dark') === dark) return
+      defaultHandler(mode)
+    },
+  }),
+)