Javascript間隔不足

我正在致力於一個主要針對手機和平板電腦的網站。我只是想問，是否有使用太多間隔的缺點？至於現在我用5000ms的1間隔得到並檢查當前時間和100ms的1間隔，以檢查設備的寬度是否改變（用於響應目的）Javascript間隔不足

我聽說我的老人說我們應該嘗試儘量少用這些間隔，這可能會造成一些漏洞和滯後等。這是真的嗎？

2012-10-31 LucVH

爲什麼不使用媒體查詢/ CSS來檢查寬度更改？會更快，更容易。如果您不能使用CSS，請監聽窗口的調整大小事件。 – m90

更新：
Check this page, and all linked articles of interest：網絡工作者，異步的事件和超時尤其

使用時間間隔的主要缺點在於，我所知道的所有當前JS實現都是單線程的。因此，如果您設置每100ms調用一次函數的間隔，並且每隔500ms調用一次函數，則間隔將不會同時執行。如果你很大程度上依賴於在第二個間隔內執行的代碼中返回的第一個間隔，那麼遲早你會遇到麻煩。

您可能會注意到的另一件事是間隔不是很準確。 100ms應該被看作〜100ms，並且毫無疑問，設置的間隔和實際間隔之間的差別可能相當大（100ms的間隔可以容易地高達150ms）。

底線，您的負責人是對的，儘量避免。但是，有時除了使用間隔外，別無選擇。在這種情況下，列出所有的時間間隔，尋找最小公分母，並設置一個使用了閉調用各種功能的一個大的區間時「他們的時代已經到來」

var allIntervals = (function() 
{ 
    var interval100MS = function(){}; 
    var interval200MS = function(){};//etc... 
    var timesCalled = 0; 
    var timer = setInterval(function() 
    { 
     if (++timesCalled%2) 
     { 
      return interval100MS(); 
     } 
     interval100MS(); 
     return interval200MS(); 
    },100); 
    return timer;//<-- expose so you can clear the interval, of course 
}());

可以擴展爲返回對象允許您設置額外的間隔，更換主間隔時間，取消設置一定的時間間隔等..

編輯
我忽視的是，您使用的是間隔的事實。這只是沒有必要：window.onresize或window.addEventListener('resize',handlerFunction,false);將做到這一點。在幕後，JS有一個事件循環/循環，比任何一種自制代碼更有效地處理事情。
人們經常說，最好的開發者實際上是懶惰的人：他們會經歷很多麻煩，只是爲了確定他們以前從未做過什麼。如果他們發現某些他們需要的東西，他們會使用它，而不是自己寫同樣的東西。

無論如何，我在我的答案的頂部添加了一個鏈接，我將第二次添加它here。檢查一下，尤其是網絡工作人員，如果你檢查時間可能會證明是有用的（不知道你在那裏如何/爲什麼/在做什麼）。

來源

2012-10-31 11:16:01

您設置了每X秒執行一次的任務。這些任務需要CPU時間並降低您網站的性能。當然取決於你在這些任務中做了什麼。但是如果你這樣做，即每1000ms而不是5000ms，你的性能就會降低。因此，選擇儘可能高的間隔時間總是更好。

如果你使用jQuery，您可以使用下面的代碼來檢查設備寬度的變化，這將使用更少的性能比你自己的間隔實現：

$(window).resize(function() { /* do something */ });

來源

2012-10-31 11:02:01 Tsunamis

你實際上並不需要jQuery。只需使用純DOM方法監聽事件，或者使用網站正在使用的任何其他庫，就可以做到這一點。 – Gijs

兩個受訪者在這裏有個好主意 - 瀏覽器可以告訴你什麼時候調整大小以避免不斷檢查和比較緩存的值，這將是非常糟糕的性能。但是，大四關於不必要的調用的爭論仍然是正確的，因爲許多瀏覽器在調整大小操作（特別是IE）期間不斷調整大小調整大小，這可能導致大量開銷。

減輕這些性能問題的兩個想法的組合是使用稱爲「節流」的技術來偵聽事件，但每隔一段時間只觸發一次響應。

有此這裏一個極好的插件： http://benalman.com/projects/jquery-throttle-debounce-plugin/

在我的腦海健康極限是每秒不超過6-7的呼叫，即僅允許最終功能運行一次每150毫秒（以下從@Tsunamis的回答）：

$(window).resize($.throttle(150, function(){ /* do something */ }));

來源

2012-10-31 11:13:30 Barney

Javascript間隔不足

回答

相關問題