Use willReadFrequently in 2D canvas contexts

Updated all calls to getContext('2d') to include the { willReadFrequently: true } option. This change improves performance for frequent pixel read operations, particularly for mask and image processing tasks.
This commit is contained in:
Dariusz L
2025-07-01 07:44:14 +02:00
parent cf10322101
commit 02bac6c624
5 changed files with 23 additions and 23 deletions

View File

@@ -293,7 +293,7 @@ export class CanvasState {
const clonedCanvas = document.createElement('canvas');
clonedCanvas.width = maskCanvas.width;
clonedCanvas.height = maskCanvas.height;
const clonedCtx = clonedCanvas.getContext('2d');
const clonedCtx = clonedCanvas.getContext('2d', { willReadFrequently: true });
clonedCtx.drawImage(maskCanvas, 0, 0);
this.maskUndoStack.push(clonedCanvas);
@@ -353,7 +353,7 @@ export class CanvasState {
if (this.maskUndoStack.length > 0) {
const prevState = this.maskUndoStack[this.maskUndoStack.length - 1];
const maskCanvas = this.canvas.maskTool.getMask();
const maskCtx = maskCanvas.getContext('2d');
const maskCtx = maskCanvas.getContext('2d', { willReadFrequently: true });
maskCtx.clearRect(0, 0, maskCanvas.width, maskCanvas.height);
maskCtx.drawImage(prevState, 0, 0);
@@ -369,7 +369,7 @@ export class CanvasState {
const nextState = this.maskRedoStack.pop();
this.maskUndoStack.push(nextState);
const maskCanvas = this.canvas.maskTool.getMask();
const maskCtx = maskCanvas.getContext('2d');
const maskCtx = maskCanvas.getContext('2d', { willReadFrequently: true });
maskCtx.clearRect(0, 0, maskCanvas.width, maskCanvas.height);
maskCtx.drawImage(nextState, 0, 0);