fix #1497: Avoid White Background during initial load

[cyfung1031]

测试方法： 打开 options.html, 打开 dev. Disable Cache. Ctrl F5 页面

1） 系统设白色，SC设黑色
2） 系统设白色，SC设自动
3） 系统设黑色，SC设白色
4） 系统设黑色，SC设自动

[cyfung1031]

走 sync 不走 defer.
确保不会有任何白闪黑闪问题

[CodFrm]

思路没问题，但是不需要单独的common.js吧，而且import了一下，各个html又引入了一下

[cyfung1031]

但是不需要单独的common.js吧

因为 rspack 的一般 import 都是 defer
目前只有共通css没有共通js

而且import了一下，各个html又引入了一下

这个我写错了。因为测试过 import 有 defer 改到 .html 里写后没删回
4231985 已修

[CodFrm]

我感觉在之前的AppContext中处理就好，甚至不需要处理，只需要加好对应的css就行 （我尝试验证一下）

[cyfung1031]

我感觉在之前的AppContext中处理就好，甚至不需要处理，只需要加好对应的css就行

AppContext 的载入很慢了。已经是 rspack 那些 module 跑完一大轮才到它.
#1497 他只考虑 白闪的话，当然加个 css 放到最初载入就行
如果你要考虑全面一点，就是这个 #1498 的做法

或者你完全不理 1497 直接关掉它

---

其实之前有人反映过 popup 弹出来要有什么动画的问题
也是因为 module 载入一堆后才到React，这个时间隔了一会儿

只有这个 common.js 放在 head 不 defer 才是真正在 body 载入阶段时已是把 dark 设定好
不然你怎么搞，dark 的判断还是慢

---

common.js 放在 head, 所以浏览器还未生成 body, 这个时候设 dark ，因此当浏览器要render body 时，就直接是 dark 了
如果你放在 AppContext 什么的，白body早就有了。

[CodFrm]

我感觉在之前的AppContext中处理就好，甚至不需要处理，只需要加好对应的css就行

AppContext 的载入很慢了。已经是 rspack 那些 module 跑完一大轮才到它. #1497 他只考虑 白闪的话，当然加个 css 放到最初载入就行 如果你要考虑全面一点，就是这个 #1498 的做法

我的想法是，因为这些都是同步进行的，没有microtask，所以再慢也不会有影响，我实验一下

---

看起来没问题 等一下，再验证一下

[cyfung1031]

@CodFrm 有这个吗？怎么我找不到。

[CodFrm]

AI瞎扯的，我再调整一下，不行我等下直接reset

[cyfung1031]

@CodFrm 应该问题出在这个吧

这个改成

  background-color: var(--body-background-color);
  color: var(--body-text-color);

就没事了

[cyfung1031]

或者你大刀阔斧把 body[arco-theme='dark'] 整合成 html.dark

[CodFrm]

我弄错了，忽略掉了defer，reset回去了，按你的来吧