執行JavaScript「在後臺」

Question

您是否對以下問題有任何經驗：JavaScript必須運行數百次性能密集型函數調用，這些函數調用不能被忽略並導致瀏覽器感覺崩潰幾秒鐘（例如，不滾動和點擊）？例如：想象一下500次調用獲取元素高度，然後進行數百次DOM修改，例如設置類等 不幸的是，沒有辦法避免性能密集型任務。網絡工作者可能是一種方法，但他們得不到很好的支持（IE ......）。我正在考慮基於超時或回調的逐步呈現，讓瀏覽器有時間做些事情。你有什麼經驗可以分享嗎？

問候

Answer 1

這是我能在這種情況下建議：

1. 再次檢查代碼。嘗試按照建議應用一些標準優化，例如減少查找，使DOM修改脫機（例如，使用document.createDocumentFragment（）...）。使用DOM片段只能以有限的方式工作。檢索元素高度並執行復雜的格式化將不夠用。
2. 如果1.不能解決問題，請創建按需運行的渲染解決方案，例如由滾動事件觸發。或者：逐步渲染，讓瀏覽器有時間在兩者之間做些事情，例如點擊一個按鈕或滾動。

簡短的例子一步一步在2：

var elt = $(...); 
function timeConsumingRendering() { 

    // some rendering here related to the element "elt" 

    elt = elt.next(); 
    window.setTimeout((function(elt){ 
     return timeConsumingRendering; 
    })(elt)); 
} 
// start 
timeConsumingRendering(); 

Answer 2

看看這個話題，這是關係到你的問題的一些事情。

How to improve the performance of your java script in your page?

Answer 3

如果你做那麼多的DOM操作，你應該克隆問題或DOM本身的元素，做一個緩存版本的更改，然後更換整個婷一氣呵成或較大的部分，而不是當時的一個元素。

什麼需要時間不是很多的計算和功能等，但DOM操作本身，只做一次，或幾次在部分，將大大提高你在做什麼的速度。

據我所知網絡工作人員並不是真正用於DOM操作，我不認爲在使用它們方面會有很多優勢，因爲問題可能是您正在更改一個垃圾而不是在一批中將它們全部替換爲DOM。