Firefox 3.5+中的無風格內容Flash（FOUC）

Question

爲了克服Firefox 3.5.x +中令人討厭和間歇性的FOUC，我們已經到達了我們繫繩的盡頭，我們正在開發一個新版本。

我們試過：

• 禁用Javascript語言，FF
• 進行開閉，
除去DOCTYPE
• 從@import移動額外的CSS來<link>
• 開關串接使用怪癖模式呈現
• 從concat中刪除CSS文件，一次一個
• 切換本地緩存關閉在Firefox
• 等

我們以前的版本從未表現出的任何FOUC問題，所以它的東西，我們所做的這個版本。目前爲止我們所做的更改包括：

• 在數據URI上使用Base64編碼圖像處理所有裝飾性圖像，通過CSS提供。
• 分離「framework'有關從特定頁面的CSS CSS文件和捆綁它們作爲兩個獨立的CSS文件

重現問題......使用Firefox 3.5.x的或3.6.x的，則：

1. 頭部到：http://my.publisher-subdomain.env.yola.net/
2. 登錄用戶名爲： 'stack@yola.com' 和密碼： '計算器'
3. 一旦登錄，您應當http://my.publisher-subdomain.env.yola.net/sites/
4. 單擊主導航欄中的帳戶鏈接。
5. 賬戶頁面應該加載，你應該看到一個FOUC。如果FOUC未出現，請清除緩存並重新加載頁面。

您的幫助將不勝感激！ :)

UPDATE：

的開發環境仍表現出FOUC，但只有Firefox是內存不足或有大量安裝的擴展。延遲和渲染速度肯定會影響FOUC的可見性。

Answer 1

我可能是錯的，但這可能是併發連接問題。根據我的Firebug的「網絡」選項卡

的HTML頁面只是需要花費大量的時間來加載 - 也許還因爲它是一個開發服務器上？ - 樣式表在HTML頁面之後被加載。

我不能聲稱完全理解這裏發生了什麼，但我會嘗試將樣式表放到不同的域中作爲第一個度量。這應該讓Firefox立即建立連接。

這可能是一個好主意，回到正常的圖像，而不是數據：URI - 這將減少樣式表的大小，並且data：URI在IE中不會工作< 8.

Answer 2

儘管這是一個非常古老的問題，但我在尋找解決相同問題的方法時發現了這個問題。所以，我想發佈解決方案以備將來參考。我只需要將引用移動到我的頭文件中需要位於外部JavaScript引用上方的CSS文件中。