使用vue渲染大量數據時應該怎么優化?


Object.freeze

適合一些 big data的業務場景。尤其是做管理后台的時候,經常會有一些超大數據量的 table,或者一個含有 n 多數據的圖表,這種數據量很大的東西使用起來最明顯的感受就是卡。但其實很多時候其實這些數據其實並不需要響應式變化,這時候你就可以使用 Object.freeze 方法了,它可以凍結一個對象(注意它不並是 vue 特有的 api)。

當你把一個普通的 JavaScript 對象傳給 Vue 實例的 data 選項,Vue 將遍歷此對象所有的屬性,並使用 Object.defineProperty 把這些屬性全部轉為 getter/setter,它們讓 Vue 能進行追蹤依賴,在屬性被訪問和修改時通知變化。

使用了 Object.freeze 之后,不僅可以減少 observer 的開銷,還能減少不少內存開銷。 使用方式:this.item = Object.freeze(Object.assign({}, this.item))


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM