Add image garbage collection to canvas

Introduced ImageReferenceManager to track and clean up unused images from the database and cache. Added manual garbage collection controls to the UI and exposed related stats and cleanup methods in Canvas. Updated db.js with a method to retrieve all image IDs for cleanup purposes.
This commit is contained in:
Dariusz L
2025-06-26 18:28:50 +02:00
parent dd6a9dfc85
commit 7d7076cc45
4 changed files with 354 additions and 0 deletions

View File

@@ -667,6 +667,27 @@ async function createCanvasWidget(node, widget, app) {
$el("div.painter-separator"),
$el("div.painter-button-group", {}, [
$el("button.painter-button", {
textContent: "Run GC",
title: "Run Garbage Collection to clean unused images",
style: {backgroundColor: "#4a7c59", borderColor: "#3a6c49"},
onclick: async () => {
try {
const stats = canvas.getGarbageCollectionStats();
log.info("GC Stats before cleanup:", stats);
await canvas.runGarbageCollection();
const newStats = canvas.getGarbageCollectionStats();
log.info("GC Stats after cleanup:", newStats);
alert(`Garbage collection completed!\nTracked images: ${newStats.trackedImages}\nTotal references: ${newStats.totalReferences}`);
} catch (e) {
log.error("Failed to run garbage collection:", e);
alert("Error running garbage collection. Check the console for details.");
}
}
}),
$el("button.painter-button", {
textContent: "Clear Cache",
style: {backgroundColor: "#c54747", borderColor: "#a53737"},
@@ -1002,6 +1023,11 @@ app.registerExtension({
document.body.removeChild(backdrop);
}
// Cleanup canvas resources including garbage collection
if (this.canvasWidget && this.canvasWidget.destroy) {
this.canvasWidget.destroy();
}
return onRemoved?.apply(this, arguments);
};