1. 程式人生 > >【Web效能測試】記憶體洩漏測試方法之chrome記憶體快照

【Web效能測試】記憶體洩漏測試方法之chrome記憶體快照

首先明確一下我們測試的目的:客戶端瀏覽器的js記憶體是否存在洩漏,伺服器端的話可不是這麼測,防止使用者使用時瀏覽器卡頓或崩潰。

F12開啟開發者工具,選中Memory頁簽下的Heap snapshot。

每次我們記錄快照前都要點選那個小垃圾桶,清一下快取,因為我們測記憶體洩漏是看記憶體的變化,而快照會連同記憶體和快取一起計算,我們請了快取後,錄的當然就剩內容佔用情況了。

在這裡插入圖片描述

測記憶體洩漏就是看我們做了一些操作前後記憶體的變化,比如我們在重複做查詢操作,每次操作後的快照都會增加幾兆或更多,這就說明可能是存在記憶體洩漏。
*注:你做不同的事,記憶體增長不一定是記憶體洩漏哦,他可能是正常的載入一些必要的東西佔用的記憶體而已。總之就是做這一種事只需要固定的那麼多記憶體,要是每次都新增加了一些記憶體,說明載入的東西重複了。可能是之前不用的記憶體沒釋放,或是新載入了一些沒用的記憶體。

對比快照查記憶體洩漏原因

至少需要兩個快照,選擇一個,選擇comparison對比兩個快照,對比誰呢,選擇要對比的,然後下面就會清楚的給出各種堆疊佔用、釋放和剩餘的情況,通過排序很容易找到問題,當然開發寫的,具體的是程式碼哪裡有問題需要他們來定位。
在這裡插入圖片描述

快速測試記憶體洩漏

每次我們都要做快照的話如果記憶體大的話快照是比較慢的,快照主要是開發來對比找問題用的,我們測試只需要發現問題就好了。版本較新的chrome瀏覽器有記憶體動態時時監控,就是在Profiles頁籤的最底下,前面的數就是,發現了嗎,跟我們做快照錄的值是一樣的,所以我們每次直接看這個值,手工記錄下就好了,是不是非常快呢!
*注:別忘了,每次記錄前都要點下垃圾桶清理下快取哦!
在這裡插入圖片描述


還有就是,喜歡我演示的chrome預設背景的可以看我的另一個部落格,輕鬆搞定哦!
https://blog.csdn.net/qq_38161040/article/details/83783964