Profile Electron app memory usage, detect leaks, analyze renderer process memory, and optimize memory consumption
Profiles Electron app memory usage, detects leaks, analyzes renderer processes, and provides optimization recommendations.
npx claudepluginhub a5c-ai/babysitterThis skill is limited to using the following tools:
README.mdProfile Electron application memory usage, detect memory leaks, and analyze renderer process memory consumption. This skill provides tools and techniques for identifying memory issues and optimizing memory usage in Electron applications.
{
"type": "object",
"properties": {
"projectPath": {
"type": "string",
"description": "Path to the Electron project root"
},
"profilingMode": {
"enum": ["snapshot", "timeline", "leak-detection", "comparison"],
"default": "snapshot"
},
"targetProcess": {
"enum": ["main", "renderer", "all"],
"default": "all"
},
"duration": {
"type": "number",
"description": "Duration in seconds for timeline profiling",
"default": 60
},
"snapshotInterval": {
"type": "number",
"description": "Interval between snapshots in milliseconds",
"default": 5000
},
"generateReport": {
"type": "boolean",
"default": true
}
},
"required": ["projectPath"]
}
{
"type": "object",
"properties": {
"success": { "type": "boolean" },
"memoryProfile": {
"type": "object",
"properties": {
"mainProcess": {
"type": "object",
"properties": {
"heapUsed": { "type": "number" },
"heapTotal": { "type": "number" },
"external": { "type": "number" },
"rss": { "type": "number" }
}
},
"rendererProcesses": {
"type": "array",
"items": {
"type": "object",
"properties": {
"pid": { "type": "number" },
"heapUsed": { "type": "number" },
"domNodes": { "type": "number" },
"eventListeners": { "type": "number" }
}
}
}
}
},
"leaks": {
"type": "array",
"items": {
"type": "object",
"properties": {
"type": { "type": "string" },
"location": { "type": "string" },
"retainedSize": { "type": "number" },
"count": { "type": "number" }
}
}
},
"recommendations": {
"type": "array",
"items": { "type": "string" }
}
},
"required": ["success"]
}
// Generate heap snapshot in main process
const v8 = require('v8');
const fs = require('fs');
function takeHeapSnapshot(filename) {
const snapshotPath = `${filename}.heapsnapshot`;
const snapshotStream = v8.writeHeapSnapshot(snapshotPath);
console.log(`Heap snapshot written to: ${snapshotStream}`);
return snapshotStream;
}
// Monitor memory in main process
function getMemoryUsage() {
const usage = process.memoryUsage();
return {
heapUsed: Math.round(usage.heapUsed / 1024 / 1024),
heapTotal: Math.round(usage.heapTotal / 1024 / 1024),
external: Math.round(usage.external / 1024 / 1024),
rss: Math.round(usage.rss / 1024 / 1024)
};
}
// Monitor renderer memory via IPC
ipcMain.handle('memory:get-usage', (event) => {
const webContents = event.sender;
return webContents.executeJavaScript(`
({
jsHeapSizeLimit: performance.memory?.jsHeapSizeLimit,
totalJSHeapSize: performance.memory?.totalJSHeapSize,
usedJSHeapSize: performance.memory?.usedJSHeapSize
})
`);
});
// In preload script
const memoryAnalysis = {
getDOMNodeCount: () => document.getElementsByTagName('*').length,
getEventListenerCount: () => {
// Approximate - requires instrumentation
return window.__eventListenerCount || 0;
},
getDetachedNodes: () => {
// Requires DevTools Protocol
return [];
}
};
// BAD: Listener not removed
window.addEventListener('resize', handleResize);
// Component unmounts but listener remains
// GOOD: Proper cleanup
const controller = new AbortController();
window.addEventListener('resize', handleResize, { signal: controller.signal });
// On cleanup:
controller.abort();
// BAD: Accumulating listeners
ipcRenderer.on('data-update', (event, data) => {
updateUI(data);
});
// GOOD: Remove listeners on cleanup
const handler = (event, data) => updateUI(data);
ipcRenderer.on('data-update', handler);
// On cleanup:
ipcRenderer.removeListener('data-update', handler);
// BAD: Large object retained in closure
function createHandler(largeData) {
return () => {
console.log(largeData.someProperty); // largeData retained
};
}
// GOOD: Extract only needed data
function createHandler(largeData) {
const property = largeData.someProperty;
return () => {
console.log(property); // Only property retained
};
}
// BAD: Window reference retained
let windows = [];
function createWindow() {
const win = new BrowserWindow({...});
windows.push(win);
}
// GOOD: Clean up on close
function createWindow() {
const win = new BrowserWindow({...});
windows.push(win);
win.on('closed', () => {
windows = windows.filter(w => w !== win);
});
}
| Process | Idle Target | Warning | Critical |
|---|---|---|---|
| Main Process | < 50MB | 100MB | 200MB |
| Renderer (simple) | < 100MB | 200MB | 400MB |
| Renderer (complex) | < 200MB | 400MB | 800MB |
// Enable remote debugging
app.commandLine.appendSwitch('remote-debugging-port', '9222');
// Access via chrome://inspect or DevTools Memory panel
const { debugger } = webContents;
debugger.attach('1.3');
// Take heap snapshot
debugger.sendCommand('HeapProfiler.takeHeapSnapshot');
// Track allocations
debugger.sendCommand('HeapProfiler.startTrackingHeapObjects');
electron-ipc-security-audit - Check for IPC listener leakselectron-builder-config - Optimize bundle for memorystartup-time-profiler - Related performance optimizationelectron-architect - Architecture guidance for memory efficiencyperformance-test-engineer - Comprehensive performance testingActivates when the user asks about AI prompts, needs prompt templates, wants to search for prompts, or mentions prompts.chat. Use for discovering, retrieving, and improving prompts.
Search, retrieve, and install Agent Skills from the prompts.chat registry using MCP tools. Use when the user asks to find skills, browse skill catalogs, install a skill for Claude, or extend Claude's capabilities with reusable AI agent components.
This skill should be used when the user asks to "create an agent", "add an agent", "write a subagent", "agent frontmatter", "when to use description", "agent examples", "agent tools", "agent colors", "autonomous agent", or needs guidance on agent structure, system prompts, triggering conditions, or agent development best practices for Claude Code plugins.