vue:內(nèi)存泄露詳解
什么是內(nèi)存泄露?內(nèi)存泄露是指new了一塊內(nèi)存,但無法被釋放或者被垃圾回收。new了一個對象之后 ,它申請占用了一塊堆內(nèi)存,當(dāng)把這個對象指針置為null時或者離開作用域?qū)е卤讳N毀,那么這塊內(nèi) 存沒有人引用它了在JS里面就會被自動垃圾回收。但是如果這個對象指針沒有被置為null,且代碼面 沒辦法再獲取到這個對象指針了,就會導(dǎo)致無法釋放掉它指向的內(nèi)存,也就是說發(fā)生了內(nèi)存泄露。 內(nèi)存泄漏(Memory Leak)是指程序中已動態(tài)分配的堆內(nèi)存由于某種原因程序未釋放或無法釋放,造 成系統(tǒng)內(nèi)存的浪費,導(dǎo)致程序運行速度減慢甚至系統(tǒng)崩潰等嚴(yán)重后果。 1、echarts圖未徹底刪除; 2、setTimeout和setInterval未清除; 3、全局定于變量未清除; 4、偵聽器未清除
場景分析

其中全局對象onresize,偵聽事件應(yīng)在組價銷毀前清除。

重點:在vue中,echarts繪圖是十分消耗資源的,所以在組件銷毀前,一定要清除對應(yīng)的數(shù)據(jù)。
在data中定義如下:

在銷毀組件前,應(yīng)進(jìn)行如下操作:


vue中1


vue中2



3keep-alive
一旦你使用了 keep-alive,那么你就可以訪問另外兩個生命周期鉤子:activated和 deactivated。如果你想要在一個 keep-alive 組件被移除的時候進(jìn)行清理或改變數(shù)據(jù),可以使用 deactivated 鉤子。
deactivated: function () {
// 移除任何你不想保留的數(shù)據(jù),或者銷毀可能產(chǎn)生內(nèi)存泄漏的地方
}
總結(jié)
本篇文章就到這里了,希望能夠給你帶來幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
Vue使用pdf-lib實現(xiàn)為文件流添加水印并預(yù)覽
這篇文章主要為大家詳細(xì)介紹了Vue如何使用pdf-lib實現(xiàn)為文件流添加水印并預(yù)覽的功能,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起了解一下2023-03-03
vue3+vant4實現(xiàn)pdf文件上傳與預(yù)覽組件
這篇文章主要介紹了vue3如何結(jié)合vant4實現(xiàn)簡單的pdf文件上傳與預(yù)覽組件,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2025-04-04

