程式設計代理可透過代理專用 Chrome 開發人員工具，分析及修正應用程式中的用戶端記憶體洩漏問題 (包括 JavaScript 和 WebAssembly)。透過自動收集及分析堆積快照，代理程式可以找出未正確進行垃圾收集的物件，並建議有針對性的程式碼重構。
在代理程式工作流程中，程式設計代理程式會擷取不同應用程式狀態的多個快照，並使用專用分析工具。
常見的記憶體流失模式
記憶體分析的重點在於找出常見的洩漏模式，包括：
- 未清除的事件監聽器：附加至全域物件 (例如
window或document) 的事件監聽器，會阻礙垃圾回收。 - 已卸離的 DOM 節點：從文件樹狀結構中移除，但仍由 JavaScript 變數參照的節點。
- 非預期的全域變數：未適當設定範圍的變數，會永遠留在記憶體中。
- 閉包：閉包會無意中保留對自身範圍內大型物件的參照。
- 無界資料結構：用於快取的資料結構，可無限擴充。
記憶體分析的注意事項
使用記憶體分析時，請注意下列事項：
請勿直接讀取原始快照：請勿讓代理程式直接讀取原始
.heapsnapshot檔案。這些檔案過大，超出內容限制。記憶體流失偵錯技能會明確指示代理程式避免讀取這些檔案。三張快照方法：為確保能可靠地找出記憶體洩漏問題，代理程式通常需要擷取三張快照：動作前的基準快照、動作後的目標快照，以及還原動作後的最終快照。請注意，部分動作 (例如由計時器 (
setTimeout) 或動畫 (requestAnimationFrame) 觸發的動作) 會在沒有使用者互動的情況下發生，可能不需要還原步驟。請注意，部分動作 (例如由計時器 (
setTimeout) 或動畫 (requestAnimationFrame) 觸發的動作) 會在沒有使用者互動的情況下發生，可能仍會增加記憶體用量。先驗證再修正：請務必檢查代理程式的發現，確保建議動作適用於應用程式邏輯且正確無誤。舉例來說，請先確認卸離的節點是否為有意建立的快取，再指示代理程式將參照設為空值。
記憶體流失分析的用途
指示代理程式在重複動作期間分析記憶體，包括計時器和使用者互動，而不是手動擷取快照並進行差異比較。透過這些工作流程，將記憶體分析整合到偵錯程序中。
注意：代理程式執行步驟是潛在行為的範例。代理程式的行為可能有所不同。
在導覽期間偵測未清除的事件監聽器
如果開發人員忘記在元件卸載後移除全域事件監聽器，單頁應用程式 (SPA) 通常會發生記憶體外洩問題。您可以指派代理程式，在不同檢視畫面之間導覽時，確認記憶體是否正確釋出。
提示詞範例：
Navigate from the home page to the dashboard and back to the home page. Use the take_heapsnapshot tool to check if we have any uncleared event listeners causing memory leaks.
代理程式執行範例：代理程式會在首頁擷取基準堆積快照，然後前往資訊主頁，再返回首頁擷取最終快照。接著，系統會使用內部分析工具評估快照，偵測到附加至 window 物件的 scroll 監聽器從未清除，並提供在元件的清除函式中呼叫 removeEventListener 的特定程式碼。
找出 UI 元件中卸離的 DOM 節點
如果從 DOM 移除模態視窗、下拉式選單和複雜的 UI 元件後，JavaScript 變數仍保留對這些元件的參照，這些元件通常會留下已卸載的 DOM 節點。
提示詞範例：
Open the user settings modal and close it 5 times. Analyze the heap snapshots and tell me if there are any detached DOM nodes left behind. If there are, ask me if they are intentional before writing a fix.
代理執行範例：代理會與設定模式互動，同時收集必要基準、目標和最終快照。分析結果顯示，有幾個不斷成長的物件標示為 Detached HTMLDivElement。代理會告知您發現的問題，並要求您確認是否要變更程式碼，將保存 DOM 參照的變數設為 null。
在持續互動中找出無界限的快取
如果基礎陣列或對映無限增長，沒有上限，無限捲動或持續擷取資料等功能可能會導致記憶體洩漏。
提示詞範例：
Scroll down the infinite feed list to load more items three times. Check if our LRU cache is unbounded and leaking memory, and suggest a fix.
服務專員執行範例：服務專員會分析捲動前後的記憶體狀態。這項規則會找出無意間擷取大型陣列的閉包，且該陣列會無限擴增。代理程式建議實作快取限制，或針對與物件生命週期相關聯的資料使用 WeakMap，以利進行適當的垃圾回收。
偵錯背景程序中的記憶體流失問題
動畫和背景計時器可能會在沒有使用者明確互動的情況下洩漏記憶體。您可以指示代理程式監控一段時間內的記憶體成長情況，找出這些程序的記憶體流失問題。
提示詞範例：
Explore this canvas application and monitor memory usage. Help me determine areas of improvement around reusing objects and textures.
代理程式執行範例：代理程式會探索畫布應用程式，並自動定期建立快照，監控一段時間內的記憶體用量。這項工具會分析堆積，並找出每個影格都會將新的 WebGL 網格推送到陣列，但不會收集前一個網格的垃圾，因此建議您重複使用物件來進行最佳化。