摘要:代碼及結果五次測試得出花括號聲明對象效率底下,別用它使用中括號聲明數組性能極好,千萬別用測試地址調用方式性能調用對象快還是數組快全局變量代碼及結果六次測試得出調用數組與對象并沒有大的性能差距。有可能最快的是另一種,也有可能差異不同。
這篇文章能用事實助你開發高性能網頁。
本文中所有的建議、結論均基于——
測試平臺:Chrome 55 on Windows 7
測試工具:jsPerf
作者有點標題黨,因為作者想不起來還有什么是需要性能測試的 想起來再更新
所以,就只有標題那三類。
此部分包含 【相鄰元素選取】、【選擇器選取】兩個性能測試
相鄰元素選取選擇那些非常親密的元素
預備 DOM全局變量
b=document.getElementById("b")代碼及結果
十二次測試得出:
我們應該使用 nextSibling, previousSibling 來選取之間沒有空格、換行符的親密元素
測試地址:Find Siblings
選擇器選取比較 Id, ClassName, TagName, querySelector 以及 querySelectorAll 五個選擇器
預備 DOM代碼及結果
五次測試得出:
Id 選擇器效率最高,實在不行再考慮 ClassName, TagName 或者 querySelector
測試地址:Native Seletors
對象與數組此部分包含【對象和數組共五種聲明方式】、【對象數組調用方式比較】的兩個性能測試
各聲明方式之間有 2 條 way 可以創造一個對象,3 條來創造一個數組。
代碼及結果五次測試得出:
花括號 {} 聲明對象效率底下,別用它
使用中括號 [] 聲明數組性能極好,千萬別用 new Array(1,2,3)
測試地址:Array and Object Declarations
調用方式性能調用對象快還是數組快?
全局變量b=document.getElementById("b")代碼及結果
六次測試得出:
調用數組與對象并沒有大的性能差距。如果一定要分個勝負,那么數組贏了。
測試地址:Array and Object Calls
綜合兩個測試——保存數據時,用不那么語義化的數組比對象好多了
各種循環此部分包含【循環語句】、【調用函數循環】的兩個性能測試
循環語句的性能較量強迫癥的作者很久前就想知道 - 到底哪種循環語句最牛B?
代碼 結果測試的前幾次,?。?!最牛掰的是這個:
for (var i=0;i然后,是這個:
for (var i=0,len=a.length;i=_=||| 作者傻了。提了個問題
有了結果:不同的瀏覽器、版本、作業系統都有可能有不同的結果。有可能最快的是另一種,也有可能差異不同。
—— eyesofkids這就是本測試的結果
測試地址:Loops
語句對函數這個測試結果很多人都知道。就不再搞了。
使用 For/While 比使用 調用函數 快得多
別人的測試地址:forEach vs loop
等更……謝謝閱讀!
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/81309.html
摘要:這樣優化后我們最多進行次判斷即可,大大提高了代碼的性能。表達式的值具有離散性, 個人博客,點擊查看目錄,喜歡可以關注一下. 1.從[]==![]為true來剖析JavaScript各種蛋疼的類型轉換 2.吹毛求疵的追求優雅高性能JavaScript 李小龍說過:天下武功,無堅不摧,唯快不破.(真的說過嗎?)我想說的是:世間網站,完美體驗,唯快不破.(這個我承認我說過.) showImg...
摘要:插入迭代器如前面兩條語句可以寫成使用直接量替換為替換為替換為如果要創建具有一些特性的一般對象,也可以使用字面量,如下前面的代碼可用對象字面量來改寫成這樣使用優化多次一旦需要更新請考慮使用文檔碎片來構建結構,然后再將其添加到現存的文檔中。 好贊,收藏自 總結的js性能優化方面的小知識(不喜勿噴) 前言 一直在學習javascript,也有看過《犀利開發Jquery內核詳解與實踐》,對...
摘要:循環方法方法不改變原數組方法會給原數組中的每個元素都按順序調用一次函數。篩選出過濾出數組中符合條件的項組成新數組代碼方法方法為數組中的每個元素執行一次函數,直到它找到一個使返回表示可轉換為布爾值的值的元素。 showImg(https://segmentfault.com/img/bV2QTD?w=1600&h=500); 前言 JavaScript 發展至今已經發展出多種數組的循環遍...
摘要:然后執行環境會創建一個活動對象,活動對象作為函數運行的變量對象,包含所有局部變量命名參數參數集合和,當執行環境銷毀,活動對象也被銷毀。 高性能JavaScript整理總結 關于前端性能優化:首先想到的是雅虎軍規34條然后最近看了《高性能JavaScript》大概的把書中提到大部分知識梳理了下并加上部分個人理解這本書有參考雅虎特別性能小組的研究成果,所以跟34 軍規有很多相似之處有不當之...
閱讀 3228·2021-11-15 11:37
閱讀 2449·2021-09-29 09:48
閱讀 3814·2021-09-22 15:55
閱讀 3014·2021-09-22 10:02
閱讀 2636·2021-08-25 09:40
閱讀 3225·2021-08-03 14:03
閱讀 1691·2019-08-29 13:11
閱讀 1570·2019-08-29 12:49