如何閱讀和優化Javascript配置文件？

我有一個通過jQuery更新網格中數百行的過程。這需要太長的時間，所以我想弄清楚瓶頸在哪裏，所以我可以在那裏工作。我嘗試了Chrome的分析工具，但很難理解它（請參閱截圖）。我怎麼弄清楚自己和總體完全不同的是哪個問題？如何閱讀和優化Javascript配置文件？

2012-03-30 TruMan1

我們需要看看你是如何用代碼做的。一行一行地更新DOM 100的時間是不好的。 – epascarello 2012-03-30 19:29:30

我最初的問題是我不知道給代碼的瓶頸在哪裏。有成千上萬的代碼行，所以我希望在如何弄清楚從哪個區域獲取代碼片段方面有所幫助。 – TruMan1 2012-03-30 19:35:19

self是花了多少時間直接在該功能上進行工作。

total是花了多少時間在該函數中以及它所調用的函數中。

2012-03-30 19:29:47

http://stackoverflow.com/questions/7127671/difference-between-self-and-total-in-chrome-cpu-profile-of-js – 2012-03-30 19:30:03

這裏的瓶頸幾乎可以保證是DOM（瀏覽器內部的方法），而不是任何特定的JS代碼。

如果您顯示足夠的數據來更新它鎖定瀏覽器幾秒鐘，您應該考慮使用虛擬滾動網格來代替。我最喜歡的是SlickGrid。

不僅僅是渲染一個巨大的表格，而是將數據集存儲在更輕量級的內存JS對象中。（因此，可以對其進行修改和排序，比您當前正在執行的基於DOM的更新快一個數量級。）SlickGrid僅爲正在查看的表的部分呈現DOM元素，因此，瀏覽器。

您也可以一次選擇數據集的load small chunks（後端實現爲簡單分頁），使您能夠在瀏覽器中有效地顯示具有恆定性能的無限行。

2012-03-30 19:46:03 josh3736

回答