github/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2026-08-01 10:56:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

⚡ downscale transition snapshot before encoding

Browse Source
This commit is contained in:
Elena Torro 2026-06-10 15:51:52 +02:00
parent 6622a4e9d4
commit b2aa00f0cb
1 changed files with 29 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
frontend/src/app/render_wasm/api/webgl.cljs
View File

@ -142,11 +142,16 @@ void main() {
(def ^:private SNAPSHOT_MIME "image/webp") (def ^:private SNAPSHOT_MIME "image/webp")
(def ^:private SNAPSHOT_QUALITY 0.6) (def ^:private SNAPSHOT_QUALITY 0.6)
(defn capture-canvas-snapshot-url ;; The snapshot is only shown heavily blurred, so it is downscaled to this max
"Captures the current viewport canvas as a WebP `blob:` URL and stores it in ;; side before encoding to keep the WebP encode cheap on big/high-DPI canvases.
`wasm/canvas-snapshot-url`. (def ^:private SNAPSHOT_MAX_DIM 1024)
Returns a promise resolving to the URL string (or nil)." (defonce ^:private snapshot-scratch-canvas
(delay (js/document.createElement "canvas")))
(defn capture-canvas-snapshot-url
"Captures the current viewport canvas as a downscaled WebP `blob:` URL and
stores it in `wasm/canvas-snapshot-url`. Returns a promise of the URL or nil."
[] []
(if-let [^js canvas wasm/canvas] (if-let [^js canvas wasm/canvas]
(p/create (p/create
@ -156,15 +161,26 @@ void main() {
(when (and (string? prev) (.startsWith ^js prev "blob:")) (when (and (string? prev) (.startsWith ^js prev "blob:"))
(js/URL.revokeObjectURL prev))) (js/URL.revokeObjectURL prev)))
(set! wasm/canvas-snapshot-url nil) (set! wasm/canvas-snapshot-url nil)
(.toBlob canvas (let [cw (.-width canvas)
(fn [^js blob] ch (.-height canvas)
(if blob ;; Cap the longest side to SNAPSHOT_MAX_DIM (never upscale).
(let [url (js/URL.createObjectURL blob)] scale (min 1.0 (/ SNAPSHOT_MAX_DIM (max 1 cw ch)))
(set! wasm/canvas-snapshot-url url) tw (max 1 (js/Math.round (* cw scale)))
(resolve url)) th (max 1 (js/Math.round (* ch scale)))
(resolve nil))) ^js sc @snapshot-scratch-canvas
SNAPSHOT_MIME ^js ctx (.getContext sc "2d")]
SNAPSHOT_QUALITY))) (set! (.-width sc) tw)
(set! (.-height sc) th)
(.drawImage ctx canvas 0 0 tw th)
(.toBlob sc
(fn [^js blob]
(if blob
(let [url (js/URL.createObjectURL blob)]
(set! wasm/canvas-snapshot-url url)
(resolve url))
(resolve nil)))
SNAPSHOT_MIME
SNAPSHOT_QUALITY))))
(p/resolved nil))) (p/resolved nil)))
(defn draw-thumbnail-to-canvas (defn draw-thumbnail-to-canvas