2012-01-09 24 views
2

目前,我使用​​呈現WebGL內容,其運行速度(理想情況下)爲60 FPS。我還同時安排了一個「更新」過程,它使用setTimeout來處理AI,物理等等。我使用後者,因爲我實際上只需要每秒更新大約30次對象,而且這不是繪製序列的一部分。因爲我的大部分動畫都是相當硬件密集的,所以將實際渲染過程的剩餘CPU保存起來似乎是個不錯的主意。在JS/WebGL中調度更新「線程」

我的問題是最佳實踐之一。 setTimeoutsetInterval對電池壽命和CPU消耗並不特別,尤其是當瀏覽器不重點時。另一方面,使用​​(或直接將更新綁定到現有的呈現階段)可能會每秒執行比嚴格必要的更多更新,並且可能會在瀏覽器沒有對焦或瀏覽器其他時間完全停止更新認爲「動畫」是不必要的。

什麼是更新的最佳動作過程,但不是渲染的內容?

回答

3

的setTimeout和setInterval不是特別善待電池壽命和CPU消耗

坦率地說:也不是​​。區別在於,當您離開選項卡時,RAF會自動關閉。但是,如果使用Page Visibility API,則可以使用setTimeout來模擬該行爲,但實際上,如果智能地使用這兩者之間的功耗問題,它們的性能差不多。

除此之外,setTimeout\Interval非常適合您的情況。你可能想要知道的唯一的事情就是你很難完全與渲染循環同步。在動畫更新命中之前,您可能會出現過多次繪製的情況,這可能會導致輕微的口吃。如果你在60hz渲染並在30hz更新,這應該不是一個大問題,但你會想知道它。

如果完全保持與渲染循環同步對您很重要,您可以在您的RAF回調頂部簡單地有一個if(framecount % 2) { updateLogic(); },這將有效地限制您的更新爲30hz(每隔一幀),並且它始終與平局。

+0

謝謝!我認爲直接附加到渲染循環的唯一缺點是更新可能會在用戶切換選項卡時暫停,但現在我正在考慮更新,這可能是更好的結果(因爲如果他們切換了選項卡他們顯然無法像一位用戶那樣從更新中受益)。任何關鍵需要在後臺更新的東西都可以進入自己的時間間隔。 – sinisterchipmunk 2012-01-13 13:24:15