angularjs效能優化

2021-09-13 09:28:28 字數 1054 閱讀 6806

學習angularjs有一段時間了,但是一直都沒有怎麼考慮過效能方面的問題,上次在研究過濾器的時候涉及到了效能問題。所以自己也總結了下常用的效能優化。

var unwatch = $scope.$watch('', function() 

});

我們都知道$watch有三個引數,第三個引數為true就是要深度監聽的。這個引數主要是在巢狀物件的時候會用到,但是要盡量避免使用,如果你只是想看看基本屬性的變化,那麼就不要使用第三個引數進行深度的監聽,這回大大拖慢每一次監聽的時間。

盡量使用ng-if,因為前者不僅會移除dom,還會移除相應的watch

ng-show只是簡單的隱藏,但其實已經載入完成。

$digest只會檢查當前scope以及其子scope

所以,但我們確定某個操作只會影響當前的scope,使用$digest會稍微提公升效能。

ng-repeat真是使用比較多的指令了,但是好像經常忽略track by

我們的ng-repeat經常就這麼寫:

ng-repeat="item in items"
但是如果這麼寫的話,當我們重新整理頁面的時候,它會刪除所有已有的dom,然後重新建立和渲染。但是如果我們加上track by就不同了:

ng-repeat="item in item track by item.id"
這樣angular就會復用已有的dom,然後更新變化的部分。這就減少了不必要的渲染。

我總結的還不是很全,都只是我常用到的。隨著更多的使用,理解也會更進一步的加深。

參考:

mysql效能優化 mysql效能優化

優化方式 1.空間換時間 冗餘 2.時間換空間 字段優先使用型別 int date char varchar text 索引型別 btree索引 hash索引 索引的葉子下,存放乙個資訊指向所在行的資料位址。btree有利於範圍查詢,hash有利於精確查詢。btree用的更多一些。btree索引的常...

Angularjs的 apply及其優化使用

error digest already in progress 上面是angularjs權威教程中的一句話。什麼意思呢?首先,你要清楚,在原生js或者第三方框架下,修改model,是有可能不會觸發檢視更新的,比如settimeout jquery外掛程式。為什麼?因為他們脫離了angularjs的...

效能優化 電量優化

使用battery historian來監測電量的情況,battery historian時google的乙個開源專案 具體安裝過程參見 當出現下列畫面,說明已經開啟 其開啟成功以後,訪問網頁如下所示 說明 這裡使用的是一台國外的vps伺服器,原本是想在本地虛擬機器實驗的,一直連線超時,就換成了vp...