问题标签 [fouc]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
fouc - 如何避免 Google 协作平台上出现无样式内容 (FOUC)
我在我的谷歌网站的 HTML 框中放置了一些自定义 HTML、CSS 和 jQuery。但随着页面加载，未格式化的内容会显示几秒钟，直到加载完成。尝试添加以下内容：
html { 可见性：隐藏；}
然后稍后在 jQuery 中重新打开它似乎无法在 Google 网站中工作。
有人有其他建议吗？
css - How to stop FOUC when using css loaded by webpack
I am getting FOUC when loading css inside of my entry point when using webpack. If I remove my css from being loaded by webpack and just include it in my html file as a normal link then the problem with FOUC goes away.
Note: This not just with bootstrap framework, I have tested with Foundation and Materialize with the same results
The code posted below is just a test example of my problem using Bootstrap.
Html code
bootstrap.js main entry point
webpack.config.js
html - 我有一个 DNN 网站，我想阻止 FOUC
问题：我有一个DNN网站，我想阻止FOUC。
我创建了一个Zurb Foundation皮肤，每次页面加载时都会出现一个无样式内容 ( FOUC ) 的 Flash，例如在几秒钟内显示所有下拉菜单的菜单。
经过多次搜索，我发现我只需要将这个类添加no-js到<html>标签中：
我的问题是我可以在 DNN 的哪个位置添加它？
我没有看到任何编辑<html>标签的选项
ruby-on-rails - Rails - 无样式内容的 Flash (FOUC)
我在页面侧面的顶部导航栏闪现，在页面之间。作为一名新程序员，我一直在寻找一个简单的解决方案，并尝试从如何使用 Ruby on Rails 消除 FOUC？进入我的 app/views/layouts/application.html.haml 文件，所以现在该文件的标题部分如下所示：
但这并没有解决问题。谁能让我走上正确的轨道？（在我的研究中，似乎其他解决方案因无法在所有情况下都有效而受到批评。）这确实破坏了一个原本很棒的项目 - 我希望有人能提供帮助！
编辑：FOUC 发生在 Chrome 上，但不在 MS-Edge 上。
performance - 使用 Atom 移除无样式内容 (FOUC) 的闪烁
我总是在我的 MacBook Pro 13" (i5) 上使用 Atom 时遇到烦人的 fouc，这让我回到了崇高的文本。我最近给自己买了一台全新的 MacBook Pro 15" (i7)。我仍然遇到同样的问题！
我能找到的只是这个线程：https ://github.com/atom/atom/issues/9561
我很惊讶成为唯一一个似乎经历过它的人。每个人都一样吗？有人有解决办法吗？这是一种可以禁用的优化吗？
它让我发疯！
javascript - 在呈现页面内容的其余部分之前加载 ui-view 内容
我有一个页眉和一个页脚，它们是纯 html 和一个 div，它们之间使用 ui-view 加载我的所有视图，所以它看起来像这样：
我的页面加载正常，我遇到的问题是，我的页脚在很短的时间内加载到我的内容之前并填满了整个页面。我尝试使用此线程中提到的 ng-cloak：AngularJS strategy to prevent flash-of-unstyled-content for a class
遗憾的是它似乎不起作用，有没有办法在我渲染页脚之前加载 ui-view 内容？
编辑：我的 ui-router 配置类似于：
login 指令呈现一个没有什么花哨的表单。
html - 在输入字段中使用“自动对焦”时，Firefox 中无样式内容 (FOUC) 的闪烁
实际上，这更像是一个错误描述而不是一个问题。
我在一个非常简单的登录页面上注意到 Firefox 中无样式内容 (FOUC) 的闪烁。没有使用图像。没有繁重的 CSS。所有 Javascript 都放在代码的末尾，就在结束 body 标记之前。但是当页面加载时，Firefox 显示一个完全没有样式的页面大约 100 毫秒，然后 css 生效。这种情况每次都会发生，无一例外。
偶然我发现了某种破解方法来解决这个问题：只需在 中添加一个<script>元素，在其中<head>放置您喜欢的任何 javascript 代码，甚至是一个简单的注释，然后 - bam！- 问题解决了。像这样：
FOUC 的实际原因似乎是在表单字段之一中使用了 autofocus 属性。因此，删除“自动对焦”也可以解决问题。
这不是很奇怪吗？
有谁知道比我更好的解决方案？
html - Shuffeled characters (possible fouc ?) Has anyone seen this before?
Recently I ran into a weird bug where characters get shuffled/mixed when the page is loaded, not everytime but once every few loads you will see it. Kindof like a fouc except it only goes away on reload. I was wondering if someone has ever seen something like this before and can explain to me why this happens and how to solve it or prevent it from happening. For so far I couldn't reproduce this error in any browser but the original samsung browser.
The first word in the image should be ' contact', second one 'inschrijven'.
HTML:
The only css used for just the text is
seo - 为什么不将 CSS 样式放在 HTML 正文中？
我已经看过这个主题并阅读过，对于 HTML5，将 CSS 样式放在 body 标记内是不好的（嵌入的；不是内联的）。我知道它可能会导致FOUC，并且它不会是“有效”的 HTML。
我在 ck 编辑器中的 CMS 中工作有很大的限制，我别无选择，只能嵌入 CSS 样式标签和规则或花费数天内联。样式应该是最小的，但仍然很荒谬。我正在覆盖已经样式化的内容。
这些页面都不会验证我是否这样做，并且闪存问题比目前存在的问题要小。
问题：有人可以准确解释（除了 FOUC 并且无效）为什么这样做是错误的？是 SEO 的问题吗？
angular - 服务器到客户端转换上的 Angular 通用样式 FOUC
我的通用应用程序有一个问题，当服务器端应用程序交换为客户端应用程序时，有一段时间没有为该页面路由组件的一部分的组件设置样式。这会导致页面正确加载，然后暂时显示无样式内容 (FOUC) 并且看起来很糟糕，然后再自行排序。
我的网站页眉和页脚组件的样式一直看起来很好，但是在元素内加载的<router-outlet>组件是那些没有正确样式的组件。
我正在使用Preboot来管理服务器 > 客户端转换，并且在标准配置之外不做任何事情。我已经尝试过使用@ngx-universal/state-transfer和@ngx-cache库，但我认为它们不是我需要的。
我正在使用延迟加载的路由，但我已经尝试删除这些路由并且错误是相同的。我也尝试{ initialNavigation: 'enabled' }在我的路由配置中进行设置。
我使用 webpack 构建我的服务器端应用程序，并使用 Angular CLI 构建客户端应用程序，主要基于这个项目，并且我使用 AOT 编译器。任何想法将不胜感激，谢谢！