feat(editor): harden photo editor security and interactions

static/js/editor/canvas-coords.js

@@ -8,8 +8,29 @@
  * @param {HTMLCanvasElement} canvas
  * @returns {{x: number, y: number}}
  */
+import { state } from './state.js';
+
+let _cachedCanvas = null;
+let _cachedRect = null;
+let _cachedRectTime = 0;
+
+export function invalidateCanvasCoordsCache() {
+  _cachedCanvas = null;
+  _cachedRect = null;
+  _cachedRectTime = 0;
+}
+
 export function canvasCoords(e, canvas) {
-  const rect = canvas.getBoundingClientRect();
+  const now = performance.now();
+  let rect;
+  if (_cachedCanvas === canvas && _cachedRect && (state.drawing || (now - _cachedRectTime < 64))) {
+    rect = _cachedRect;
+  } else {
+    rect = canvas.getBoundingClientRect();
+    _cachedCanvas = canvas;
+    _cachedRect = rect;
+    _cachedRectTime = now;
+  }
   const scaleX = canvas.width / rect.width;
   const scaleY = canvas.height / rect.height;
   const clientX = e.touches && e.touches.length ? e.touches[0].clientX : e.clientX;