在网站上实施黑模式主题时,有很多考虑。我们有一个巨大的指南。那里有一些非常聪明的快速获胜,但是还有一些非常棘手的事情要做。这些棘手的事情之一是它不是在黑暗和光线之间“切换”的黑模式,而是您需要支持的三种模式:深色,光线和使用系统偏好。这类似于音频首选项在许多应用程序中的工作方式,这使您可以非常具体选择所需的音频输入或输出,或默认到系统偏好。
CSS和JavaScript可以通过偏爱颜色 - 旋转API处理系统偏好角度,但是如果用户偏好已更改,并且该偏好现在与用户偏好不同,那么您处于“不准确色彩主题的闪光灯”或“放屁”或“放屁”领域。好吧,这是一个嘲讽的首字母缩写词,但这可能是一个视觉上令人讨厌的问题,所以我要保留它。在同一脉络中,Fout(未风格的文本闪光)用于字体加载。
存储用户偏好意味着cookie,localstorage或某种数据库之类的内容。如果访问该数据意味着运行JavaScript,例如LocalStorage.getItem('color-Mode-preference');那么您在放屁区域,因为您的JavaScript很可能是在页面上的第一个渲染后运行的,否则您会不必要地延迟页面呈现页面。
您可以在页面渲染之前访问使用服务器端语言的cookie,这意味着您可以使用它来输出和样式的类型,并巧妙地避免了放屁,但这意味着甚至可以访问服务器端语言的站点(例如,jamstack站点不使用)。
allllll说,我赞赏罗伯·莫里森(Rob Morieson)关于黑暗模式的文章,因为它没有在这个重要问题上加以解决。非常具体地在Next.js中进行此操作,并使用localStorage,但是由于Next.js是JavaScript渲染的,因此您可以强迫它来检查用户保存的偏好,这是它的第一件事。这意味着它将第一次正确渲染(无闪光)。您确实必须关闭服务器端渲染才能正常工作,但是这是一个艰难的权衡。
我不相信没有服务器端语言或延误的页面渲染的好方法可以避免放屁。
以上是不准确的颜色主题(放屁)的闪光的详细内容。更多信息请关注PHP中文网其他相关文章!