不正確な色のテーマのフラッシュ（おなら）

ウェブサイトにダークモードのテーマを実装する際に考えるべきことがたくさんあります。それには大きなガイドがあります。そこには非常に巧妙なクイック勝利がいくつかありますが、やるべきことは非常に難しいこともあります。これらのトリッキーなことの1つは、暗いモードと暗いモードの間の「トグル」ではなく、サポートする必要がある3つのモードという3つのモードであるということです。これは、多くのアプリでオーディオ設定がどのように機能するかに似ています。これにより、必要なオーディオ入力または出力を非常に具体的に選択できるか、システムの設定にデフォルトすることができます。

CSSとJavaScriptは、優先順位を介してシステム優先角度を処理できますが、ユーザーの好みが変更され、その好みがユーザーの好みとは異なる場合、「不正確な色のテーマのフラッシュ」またはおならの領域にいます。わかりました、それは雑誌の上の頭字語ですが、それは潜在的に非常に視覚的に不快な問題なので、私はそれを維持しています。 Fout（unstyled Textのフラッシュ）がフォントロード用であるのは同じ静脈です。

ユーザーの好みを保存することは、Cookie、LocalStorage、またはある種のデータベースのようなものを意味します。そのデータへのアクセスがJavaScriptを実行することを意味する場合、例：localStorage.getItem（ 'color-mode-preference'）;、あなたはおならの領域にいます。なぜなら、あなたのJavaScriptはページの最初のレンダリングを追いかけている可能性が非常に高いため、そうでなければページレンダリングを不必要に遅らせないでください。

ページレンダーの前にサーバー側の言語でクッキーにアクセスできます。つまり、それを使用してのようなものを出力し、それに応じてスタイルを整えます。

それは、この重要な問題をパントしなかったので、ダークモードに関するロブ・モリソンの記事に感謝していると言っています。 next.jsでこれを行うことについて非常に具体的に行い、LocalStorageを使用しますが、next.jsはJavaScriptレンダリングであるため、最初に行うこととしてユーザーが主張する選好を強制的に確認できます。つまり、初めて正しくレンダリングされます（フラッシュなし）。これが機能するためには、サーバー側のレンダリングをオフにする必要がありますが、これはひどいトレードオフです。

サーバー側の言語やフォースに遅れたページレンダリングなしでは、おならを避ける良い方法があると確信していません。

以上が不正確な色のテーマのフラッシュ（おなら）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。