定時器學習：利用定時器分解耗時任務案例

Nino 發布于2019-08-20 15:27 / 3134人閱讀

摘要：對于執行時間過長的腳本，有的瀏覽器會彈出警告，說頁面無響應。一個代碼塊長時間運行，將會導致其他任何任務都必須等待。而其他瀏覽器，比如上的瀏覽器，將默認終止運行時間超過秒鐘的腳本。利用定時器來分解任務，關鍵點有兩個。實際上每行耗時約左右。

對于執行時間過長的腳本，有的瀏覽器會彈出警告，說頁面無響應。有的瀏覽器會直接終止腳本。總而言之，瀏覽器不希望某一個代碼塊長時間處于運行狀態，因為js是單線程的。一個代碼塊長時間運行，將會導致其他任何任務都必須等待。從用戶體驗上來說，很有可能發生頁面渲染卡頓或者點擊事件無響應的狀態。

如果一段腳本的運行時間超過5秒，有些瀏覽器（比如Firefox和Opera）將彈出一個對話框警告用戶該腳本“無法響應”。而其他瀏覽器，比如iPhone上的瀏覽器，將默認終止運行時間超過5秒鐘的腳本。--《JavaScript忍者秘籍》

JavaScript忍者秘籍里有個很好的比喻：頁面上發生的各種事情就好像一群人在討論事情，如果有個人一直在說個不停，其他人肯定不樂意。我們希望有個裁判，定時的切換其他人來說話。

Js利用定時器來分解任務，關鍵點有兩個。

按什么維度去分解任務

任務的現場保存與現場恢復

例子

要求：動態創建一個表格，一共10000行，每行10個單元格

一次性創建

總共耗時180ms, 瀏覽器已經給出警告！[Violation] "setTimeout" handler took 53ms。

分批次動態創建

這次異步按批次創建，沒有耗時的警告。因為控制了每次代碼在50ms內運行。實際上每80行耗時約10ms左右。這就不會引起頁面卡頓等問題。

GPU云服務器云服務器任務定時器 linux定時器任務定時任務定時任務與觸發任務

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/82261.html

React16性能改善的原理一

摘要：接下來看下偽代碼調度算法偽代碼原來這段寫的匆忙且不好，重新更新了一篇講調度算法的大概實現性能改善的原理二。問題背景 React16 更新了底層架構，新架構主要解決更新節點過多時，頁碼卡頓的問題。譬如如下代碼，根據用戶輸入的文字生成10000行數據，用戶輸入框會出現卡頓現象。 class App extends React.Component { constructor( prop...

zhangqh 2019-08-23 15:21 評論0 收藏0
JS高級入門教程

摘要：解析首先簡稱是由歐洲計算機制造商協會制定的標準化腳本程序設計語言。級在年月份成為的提議，由核心與兩個模塊組成。通過引入統一方式載入和保存文檔和文檔驗證方法對進行進一步擴展。其中表示的標記位正好是低三位都是。但提案被拒絕了。 JS高級入門教程目錄本文章定位及介紹 JavaScript與ECMAScript的關系 DOM的本質及DOM級介紹 JS代碼特性基本類型與引用類型 JS的垃...

zsy888 2019-08-20 14:43 評論0 收藏0
JavaScript同步和異步

摘要：異步如果在函數返回的時候，調用者還不能購得到預期結果，而是將來通過一定的手段得到例如回調函數，這就是異步。的意思是，將回調函數立刻插入消息隊列，等待執行，而不是立即執行。大家好，我是wmingren，小伙伴們都知道JavaScript是單線程的語言，所謂的單線程呢就是指如果有多個任務就必須去排隊，前面任務執行完成后，后面任務再執行。到這里我們就產生了一個疑問，既然是單線程的，又怎么會...

Eirunye 2019-08-26 11:31 評論0 收藏0
前端性能優化之 JavaScript

摘要：大多數情況下，對一個直接量和一個局部變量數據訪問的性能差異是微不足道的。前端性能優化之 JavaScript 前言本文為《高性能 JavaScript》讀書筆記，是利用中午休息時間、下班時間以及周末整理出來的，此書雖有點老舊，但談論的性能優化話題是每位同學必須理解和掌握的，業務響應速度直接影響用戶體驗。一、加載和運行大多數瀏覽器使用單進程處理 UI 更新和 JavaScri...

Coding01 2019-08-23 18:10 評論0 收藏0
Javascript學習總結 - JS基礎系列三

摘要：案例每隔毫秒調用函數并顯示時間。當點擊按鈕時，停止時間代碼如下計時器每隔毫秒調用函數，并將返回值賦值給計時器計時器，在載入后延遲指定時間后去執行一次表達式僅執行一次。該值標識要取消的延遲執行代碼塊。簡述本系列將持續更新Javascript基礎部分的知識，誰都想掌握高端大氣的技術，但是我覺得沒有一個扎實的基礎，我認為一切高階技術對我來講都是過眼云煙，要成為一名及格的前端工程師，必須把...

zlyBear 2019-08-19 17:07 評論0 收藏0