Merge pull request #8134 from penpot/alotor-fix-plugins-export

🐛 Fix problem with export in plugins
✨ Use non-legacy config example on docker compose file
2026-01-20 12:20:16 -05:00 · 2026-01-20 15:03:04 +01:00 · 2026-01-20 13:25:55 +01:00 · 2026-01-20 12:26:55 +01:00 · 2026-01-20 12:26:39 +01:00 · 2026-01-20 12:26:39 +01:00
56 changed files with 1525 additions and 3314 deletions
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -29,7 +29,7 @@
 - Fix missing text color token from selected shapes in selected colors list [Taiga #12956](https://tree.taiga.io/project/penpot/issue/12956)
 - Fix dropdown option width in Guides columns dropdown [Taiga #12959](https://tree.taiga.io/project/penpot/issue/12959)
 - Fix typos on download modal [Taiga #12865](https://tree.taiga.io/project/penpot/issue/12865)
- Fix problem with text editor maintaining previous styles [Taiga #12835](https://tree.taiga.io/project/penpot/issue/12835)
+

 ## 2.12.1

--- a/common/src/app/common/files/helpers.cljc
+++ b/common/src/app/common/files/helpers.cljc
@@ -526,25 +526,20 @@
          ids))

 (defn clean-loops
-  "Clean a list of ids from circular references. Optimized fast-path for single selections."
+  "Clean a list of ids from circular references."
  [objects ids]
-  (if (<= (count ids) 1)
-    ;; For single selection, there can't be circularity; return as ordered-set.
-    (into (d/ordered-set) ids)
-    (let [ids-set (if (set? ids) ids (set ids))
-          parent-selected?
-          (fn [id]
-            ;; Stop early as soon as we find any selected parent
-            (let [parents (get-parent-ids objects id)]
-              (some #(contains? ids-set %) parents)))
+  (let [parent-selected?
+        (fn [id]
+          (let [parents (get-parent-ids objects id)]
+            (some ids parents)))

-          add-element
-          (fn [result id]
-            (cond-> result
-              (not (parent-selected? id))
-              (conj id)))]
+        add-element
+        (fn [result id]
+          (cond-> result
+            (not (parent-selected? id))
+            (conj id)))]

-      (reduce add-element (d/ordered-set) ids))))
+    (reduce add-element (d/ordered-set) ids)))

 (defn- indexed-shapes
  "Retrieves a vector with the indexes for each element in the layer
--- a/docker/images/docker-compose.yaml
+++ b/docker/images/docker-compose.yaml
@@ -152,9 +152,9 @@ services:

      # AWS_ACCESS_KEY_ID: <KEY_ID>
      # AWS_SECRET_ACCESS_KEY: <ACCESS_KEY>
-      # PENPOT_ASSETS_STORAGE_BACKEND: assets-s3
-      # PENPOT_STORAGE_ASSETS_S3_ENDPOINT: <ENDPOINT>
-      # PENPOT_STORAGE_ASSETS_S3_BUCKET: <BUKET_NAME>
+      # PENPOT_OBJECTS_STORAGE_BACKEND: s3
+      # PENPOT_OBJECTS_STORAGE_S3_ENDPOINT: <ENDPOINT>
+      # PENPOT_OBJECTS_STORAGE_S3_BUCKET: <BUKET_NAME>

      ## Telemetry. When enabled, a periodical process will send anonymous data about this
      ## instance. Telemetry data will enable us to learn how the application is used,
--- a/frontend/playwright/data/render-wasm/get-file-frame-nested-clipping.json
+++ b/frontend/playwright/data/render-wasm/get-file-frame-nested-clipping.json
--- a/frontend/playwright/ui/render-wasm-specs/shapes.spec.js-snapshots/Renders-a-file-with-nested-clipping-frames-1.png
+++ b/frontend/playwright/ui/render-wasm-specs/shapes.spec.js-snapshots/Renders-a-file-with-nested-clipping-frames-1.png
--- a/frontend/resources/templates/index.mustache
+++ b/frontend/resources/templates/index.mustache
@@ -17,17 +17,18 @@
    <meta name="twitter:site" content="@penpotapp">
    <meta name="twitter:creator" content="@penpotapp">
    <meta name="theme-color" content="#FFFFFF" media="(prefers-color-scheme: light)">
-    <link id="theme" href="css/main.css?version={{& version}}" rel="stylesheet" type="text/css" />
+    <link id="theme" href="css/main.css?version={{& version_tag}}" rel="stylesheet" type="text/css" />
    {{#isDebug}}
-    <link href="css/debug.css?version={{& version}}" rel="stylesheet" type="text/css" />
+    <link href="css/debug.css?version={{& version_tag}}" rel="stylesheet" type="text/css" />
    {{/isDebug}}

-    <link rel="icon" href="images/favicon.png" />
+    <link rel="icon" href="images/favicon.png?version={{& version_tag }}" />

    <script type="importmap">{{& manifest.importmap }}</script>

    <script type="module">
      globalThis.penpotVersion = "{{& version}}";
+      globalThis.penpotVersionTag = "{{& version_tag}}";
      globalThis.penpotBuildDate = "{{& build_date}}";
      globalThis.penpotWorkerURI = "{{& manifest.worker_main}}";
    </script>
--- a/frontend/resources/templates/rasterizer.mustache
+++ b/frontend/resources/templates/rasterizer.mustache
@@ -3,10 +3,11 @@
  <head>
    <meta charset="utf-8" />
    <title>Penpot - Rasterizer</title>
-    <link rel="icon" href="images/favicon.png" />
+    <link rel="icon" href="images/favicon.png?version={{& version_tag }}" />

    <script>
      globalThis.penpotVersion = "{{& version}}";
+      globalThis.penpotVersionTag = "{{& version_tag}}";
      globalThis.penpotBuildDate = "{{& build_date}}";
      globalThis.penpotWorkerURI = "{{& manifest.worker_main}}";
    </script>
--- a/frontend/resources/templates/render.mustache
+++ b/frontend/resources/templates/render.mustache
@@ -4,10 +4,12 @@
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge" />
    <title>Penpot - Render</title>
-    <link rel="icon" href="images/favicon.png" />
+
+    <link rel="icon" href="images/favicon.png?version={{& version_tag }}" />

    <script>
      globalThis.penpotVersion = "{{& version}}";
+      globalThis.penpotVersionTag = "{{& version_tag}}";
      globalThis.penpotBuildDate = "{{& build_date}}";
    </script>

--- a/frontend/resources/wasm-playground/clips.html
+++ b/frontend/resources/wasm-playground/clips.html
@@ -23,7 +23,7 @@
 <body>
  <canvas id="canvas"></canvas>
  <script type="module">
-    import initWasmModule from '/js/render-wasm.js';
+    import initWasmModule from '/js/render_wasm.js';
    import {
      init, addShapeSolidFill, assignCanvas, hexToU32ARGB, getRandomInt, getRandomColor,
      getRandomFloat, useShape, setShapeChildren, setupInteraction, addShapeSolidStrokeFill,
--- a/frontend/resources/wasm-playground/masks.html
+++ b/frontend/resources/wasm-playground/masks.html
@@ -23,7 +23,7 @@
 <body>
  <canvas id="canvas"></canvas>
  <script type="module">
-    import initWasmModule from '/js/render-wasm.js';
+    import initWasmModule from '/js/render_wasm.js';
    import {
      init, addShapeSolidFill, assignCanvas, hexToU32ARGB, getRandomInt, getRandomColor,
      getRandomFloat, useShape, setShapeChildren, setupInteraction, set_parent
--- a/frontend/resources/wasm-playground/paths.html
+++ b/frontend/resources/wasm-playground/paths.html
@@ -23,7 +23,7 @@
 <body>
  <canvas id="canvas"></canvas>
  <script type="module">
-    import initWasmModule from '/js/render-wasm.js';
+    import initWasmModule from '/js/render_wasm.js';
    import {
      init, addShapeSolidFill, assignCanvas, hexToU32ARGB, getRandomInt, getRandomColor,
      getRandomFloat, useShape, setShapeChildren, setupInteraction, set_parent, draw_star,
--- a/frontend/resources/wasm-playground/plus.html
+++ b/frontend/resources/wasm-playground/plus.html
@@ -23,7 +23,7 @@
 <body>
  <canvas id="canvas"></canvas>
  <script type="module">
-    import initWasmModule from '/js/render-wasm.js';
+    import initWasmModule from '/js/render_wasm.js';
    import {
      init, addShapeSolidFill, assignCanvas, hexToU32ARGB, getRandomInt, getRandomColor,
      getRandomFloat, useShape, setShapeChildren, setupInteraction, set_parent, allocBytes,
--- a/frontend/resources/wasm-playground/rects.html
+++ b/frontend/resources/wasm-playground/rects.html
@@ -23,7 +23,7 @@
 <body>
  <canvas id="canvas"></canvas>
  <script type="module">
-    import initWasmModule from '/js/render-wasm.js';
+    import initWasmModule from '/js/render_wasm.js';
    import {
      init, addShapeSolidFill, assignCanvas, hexToU32ARGB, getRandomInt, getRandomColor,
      getRandomFloat, useShape, setShapeChildren, setupInteraction, addShapeSolidStrokeFill
--- a/frontend/resources/wasm-playground/texts.html
+++ b/frontend/resources/wasm-playground/texts.html
@@ -23,7 +23,7 @@
 <body>
  <canvas id="canvas"></canvas>
  <script type="module">
-    import initWasmModule from '/js/render-wasm.js';
+    import initWasmModule from '/js/render_wasm.js';
    import {
      init, assignCanvas, setupInteraction, useShape, setShapeChildren, addTextShape, hexToU32ARGB,getRandomInt, getRandomColor, getRandomFloat, addShapeSolidFill, addShapeSolidStrokeFill
    } from './js/lib.js';
@@ -102,4 +102,4 @@
    });
  </script>
 </body>
-</html>
+</html>
--- a/frontend/scripts/_helpers.js
+++ b/frontend/scripts/_helpers.js
@@ -27,9 +27,11 @@ export function startWorker() {
  });
 }

-export const isDebug = process.env.NODE_ENV !== "production";
-export const CURRENT_VERSION = process.env.CURRENT_VERSION || "develop";
-export const BUILD_DATE = process.env.BUILD_DATE || "" + new Date();
+export const IS_DEBUG = process.env.NODE_ENV !== "production";
+export const BUILD_DATE = process.env.BUILD_DATE || (new Date().toString()) ;
+export const BUILD_TS = process.env.BUILD_TS || Date.now();
+export const VERSION = process.env.VERSION || "develop";
+export const VERSION_TAG = process.env.VERSION_TAG || VERSION;

 async function findFiles(basePath, predicate, options = {}) {
  predicate =
@@ -193,25 +195,25 @@ async function generateManifest() {
    render_main: "./js/render.js",
    rasterizer_main: "./js/rasterizer.js",

-    config: "./js/config.js?version=" + CURRENT_VERSION,
-    polyfills: "./js/polyfills.js?version=" + CURRENT_VERSION,
-    libs: "./js/libs.js?version=" + CURRENT_VERSION,
-    worker_main: "./js/worker/main.js?version=" + CURRENT_VERSION,
-    default_translations: "./js/translation.en.js?version=" + CURRENT_VERSION,
+    config: "./js/config.js?version=" + VERSION_TAG,
+    polyfills: "./js/polyfills.js?version=" + VERSION_TAG,
+    libs: "./js/libs.js?version=" + VERSION_TAG,
+    worker_main: "./js/worker/main.js?version=" + VERSION_TAG,
+    default_translations: "./js/translation.en.js?version=" + VERSION_TAG,

    importmap: JSON.stringify({
      "imports": {
-        "./js/shared.js": "./js/shared.js?version=" + CURRENT_VERSION,
-        "./js/main.js": "./js/main.js?version=" + CURRENT_VERSION,
-        "./js/render.js": "./js/render.js?version=" + CURRENT_VERSION,
-        "./js/render-wasm.js": "./js/render-wasm.js?version=" + CURRENT_VERSION,
-        "./js/rasterizer.js": "./js/rasterizer.js?version=" + CURRENT_VERSION,
-        "./js/main-dashboard.js": "./js/main-dashboard.js?version=" + CURRENT_VERSION,
-        "./js/main-auth.js": "./js/main-auth.js?version=" + CURRENT_VERSION,
-        "./js/main-viewer.js": "./js/main-viewer.js?version=" + CURRENT_VERSION,
-        "./js/main-settings.js": "./js/main-settings.js?version=" + CURRENT_VERSION,
-        "./js/main-workspace.js": "./js/main-workspace.js?version=" + CURRENT_VERSION,
-        "./js/util-highlight.js": "./js/util-highlight.js?version=" + CURRENT_VERSION
+        "./js/shared.js": "./js/shared.js?version=" + VERSION_TAG,
+        "./js/main.js": "./js/main.js?version=" + VERSION_TAG,
+        "./js/render.js": "./js/render.js?version=" + VERSION_TAG,
+        "./js/render-wasm.js": "./js/render-wasm.js?version=" + VERSION_TAG,
+        "./js/rasterizer.js": "./js/rasterizer.js?version=" + VERSION_TAG,
+        "./js/main-dashboard.js": "./js/main-dashboard.js?version=" + VERSION_TAG,
+        "./js/main-auth.js": "./js/main-auth.js?version=" + VERSION_TAG,
+        "./js/main-viewer.js": "./js/main-viewer.js?version=" + VERSION_TAG,
+        "./js/main-settings.js": "./js/main-settings.js?version=" + VERSION_TAG,
+        "./js/main-workspace.js": "./js/main-workspace.js?version=" + VERSION_TAG,
+        "./js/util-highlight.js": "./js/util-highlight.js?version=" + VERSION_TAG
      }
    })
  };
@@ -222,11 +224,12 @@ async function generateManifest() {
 async function renderTemplate(path, context = {}, partials = {}) {
  const content = await fs.readFile(path, { encoding: "utf-8" });

-  const ts = Math.floor(new Date());
-
  context = Object.assign({}, context, {
-    ts: ts,
-    isDebug,
+    isDebug: IS_DEBUG,
+    version: VERSION,
+    version_tag: VERSION_TAG,
+    build_date: BUILD_DATE,
+    build_ts: BUILD_TS,
  });

  return mustache.render(content, context, partials);
@@ -390,7 +393,6 @@ async function generateSvgSprites() {
 }

 async function generateTemplates() {
-  const isDebug = process.env.NODE_ENV !== "production";
  await fs.mkdir("./resources/public/", { recursive: true });

  const manifest = await generateManifest();
@@ -415,10 +417,7 @@ async function generateTemplates() {
  };

  const context = {
-    manifest: manifest,
-    version: CURRENT_VERSION,
-    build_date: BUILD_DATE,
-    isDebug,
+    manifest: manifest
  };

  content = await renderTemplate(
@@ -487,7 +486,7 @@ export async function compileStyles() {
  await fs.mkdir("./resources/public/css", { recursive: true });
  await fs.writeFile("./resources/public/css/main.css", result);

-  if (isDebug) {
+  if (IS_DEBUG) {
    let debugCSS = await compileSassDebug(worker);
    await fs.writeFile("./resources/public/css/debug.css", debugCSS);
  }
--- a/frontend/scripts/build
+++ b/frontend/scripts/build
@@ -2,26 +2,26 @@
 # NOTE: this script should be called from the parent directory to
 # properly work.

+set -ex
+
 export INCLUDE_STORYBOOK=${BUILD_STORYBOOK:-no};
 export INCLUDE_WASM=${BUILD_WASM:-yes};
-export CURRENT_VERSION=$1;
-export BUILD_DATE=$(date -R);
-export CURRENT_HASH=${CURRENT_HASH:-$(git rev-parse --short HEAD)};
 export EXTRA_PARAMS=$SHADOWCLJS_EXTRA_PARAMS;
-export TS=$(date +%s);
+
+export BUILD_DATE=$(date -R);
+export BUILD_TS=$(date +%s);
+
+export VERSION=${1:-develop};
+export VERSION_TAG="${VERSION}-${BUILD_TS}";

 # Some cljs reacts on this environment variable for define more
 # performant code on macros (example: rumext)
 export NODE_ENV=production;

-echo "Current path:"
-echo $PATH
-
-set -ex

 corepack enable;
 corepack install;
-yarn install || exit 1;
+yarn install;

 rm -rf target/dist;
 rm -rf resources/public;
@@ -37,7 +37,7 @@ yarn run build:app:main $EXTRA_PARAMS;
 yarn run build:app:libs;
 yarn run build:app:assets;

-sed -i "s/\.\/render.js/.\/render.js?version=$CURRENT_VERSION/g" resources/public/js/worker/main*.js
+sed -i "s/\.\/render.js/.\/render.js?version=$VERSION_TAG/g" resources/public/js/worker/main*.js

 rsync -avr resources/public/ target/dist/

--- a/frontend/scripts/build-storybook
+++ b/frontend/scripts/build-storybook
@@ -2,18 +2,16 @@
 # NOTE: this script should be called from the parent directory to
 # properly work.

-export CURRENT_VERSION=$1;
+set -ex
+
+export BUILD_TS=$(date +%s);
 export BUILD_DATE=$(date -R);
-export CURRENT_HASH=${CURRENT_HASH:-$(git rev-parse --short HEAD)};
-export TS=$(date +%s);
+
+export VERSION=${1:-develop};
+export VERSION_TAG="${VERSION}-${BUILD_TS}";

 export NODE_ENV=production;

-echo "Current path:"
-echo $PATH
-
-set -ex
-
 corepack enable;
 corepack install || exit 1;
 yarn install || exit 1;
--- a/frontend/shadow-cljs.edn
+++ b/frontend/shadow-cljs.edn
@@ -75,6 +75,7 @@
    {:fn-invoke-direct true
     :optimizations #shadow/env ["PENPOT_BUILD_OPTIMIZATIONS" :as :keyword :default :advanced]
     :source-map true
+     :pseudo-names true
     :elide-asserts true
     :anon-fn-naming-policy :off
     :cross-chunk-method-motion false
--- a/frontend/src/app/config.cljs
+++ b/frontend/src/app/config.cljs
@@ -95,6 +95,7 @@
 (def browser              (parse-browser))
 (def platform             (parse-platform))

+(def version-tag          (obj/get global "penpotVersionTag"))
 (def terms-of-service-uri (obj/get global "penpotTermsOfServiceURI"))
 (def privacy-policy-uri   (obj/get global "penpotPrivacyPolicyURI"))
 (def flex-help-uri        (obj/get global "penpotGridHelpURI" "https://help.penpot.app/user-guide/flexible-layouts/"))
@@ -190,9 +191,8 @@

 (defn resolve-href
  [resource]
-  (let [version (get version :full)
-        href    (-> public-uri
-                    (u/ensure-path-slash)
-                    (u/join resource)
-                    (get :path))]
-    (str href "?version=" version)))
+  (let [href (-> public-uri
+                 (u/ensure-path-slash)
+                 (u/join resource)
+                 (get :path))]
+    (str href "?version=" version-tag)))
--- a/frontend/src/app/main/data/event.cljs
+++ b/frontend/src/app/main/data/event.cljs
@@ -61,11 +61,6 @@
 ;; Def micro-benchmark iterations
 (def micro-benchmark-iterations 1e6)

-;; Performance logs
-(defonce ^:private longtask-observer* (atom nil))
-(defonce ^:private stall-timer* (atom nil))
-(defonce ^:private current-op* (atom nil))
-
 ;; --- CONTEXT

 (defn- collect-context
@@ -469,72 +464,3 @@
 (defn event
  [props]
  (ptk/data-event ::event props))
-
-;; --- DEVTOOLS PERF LOGGING
-
-(defn install-long-task-observer! []
-  (when (and (some? (.-PerformanceObserver js/window)) (nil? @longtask-observer*))
-    (let [observer (js/PerformanceObserver.
-                    (fn [list _]
-                      (doseq [entry (.getEntries list)]
-                        (let [dur (.-duration entry)
-                              start (.-startTime entry)
-                              attrib (.-attribution entry)
-                              attrib-count (when attrib (.-length attrib))
-                              first-attrib (when (and attrib-count (> attrib-count 0)) (aget attrib 0))
-                              attrib-name (when first-attrib (.-name first-attrib))
-                              attrib-ctype (when first-attrib (.-containerType first-attrib))
-                              attrib-cid (when first-attrib (.-containerId first-attrib))
-                              attrib-csrc (when first-attrib (.-containerSrc first-attrib))]
-
-                          (.warn js/console (str "[perf] long task " (Math/round dur) "ms at " (Math/round start) "ms"
-                                                 (when first-attrib
-                                                   (str " attrib:name=" attrib-name
-                                                        " ctype=" attrib-ctype
-                                                        " cid=" attrib-cid
-                                                        " csrc=" attrib-csrc))))))))]
-      (.observe observer #js{:entryTypes #js["longtask"]})
-      (reset! longtask-observer* observer))))
-
-(defn start-event-loop-stall-logger!
-  "Log event loop stalls by measuring setInterval drift.
-  interval-ms: base interval
-  threshold-ms: drift over which we report"
-  [interval-ms threshold-ms]
-  (when (nil? @stall-timer*)
-    (let [last (atom (.now js/performance))
-          id (js/setInterval
-              (fn []
-                (let [now (.now js/performance)
-                      expected (+ @last interval-ms)
-                      drift (- now expected)
-                      current-op @current-op*
-                      measures (.getEntriesByType js/performance "measure")
-                      mlen (.-length measures)
-                      last-measure (when (> mlen 0) (aget measures (dec mlen)))
-                      meas-name (when last-measure (.-name last-measure))
-                      meas-detail (when last-measure (.-detail last-measure))
-                      meas-count (when meas-detail (unchecked-get meas-detail "count"))]
-                  (reset! last now)
-                  (when (> drift threshold-ms)
-                    (.warn js/console
-                           (str "[perf] event loop stall: " (Math/round drift) "ms"
-                                (when current-op (str " op=" current-op))
-                                (when meas-name (str " last=" meas-name))
-                                (when meas-count (str " count=" meas-count)))))))
-              interval-ms)]
-      (reset! stall-timer* id))))
-
-(defn init!
-  "Install perf observers in dev builds. Safe to call multiple times."
-  []
-  (when ^boolean js/goog.DEBUG
-    (install-long-task-observer!)
-    (start-event-loop-stall-logger! 50 100)
-    ;; Expose simple API on window for manual control in devtools
-    (let [api #js {:reset (fn []
-                            (try
-                              (.clearMarks js/performance)
-                              (.clearMeasures js/performance)
-                              (catch :default _ nil)))}]
-      (aset js/window "PenpotPerf" api))))
--- a/frontend/src/app/main/data/workspace.cljs
+++ b/frontend/src/app/main/data/workspace.cljs
@@ -347,12 +347,6 @@
                                 (with-meta {:team-id team-id
                                             :file-id file-id}))))))

-              ;; Install dev perf observers once the workspace is ready
-              (->> stream
-                   (rx/filter (ptk/type? ::workspace-initialized))
-                   (rx/take 1)
-                   (rx/map (fn [_] (ev/init!))))
-
              (->> stream
                   (rx/filter (ptk/type? ::dps/persistence-notification))
                   (rx/take 1)
--- a/frontend/src/app/main/data/workspace/collapse.cljs
+++ b/frontend/src/app/main/data/workspace/collapse.cljs
@@ -18,13 +18,13 @@
    ptk/UpdateEvent
    (update [_ state]
      (let [expand-fn (fn [expanded]
-                        (let [parents-seqs (map (fn [x] (cfh/get-parent-ids objects x)) ids)
-                              flat-parents (apply concat parents-seqs)
-                              non-root-parents (remove #(= % uuid/zero) flat-parents)
-                              distinct-parents (into #{} non-root-parents)]
-                          (merge expanded
-                                 (into {}
-                                       (map (fn [id] {id true}) distinct-parents)))))]
+                        (merge expanded
+                               (->> ids
+                                    (map #(cfh/get-parent-ids objects %))
+                                    flatten
+                                    (remove #(= % uuid/zero))
+                                    (map (fn [id] {id true}))
+                                    (into {}))))]
        (update-in state [:workspace-local :expanded] expand-fn)))))


--- a/frontend/src/app/main/data/workspace/selection.cljs
+++ b/frontend/src/app/main/data/workspace/selection.cljs
@@ -264,13 +264,10 @@

    ptk/WatchEvent
    (watch [_ state _]
-      (let [objects (dsh/lookup-page-objects state)
-            ;; Schedule expanding parents asynchronously to avoid blocking
-            ;; the event loop
-            expand-s (->> (rx/of (dwc/expand-all-parents ids objects))
-                          (rx/observe-on :async))
-            interrupt-s (rx/of ::dwsp/interrupt)]
-        (rx/merge expand-s interrupt-s)))))
+      (let [objects (dsh/lookup-page-objects state)]
+        (rx/of
+         (dwc/expand-all-parents ids objects)
+         ::dwsp/interrupt)))))

 (defn select-all
  []
--- a/frontend/src/app/main/data/workspace/tokens/application.cljs
+++ b/frontend/src/app/main/data/workspace/tokens/application.cljs
@@ -27,10 +27,8 @@
   [app.main.data.workspace.colors :as wdc]
   [app.main.data.workspace.shape-layout :as dwsl]
   [app.main.data.workspace.shapes :as dwsh]
-   [app.main.data.workspace.texts :as dwt]
   [app.main.data.workspace.transforms :as dwtr]
   [app.main.data.workspace.undo :as dwu]
-   [app.main.features :as features]
   [app.main.fonts :as fonts]
   [app.main.store :as st]
   [app.util.i18n :refer [tr]]
@@ -302,20 +300,11 @@
        update-fn (fn [node _]
                    (-> node
                        (d/txt-merge txt-attrs)
-                        (cty/remove-typography-from-node)))
-        ;; Check if any attribute affects text layout (requires resize)
-        affects-layout? (some #(contains? txt-attrs %) [:font-size :font-family :font-weight :letter-spacing :line-height])]
-    (ptk/reify ::generate-text-shape-update
-      ptk/WatchEvent
-      (watch [_ state _]
-        (cond-> (rx/of (dwsh/update-shapes shape-ids
-                                           #(txt/update-text-content % update-node? update-fn nil)
-                                           {:ignore-touched true
-                                            :page-id page-id}))
-          (and affects-layout?
-               (features/active-feature? state "render-wasm/v1"))
-          (rx/merge
-           (rx/of (dwt/resize-wasm-text-all shape-ids))))))))
+                        (cty/remove-typography-from-node)))]
+    (dwsh/update-shapes shape-ids
+                        #(txt/update-text-content % update-node? update-fn nil)
+                        {:ignore-touched true
+                         :page-id page-id})))

 (defn update-line-height
  ([value shape-ids attributes] (update-line-height value shape-ids attributes nil))
@@ -364,17 +353,11 @@
                      (-> node
                          (d/txt-merge txt-attrs)
                          (cty/remove-typography-from-node))))]
-    (ptk/reify ::generate-font-family-text-shape-update
-      ptk/WatchEvent
-      (watch [_ state _]
-        (cond-> (rx/of (dwsh/update-shapes shape-ids
-                                           (fn [shape]
-                                             (txt/update-text-content shape update-node? #(update-fn %1 (ctst/font-weight-applied? shape)) nil))
-                                           {:ignore-touched true
-                                            :page-id page-id}))
-          (features/active-feature? state "render-wasm/v1")
-          (rx/merge
-           (rx/of (dwt/resize-wasm-text-all shape-ids))))))))
+    (dwsh/update-shapes shape-ids
+                        (fn [shape]
+                          (txt/update-text-content shape update-node? #(update-fn %1 (ctst/font-weight-applied? shape)) nil))
+                        {:ignore-touched true
+                         :page-id page-id})))

 (defn- create-font-family-text-attrs
  [value]
@@ -442,16 +425,10 @@
                      (-> node
                          (d/txt-merge txt-attrs)
                          (cty/remove-typography-from-node))))]
-    (ptk/reify ::generate-font-weight-text-shape-update
-      ptk/WatchEvent
-      (watch [_ state _]
-        (cond-> (rx/of (dwsh/update-shapes shape-ids
-                                           #(txt/update-text-content % update-node? update-fn nil)
-                                           {:ignore-touched true
-                                            :page-id page-id}))
-          (features/active-feature? state "render-wasm/v1")
-          (rx/merge
-           (rx/of (dwt/resize-wasm-text-all shape-ids))))))))
+    (dwsh/update-shapes shape-ids
+                        #(txt/update-text-content % update-node? update-fn nil)
+                        {:ignore-touched true
+                         :page-id page-id})))

 (defn update-font-weight
  ([value shape-ids attributes] (update-font-weight value shape-ids attributes nil))
--- a/frontend/src/app/main/refs.cljs
+++ b/frontend/src/app/main/refs.cljs
@@ -305,7 +305,7 @@
  (l/derived #(dsh/lookup-shape % page-id shape-id) st/state =))

 (def workspace-page-objects
-  (l/derived dsh/lookup-page-objects st/state identical?))
+  (l/derived dsh/lookup-page-objects st/state))

 (def workspace-read-only?
  (l/derived :read-only? workspace-global))
--- a/frontend/src/app/main/ui/ds/z-index.scss
+++ b/frontend/src/app/main/ui/ds/z-index.scss
@@ -10,7 +10,6 @@ $z-index-200: 200;
 $z-index-300: 300;
 $z-index-400: 400;
 $z-index-500: 500;
-$z-index-600: 600;

 :global(:root) {
  --z-index-auto: #{$z-index-auto}; // Index for elements such as workspace, rulers ...
@@ -19,5 +18,4 @@ $z-index-600: 600;
  --z-index-set: #{$z-index-300}; // Index for configuration elements like modals, color picker, grid edition elements
  --z-index-dropdown: #{$z-index-400}; // Index for dropdown like elements, selects, menus, dropdowns
  --z-index-notifications: #{$z-index-500}; // Index for notification
-  --z-index-loaders: #{$z-index-600}; // Index for loaders
 }
--- a/frontend/src/app/main/ui/forms.cljs
+++ b/frontend/src/app/main/ui/forms.cljs
@@ -52,7 +52,8 @@
  (let [form      (mf/use-ctx context)
        disabled? (or (and (some? form)
                           (or (not (:valid @form))
-                               (seq (:external-errors @form))))
+                               (seq (:async-errors @form))
+                               (seq (:extra-errors @form))))
                      (true? disabled))
        handle-key-down-save
        (mf/use-fn
--- a/frontend/src/app/main/ui/static.cljs
+++ b/frontend/src/app/main/ui/static.cljs
@@ -308,16 +308,6 @@
     [:div {:class (stl/css :sign-info)}
      [:button {:on-click on-click} (tr "labels.retry")]]]))

-(mf/defc webgl-context-lost*
-  []
-  (let [on-reload (mf/use-fn #(js/location.reload))]
-    [:> error-container* {}
-     [:div {:class (stl/css :main-message)} (tr "errors.webgl-context-lost.main-message")]
-     [:div {:class (stl/css :desc-message)} (tr "errors.webgl-context-lost.desc-message")]
-     [:div {:class (stl/css :buttons-container)}
-      [:> button* {:variant "primary" :on-click on-reload}
-       (tr "labels.reload-page")]]]))
-
 (defn- generate-report
  [data]
  (try
@@ -447,7 +437,6 @@
                       (rx/of default)
                       (rx/throw cause)))))))

-
 (mf/defc exception-section*
  {::mf/private true}
  [{:keys [data route] :as props}]
@@ -480,9 +469,6 @@
      :service-unavailable
      [:> service-unavailable*]

-      :webgl-context-lost
-      [:> webgl-context-lost*]
-
      [:> internal-error* props])))

 (mf/defc context-wrapper*
--- a/frontend/src/app/main/ui/workspace.cljs
+++ b/frontend/src/app/main/ui/workspace.cljs
@@ -217,10 +217,6 @@

        design-tokens?   (features/use-feature "design-tokens/v1")

-        wasm-renderer-enabled? (features/use-feature "render-wasm/v1")
-
-        first-frame-rendered?  (mf/use-state false)
-
        background-color (:background-color wglobal)]

    (mf/with-effect []
@@ -245,17 +241,6 @@
      (when (and file-loaded? (not page-id))
        (st/emit! (dcm/go-to-workspace :file-id file-id ::rt/replace true))))

-    (mf/with-effect [file-id page-id]
-      (reset! first-frame-rendered? false))
-
-    (mf/with-effect []
-      (let [handle-wasm-render
-            (fn [_]
-              (reset! first-frame-rendered? true))
-            listener-key (events/listen globals/document "penpot:wasm:render" handle-wasm-render)]
-        (fn []
-          (events/unlistenByKey listener-key))))
-
    [:> (mf/provider ctx/current-project-id) {:value project-id}
     [:> (mf/provider ctx/current-file-id) {:value file-id}
      [:> (mf/provider ctx/current-page-id) {:value page-id}
@@ -264,22 +249,15 @@
         [:> modal-container*]
         [:section {:class (stl/css :workspace)
                    :style {:background-color background-color
-                            :touch-action "none"
-                            :position "relative"}}
+                            :touch-action "none"}}
          [:> context-menu*]
-          (when (and file-loaded? page-id)
+          (if (and file-loaded? page-id)
            [:> workspace-inner*
             {:page-id page-id
              :file-id file-id
              :file file
              :wglobal wglobal
-              :layout layout}])
-          (when (or (not (and file-loaded? page-id))
-                    ;; in wasm renderer, extend the pixel loader until the first frame is rendered
-                    ;; but do not apply it when switching pages
-                    (and wasm-renderer-enabled?
-                         (not file-loaded?)
-                         (not @first-frame-rendered?)))
+              :layout layout}]
            [:> workspace-loader*])]]]]]]))

 (mf/defc workspace-page*
--- a/frontend/src/app/main/ui/workspace.scss
+++ b/frontend/src/app/main/ui/workspace.scss
@@ -20,13 +20,7 @@
 }

 .workspace-loader {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  z-index: var(--z-index-loaders);
-  background-color: var(--color-background-primary);
+  grid-area: viewport;
 }

 .workspace-content {
--- a/frontend/src/app/main/ui/workspace/sidebar/layer_item.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/layer_item.cljs
@@ -33,24 +33,9 @@
   [okulary.core :as l]
   [rumext.v2 :as mf]))

-;; Coalesce sidebar hover highlights to 1 frame to avoid long tasks
-(defonce ^:private sidebar-hover-queue (atom {:enter #{} :leave #{}}))
-(defonce ^:private sidebar-hover-pending? (atom false))
-
-(defn- schedule-sidebar-hover-flush []
-  (when (compare-and-set! sidebar-hover-pending? false true)
-    (ts/raf
-     (fn []
-       (let [{:keys [enter leave]} (swap! sidebar-hover-queue (constantly {:enter #{} :leave #{}}))]
-         (reset! sidebar-hover-pending? false)
-         (when (seq leave)
-           (apply st/emit! (map dw/dehighlight-shape leave)))
-         (when (seq enter)
-           (apply st/emit! (map dw/highlight-shape enter))))))))
-
 (mf/defc layer-item-inner
  {::mf/wrap-props false}
-  [{:keys [item depth parent-size name-ref children ref style
+  [{:keys [item depth parent-size name-ref children ref
           ;; Flags
           read-only? highlighted? selected? component-tree?
           filtered? expanded? dnd-over? dnd-over-top? dnd-over-bot? hide-toggle?
@@ -97,8 +82,7 @@
                    :dnd-over dnd-over?
                    :dnd-over-top dnd-over-top?
                    :dnd-over-bot dnd-over-bot?
-                    :root-board parent-board?)
-            :style style}
+                    :root-board parent-board?)}
      [:span {:class (stl/css-case
                      :tab-indentation true
                      :filtered filtered?)
@@ -182,12 +166,10 @@

     children]))

-;; Memoized for performance
 (mf/defc layer-item
  {::mf/props :obj
-   ::mf/wrap [mf/memo]}
-  [{:keys [index item selected objects sortable? filtered? depth parent-size component-child? highlighted style render-children?]
-    :or {render-children? true}}]
+   ::mf/memo true}
+  [{:keys [index item selected objects sortable? filtered? depth parent-size component-child? highlighted]}]
  (let [id                (:id item)
        blocked?          (:blocked item)
        hidden?           (:hidden item)
@@ -264,21 +246,13 @@
        (mf/use-fn
         (mf/deps id)
         (fn [_]
-           (swap! sidebar-hover-queue (fn [{:keys [enter leave] :as q}]
-                                        (-> q
-                                            (assoc :enter (conj enter id))
-                                            (assoc :leave (disj leave id)))))
-           (schedule-sidebar-hover-flush)))
+           (st/emit! (dw/highlight-shape id))))

        on-pointer-leave
        (mf/use-fn
         (mf/deps id)
         (fn [_]
-           (swap! sidebar-hover-queue (fn [{:keys [enter leave] :as q}]
-                                        (-> q
-                                            (assoc :enter (disj enter id))
-                                            (assoc :leave (conj leave id)))))
-           (schedule-sidebar-hover-flush)))
+           (st/emit! (dw/dehighlight-shape id))))

        on-context-menu
        (mf/use-fn
@@ -364,18 +338,14 @@
        component-tree? (or component-child? (ctk/instance-root? item) (ctk/instance-head? item))

        enable-drag      (mf/use-fn #(reset! drag-disabled* false))
-        disable-drag     (mf/use-fn #(reset! drag-disabled* true))
-
-        ;; Lazy loading of child elements via IntersectionObserver
-        children-count*  (mf/use-state 0)
-        children-count   (deref children-count*)
-        lazy-ref         (mf/use-ref nil)
-        observer-var     (mf/use-var nil)
-        chunk-size       50]
+        disable-drag     (mf/use-fn #(reset! drag-disabled* true))]

    (mf/with-effect [selected? selected]
      (let [single? (= (count selected) 1)
            node (mf/ref-val ref)
+            ;; NOTE: Neither get-parent-at nor get-parent-with-selector
+            ;; work if the component template changes, so we need to
+            ;; seek for an alternate solution. Maybe use-context?
            scroll-node (dom/get-parent-with-data node "scroll-container")
            parent-node (dom/get-parent-at node 2)
            first-child-node (dom/get-first-child parent-node)
@@ -393,61 +363,6 @@
        #(when (some? subid)
           (rx/dispose! subid))))

-    ;; Setup scroll-driven lazy loading when expanded
-    ;; and ensures selected children are loaded immediately
-    (mf/with-effect [expanded? (:shapes item) selected]
-      (let [shapes-vec (:shapes item)
-            total (count shapes-vec)]
-        (if expanded?
-          (let [;; Children are rendered in reverse order, so index 0 in render = last in shapes-vec
-                ;; Find if any selected id is a direct child and get its render index
-                selected-child-render-idx
-                (when (and (> total chunk-size) (seq selected))
-                  (let [shapes-reversed (vec (reverse shapes-vec))]
-                    (some (fn [sel-id]
-                            (let [idx (.indexOf shapes-reversed sel-id)]
-                              (when (>= idx 0) idx)))
-                          selected)))
-                ;; Load at least enough to include the selected child plus extra
-                ;; for context (so it can be centered in the scroll view)
-                min-count (if selected-child-render-idx
-                            (+ selected-child-render-idx chunk-size)
-                            chunk-size)
-                current @children-count*
-                new-count (min total (max current chunk-size min-count))]
-            (reset! children-count* new-count))
-          (reset! children-count* 0)))
-      (fn []
-        (when-let [obs ^js @observer-var]
-          (.disconnect obs)
-          (reset! observer-var nil))))
-
-    ;; Re-observe sentinel whenever children-count changes (sentinel moves)
-    (mf/with-effect [children-count expanded?]
-      (let [total (count (:shapes item))
-            node (mf/ref-val ref)
-            scroll-node (dom/get-parent-with-data node "scroll-container")
-            lazy-node (mf/ref-val lazy-ref)]
-        ;; Disconnect previous observer
-        (when-let [obs ^js @observer-var]
-          (.disconnect obs)
-          (reset! observer-var nil))
-        ;; Setup new observer if there are more children to load
-        (when (and expanded?
-                   (< children-count total)
-                   scroll-node
-                   lazy-node)
-          (let [cb (fn [entries]
-                     (when (and (seq entries)
-                                (.-isIntersecting (first entries)))
-                       ;; Load next chunk when sentinel intersects
-                       (let [current @children-count*
-                             next-count (min total (+ current chunk-size))]
-                         (reset! children-count* next-count))))
-                observer (js/IntersectionObserver. cb #js {:root scroll-node})]
-            (.observe observer lazy-node)
-            (reset! observer-var observer)))))
-
    [:& layer-item-inner
     {:ref dref
      :item item
@@ -472,32 +387,24 @@
      :on-enable-drag enable-drag
      :on-disable-drag disable-drag
      :on-toggle-visibility toggle-visibility
-      :on-toggle-blocking toggle-blocking
-      :style style}
+      :on-toggle-blocking toggle-blocking}

-     (when (and render-children?
-                (:shapes item)
-                expanded?)
+     (when (and (:shapes item) expanded?)
       [:div {:class (stl/css-case
                      :element-children true
                      :parent-selected selected?
                      :sticky-children parent-board?)
              :data-testid (dm/str "children-" id)}
-        (let [all-children (reverse (d/enumerate (:shapes item)))
-              visible      (take children-count all-children)]
-          (for [[index id] visible]
-            (when-let [item (get objects id)]
-              [:& layer-item
-               {:item item
-                :highlighted highlighted
-                :selected selected
-                :index index
-                :objects objects
-                :key (dm/str id)
-                :sortable? sortable?
-                :depth depth
-                :parent-size parent-size
-                :component-child? component-tree?}])))
-        (when (< children-count (count (:shapes item)))
-          [:div {:ref lazy-ref
-                 :style {:min-height 1}}])])]))
+        (for [[index id] (reverse (d/enumerate (:shapes item)))]
+          (when-let [item (get objects id)]
+            [:& layer-item
+             {:item item
+              :highlighted highlighted
+              :selected selected
+              :index index
+              :objects objects
+              :key (dm/str id)
+              :sortable? sortable?
+              :depth depth
+              :parent-size parent-size
+              :component-child? component-tree?}]))])]))
--- a/frontend/src/app/main/ui/workspace/sidebar/options.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/options.cljs
@@ -116,29 +116,13 @@
        (->> (dm/get-in grid-edition [edition :selected])
             (map #(dm/get-in objects [edition :layout-grid-cells %])))

-        shapes-with-children*
-        (mf/use-state nil)
-
-        _ (mf/use-effect
-           (mf/deps selected objects shapes)
-           (fn []
-             (reset! shapes-with-children* nil)
-             (let [result
-                   (loop [queue   (into #queue [] selected)
-                          visited selected]
-                     (if-let [id (peek queue)]
-                       (let [shape    (get objects id)
-                             children (:shapes shape)]
-                         (if (seq children)
-                           (let [new-children (remove visited children)]
-                             (recur (into (pop queue) new-children)
-                                    (into visited new-children)))
-                           (recur (pop queue) visited)))
-                       (sequence (keep (d/getf objects)) visited)))]
-               (reset! shapes-with-children* result))))
-
        shapes-with-children
-        (deref shapes-with-children*)
+        (mf/with-memo [selected objects shapes]
+          (let [xform    (comp (remove nil?)
+                               (mapcat #(cfh/get-children-ids objects %)))
+                selected (into selected xform selected)]
+            (sequence (keep (d/getf objects)) selected)))
+

        total-selected
        (count selected)]
--- a/frontend/src/app/main/ui/workspace/sidebar/sitemap.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/sitemap.cljs
@@ -13,7 +13,6 @@
   [app.main.data.helpers :as dsh]
   [app.main.data.modal :as modal]
   [app.main.data.workspace :as dw]
-   [app.main.features :as features]
   [app.main.refs :as refs]
   [app.main.store :as st]
   [app.main.ui.components.title-bar :refer [title-bar*]]
@@ -23,11 +22,9 @@
   [app.main.ui.hooks :as hooks]
   [app.main.ui.icons :as deprecated-icon]
   [app.main.ui.notifications.badge :refer [badge-notification]]
-   [app.render-wasm.api :as wasm.api]
   [app.util.dom :as dom]
   [app.util.i18n :as i18n :refer [tr]]
   [app.util.keyboard :as kbd]
-   [app.util.timers :as timers]
   [cuerdas.core :as str]
   [okulary.core :as l]
   [rumext.v2 :as mf]))
@@ -55,8 +52,6 @@
             refs/workspace-data
             =))

-
-
 ;; --- Page Item

 (mf/defc page-item
@@ -68,22 +63,6 @@
        navigate-fn  (mf/use-fn (mf/deps id) #(st/emit! :interrupt (dcm/go-to-workspace :page-id id)))
        read-only?   (mf/use-ctx ctx/workspace-read-only?)

-        on-click
-        (mf/use-fn
-         (mf/deps id)
-         (fn []
-           ;; when using the wasm renderer, apply a blur effect to the viewport canvas
-           (if (features/active-feature? @st/state "render-wasm/v1")
-             (do
-               (wasm.api/capture-canvas-pixels)
-               (wasm.api/apply-canvas-blur)
-               ;; NOTE: it seems we need two RAF so the blur is actually applied and visible
-               ;;       in the canvas :(
-               (timers/raf
-                (fn []
-                  (timers/raf navigate-fn))))
-             (navigate-fn))))
-
        on-delete
        (mf/use-fn
         (mf/deps id)
@@ -176,7 +155,7 @@
                    :selected selected?)
            :data-testid (dm/str "page-" id)
            :tab-index "0"
-            :on-click on-click
+            :on-click navigate-fn
            :on-double-click on-double-click
            :on-context-menu on-context-menu}
      [:div {:class (stl/css :page-icon)}
--- a/frontend/src/app/main/ui/workspace/tokens/management/forms/controls/input.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/management/forms/controls/input.cljs
@@ -332,6 +332,7 @@
                                 message (tr "workspace.tokens.resolved-value" (or resolved-value value))]
                             (swap! form update :errors dissoc :value)
                             (swap! form update :extra-errors dissoc :value)
+                             (swap! form update :async-errors dissoc :reference)
                             (if (= input-value (str resolved-value))
                               (reset! hint* {})
                               (reset! hint* {:message message :type "hint"})))))))]
--- a/frontend/src/app/main/ui/workspace/tokens/management/forms/generic_form.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/management/forms/generic_form.cljs
@@ -101,13 +101,6 @@
        active-tab* (mf/use-state #(if (cft/is-reference? token) :reference :composite))
        active-tab (deref active-tab*)

-        on-toggle-tab
-        (mf/use-fn
-         (mf/deps)
-         (fn [new-tab]
-           (let [new-tab (keyword new-tab)]
-             (reset! active-tab* new-tab))))
-
        token
        (mf/with-memo [token]
          (or token {:type token-type}))
@@ -144,6 +137,17 @@
        (fm/use-form :schema schema
                     :initial initial)

+        on-toggle-tab
+        (mf/use-fn
+         (mf/deps form)
+         (fn [new-tab]
+           (let [new-tab (keyword new-tab)]
+             (if (= new-tab :reference)
+               (swap! form assoc-in [:async-errors :reference]
+                      {:message "Need valid reference"})
+               (swap! form update :async-errors dissoc :reference))
+             (reset! active-tab* new-tab))))
+
        warning-name-change?
        (not= (get-in @form [:data :name])
              (:name initial))
--- a/frontend/src/app/main/ui/workspace/viewport_wasm.cljs
+++ b/frontend/src/app/main/ui/workspace/viewport_wasm.cljs
@@ -312,11 +312,6 @@
                                         (js/console.error "Error initializing canvas context:" e)
                                         false))]
                           (reset! canvas-init? init?)
-                           (when init?
-                             ;; Restore previous canvas pixels immediately after context initialization
-                             ;; This happens before initialize-viewport is called
-                             (wasm.api/apply-canvas-blur)
-                             (wasm.api/restore-previous-canvas-pixels))
                           (when-not init?
                             (js/alert "WebGL not supported")
                             (st/emit! (dcm/go-to-dashboard-recent))))))))
@@ -345,7 +340,6 @@

    (mf/with-effect [@canvas-init? zoom vbox background]
      (when (and @canvas-init? (not @initialized?))
-        (wasm.api/clear-canvas-pixels)
        (wasm.api/initialize-viewport base-objects zoom vbox background)
        (reset! initialized? true)))

--- a/frontend/src/app/plugins/shape.cljs
+++ b/frontend/src/app/plugins/shape.cljs
@@ -1185,7 +1185,6 @@
                       {:cmd :export-shapes
                        :profile-id (:profile-id @st/state)
                        :wait true
-                        :skip-children (:skip-children value false)
                        :exports [{:file-id   file-id
                                   :page-id   page-id
                                   :object-id id
--- a/frontend/src/app/render_wasm/api.cljs
+++ b/frontend/src/app/render_wasm/api.cljs
@@ -10,7 +10,6 @@
   ["react-dom/server" :as rds]
   [app.common.data :as d]
   [app.common.data.macros :as dm]
-   [app.common.exceptions :as ex]
   [app.common.files.helpers :as cfh]
   [app.common.logging :as log]
   [app.common.math :as mth]
@@ -22,6 +21,7 @@
   [app.common.types.text :as txt]
   [app.common.uuid :as uuid]
   [app.config :as cf]
+   [app.main.data.render-wasm :as drw]
   [app.main.refs :as refs]
   [app.main.render :as render]
   [app.main.store :as st]
@@ -29,7 +29,6 @@
   [app.main.worker :as mw]
   [app.render-wasm.api.fonts :as f]
   [app.render-wasm.api.texts :as t]
-   [app.render-wasm.api.webgl :as webgl]
   [app.render-wasm.deserializers :as dr]
   [app.render-wasm.helpers :as h]
   [app.render-wasm.mem :as mem]
@@ -38,6 +37,7 @@
   [app.render-wasm.serializers :as sr]
   [app.render-wasm.serializers.color :as sr-clr]
   [app.render-wasm.svg-filters :as svg-filters]
+   ;; FIXME: rename; confunsing name
   [app.render-wasm.wasm :as wasm]
   [app.util.debug :as dbg]
   [app.util.dom :as dom]
@@ -279,6 +279,30 @@
  [string]
  (+ (count string) 1))

+(defn- create-webgl-texture-from-image
+  "Creates a WebGL texture from an HTMLImageElement or ImageBitmap and returns the texture object"
+  [gl image-element]
+  (let [texture (.createTexture ^js gl)]
+    (.bindTexture ^js gl (.-TEXTURE_2D ^js gl) texture)
+    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_WRAP_S ^js gl) (.-CLAMP_TO_EDGE ^js gl))
+    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_WRAP_T ^js gl) (.-CLAMP_TO_EDGE ^js gl))
+    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_MIN_FILTER ^js gl) (.-LINEAR ^js gl))
+    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_MAG_FILTER ^js gl) (.-LINEAR ^js gl))
+    (.texImage2D ^js gl (.-TEXTURE_2D ^js gl) 0 (.-RGBA ^js gl) (.-RGBA ^js gl) (.-UNSIGNED_BYTE ^js gl) image-element)
+    (.bindTexture ^js gl (.-TEXTURE_2D ^js gl) nil)
+    texture))
+
+(defn- get-webgl-context
+  "Gets the WebGL context from the WASM module"
+  []
+  (when wasm/context-initialized?
+    (let [gl-obj (unchecked-get wasm/internal-module "GL")]
+      (when gl-obj
+        ;; Get the current WebGL context from Emscripten
+        ;; The GL object has a currentContext property that contains the context handle
+        (let [current-ctx (.-currentContext ^js gl-obj)]
+          (when current-ctx
+            (.-GLctx ^js current-ctx)))))))

 (defn- get-texture-id-for-gl-object
  "Registers a WebGL texture with Emscripten's GL object system and returns its ID"
@@ -308,8 +332,8 @@
       (->> (retrieve-image url)
            (rx/map
             (fn [img]
-               (when-let [gl (webgl/get-webgl-context)]
-                 (let [texture (webgl/create-webgl-texture-from-image gl img)
+               (when-let [gl (get-webgl-context)]
+                 (let [texture (create-webgl-texture-from-image gl img)
                       texture-id (get-texture-id-for-gl-object texture)
                       width  (.-width ^js img)
                       height (.-height ^js img)
@@ -955,7 +979,6 @@
      (set-shape-grow-type grow-type))

    (set-shape-layout shape)
-    (set-layout-data shape)
    (set-shape-selrect selrect)

    (let [pending_thumbnails (into [] (concat
@@ -1032,9 +1055,8 @@
     (perf/end-measure "set-objects")
     (process-pending shapes thumbnails full noop-fn
                      (fn []
-                        (if render-callback
-                          (render-callback)
-                          (render-finish))
+                        (when render-callback (render-callback))
+                        (render-finish)
                        (ug/dispatch! (ug/event "penpot:wasm:set-objects")))))))

 (defn clear-focus-mode
@@ -1214,8 +1236,7 @@
  (dom/prevent-default event)
  (reset! wasm/context-lost? true)
  (log/warn :hint "WebGL context lost")
-  (ex/raise :type :webgl-context-lost
-            :hint "WebGL context lost"))
+  (st/emit! (drw/context-lost)))

 (defn init-canvas-context
  [canvas]
@@ -1362,9 +1383,8 @@
        all-children
        (->> ids
             (mapcat #(cfh/get-children-with-self objects %)))]
-
    (h/call wasm/internal-module "_init_shapes_pool" (count all-children))
-    (run! set-object all-children)
+    (run! (partial set-object objects) all-children)

    (let [content (-> (calculate-bool* bool-type ids)
                      (path.impl/path-data))]
@@ -1427,12 +1447,6 @@

      result)))

-(defn apply-canvas-blur
-  []
-  (when wasm/canvas
-    (dom/set-style! wasm/canvas "filter" "blur(4px)")))
-
-
 (defn init-wasm-module
  [module]
  (let [default-fn (unchecked-get module "default")
@@ -1454,8 +1468,3 @@
                (js/console.error cause)
                (p/resolved false)))))
      (p/resolved false))))
-
-;; Re-export public WebGL functions
-(def capture-canvas-pixels webgl/capture-canvas-pixels)
-(def restore-previous-canvas-pixels webgl/restore-previous-canvas-pixels)
-(def clear-canvas-pixels webgl/clear-canvas-pixels)
--- a/frontend/src/app/render_wasm/api/webgl.cljs
+++ b/frontend/src/app/render_wasm/api/webgl.cljs
@@ -1,166 +0,0 @@
-;; This Source Code Form is subject to the terms of the Mozilla Public
-;; License, v. 2.0. If a copy of the MPL was not distributed with this
-;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
-;;
-;; Copyright (c) KALEIDOS INC
-
-(ns app.render-wasm.api.webgl
-  "WebGL utilities for pixel capture and rendering"
-  (:require
-   [app.common.logging :as log]
-   [app.render-wasm.wasm :as wasm]
-   [app.util.dom :as dom]))
-
-(defn get-webgl-context
-  "Gets the WebGL context from the WASM module"
-  []
-  (when wasm/context-initialized?
-    (let [gl-obj (unchecked-get wasm/internal-module "GL")]
-      (when gl-obj
-        ;; Get the current WebGL context from Emscripten
-        ;; The GL object has a currentContext property that contains the context handle
-        (let [current-ctx (.-currentContext ^js gl-obj)]
-          (when current-ctx
-            (.-GLctx ^js current-ctx)))))))
-
-(defn create-webgl-texture-from-image
-  "Creates a WebGL texture from an HTMLImageElement or ImageBitmap and returns the texture object"
-  [gl image-element]
-  (let [texture (.createTexture ^js gl)]
-    (.bindTexture ^js gl (.-TEXTURE_2D ^js gl) texture)
-    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_WRAP_S ^js gl) (.-CLAMP_TO_EDGE ^js gl))
-    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_WRAP_T ^js gl) (.-CLAMP_TO_EDGE ^js gl))
-    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_MIN_FILTER ^js gl) (.-LINEAR ^js gl))
-    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_MAG_FILTER ^js gl) (.-LINEAR ^js gl))
-    (.texImage2D ^js gl (.-TEXTURE_2D ^js gl) 0 (.-RGBA ^js gl) (.-RGBA ^js gl) (.-UNSIGNED_BYTE ^js gl) image-element)
-    (.bindTexture ^js gl (.-TEXTURE_2D ^js gl) nil)
-    texture))
-
-;; FIXME: temporary function until we are able to keep the same <canvas> across pages.
-(defn- draw-imagedata-to-webgl
-  "Draws ImageData to a WebGL2 context by creating a texture"
-  [gl image-data]
-  (let [width (.-width ^js image-data)
-        height (.-height ^js image-data)
-        texture (.createTexture ^js gl)]
-    ;; Bind texture and set parameters
-    (.bindTexture ^js gl (.-TEXTURE_2D ^js gl) texture)
-    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_WRAP_S ^js gl) (.-CLAMP_TO_EDGE ^js gl))
-    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_WRAP_T ^js gl) (.-CLAMP_TO_EDGE ^js gl))
-    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_MIN_FILTER ^js gl) (.-LINEAR ^js gl))
-    (.texParameteri ^js gl (.-TEXTURE_2D ^js gl) (.-TEXTURE_MAG_FILTER ^js gl) (.-LINEAR ^js gl))
-    (.texImage2D ^js gl (.-TEXTURE_2D ^js gl) 0 (.-RGBA ^js gl) (.-RGBA ^js gl) (.-UNSIGNED_BYTE ^js gl) image-data)
-
-    ;; Set up viewport
-    (.viewport ^js gl 0 0 width height)
-
-    ;; Vertex & Fragment shaders
-    ;; Since we are only calling this function once (on page switch), we don't need
-    ;; to cache the compiled shaders somewhere else (cannot be reused in a differen context).
-    (let [vertex-shader-source "#version 300 es
-in vec2 a_position;
-in vec2 a_texCoord;
-out vec2 v_texCoord;
-void main() {
-  gl_Position = vec4(a_position, 0.0, 1.0);
-  v_texCoord = a_texCoord;
-}"
-          fragment-shader-source "#version 300 es
-precision highp float;
-in vec2 v_texCoord;
-uniform sampler2D u_texture;
-out vec4 fragColor;
-void main() {
-  fragColor = texture(u_texture, v_texCoord);
-}"
-          vertex-shader (.createShader ^js gl (.-VERTEX_SHADER ^js gl))
-          fragment-shader (.createShader ^js gl (.-FRAGMENT_SHADER ^js gl))
-          program (.createProgram ^js gl)]
-      (.shaderSource ^js gl vertex-shader vertex-shader-source)
-      (.compileShader ^js gl vertex-shader)
-      (when-not (.getShaderParameter ^js gl vertex-shader (.-COMPILE_STATUS ^js gl))
-        (log/error :hint "Vertex shader compilation failed"
-                   :log (.getShaderInfoLog ^js gl vertex-shader)))
-
-      (.shaderSource ^js gl fragment-shader fragment-shader-source)
-      (.compileShader ^js gl fragment-shader)
-      (when-not (.getShaderParameter ^js gl fragment-shader (.-COMPILE_STATUS ^js gl))
-        (log/error :hint "Fragment shader compilation failed"
-                   :log (.getShaderInfoLog ^js gl fragment-shader)))
-
-      (.attachShader ^js gl program vertex-shader)
-      (.attachShader ^js gl program fragment-shader)
-      (.linkProgram ^js gl program)
-
-      (if (.getProgramParameter ^js gl program (.-LINK_STATUS ^js gl))
-        (do
-          (.useProgram ^js gl program)
-
-          ;; Create full-screen quad vertices (normalized device coordinates)
-          (let [position-location (.getAttribLocation ^js gl program "a_position")
-                texcoord-location (.getAttribLocation ^js gl program "a_texCoord")
-                position-buffer (.createBuffer ^js gl)
-                texcoord-buffer (.createBuffer ^js gl)
-                positions #js [-1.0 -1.0  1.0 -1.0  -1.0 1.0  -1.0 1.0  1.0 -1.0  1.0 1.0]
-                texcoords #js [0.0 0.0  1.0 0.0  0.0 1.0  0.0 1.0  1.0 0.0  1.0 1.0]]
-            ;; Set up position buffer
-            (.bindBuffer ^js gl (.-ARRAY_BUFFER ^js gl) position-buffer)
-            (.bufferData ^js gl (.-ARRAY_BUFFER ^js gl) (js/Float32Array. positions) (.-STATIC_DRAW ^js gl))
-            (.enableVertexAttribArray ^js gl position-location)
-            (.vertexAttribPointer ^js gl position-location 2 (.-FLOAT ^js gl) false 0 0)
-           ;; Set up texcoord buffer
-            (.bindBuffer ^js gl (.-ARRAY_BUFFER ^js gl) texcoord-buffer)
-            (.bufferData ^js gl (.-ARRAY_BUFFER ^js gl) (js/Float32Array. texcoords) (.-STATIC_DRAW ^js gl))
-            (.enableVertexAttribArray ^js gl texcoord-location)
-            (.vertexAttribPointer ^js gl texcoord-location 2 (.-FLOAT ^js gl) false 0 0)
-            ;; Set texture uniform
-            (.activeTexture ^js gl (.-TEXTURE0 ^js gl))
-            (.bindTexture ^js gl (.-TEXTURE_2D ^js gl) texture)
-            (let [texture-location (.getUniformLocation ^js gl program "u_texture")]
-              (.uniform1i ^js gl texture-location 0))
-
-            ;; draw
-            (.drawArrays ^js gl (.-TRIANGLES ^js gl) 0 6)
-
-            ;; cleanup
-            (.deleteBuffer ^js gl position-buffer)
-            (.deleteBuffer ^js gl texcoord-buffer)
-            (.deleteShader ^js gl vertex-shader)
-            (.deleteShader ^js gl fragment-shader)
-            (.deleteProgram ^js gl program)))
-        (log/error :hint "Program linking failed"
-                   :log (.getProgramInfoLog ^js gl program)))
-
-      (.bindTexture ^js gl (.-TEXTURE_2D ^js gl) nil)
-      (.deleteTexture ^js gl texture))))
-
-(defn restore-previous-canvas-pixels
-  "Restores previous canvas pixels into the new canvas"
-  []
-  (when-let [previous-canvas-pixels wasm/canvas-pixels]
-    (when-let [gl wasm/gl-context]
-      (draw-imagedata-to-webgl gl previous-canvas-pixels)
-      (set! wasm/canvas-pixels nil))))
-
-(defn clear-canvas-pixels
-  []
-  (when wasm/canvas
-    (let [context wasm/gl-context]
-      (.clearColor ^js context 0 0 0 0.0)
-      (.clear ^js context (.-COLOR_BUFFER_BIT ^js context))
-      (.clear ^js context (.-DEPTH_BUFFER_BIT ^js context))
-      (.clear ^js context (.-STENCIL_BUFFER_BIT ^js context)))
-    (dom/set-style! wasm/canvas "filter" "none")
-    (set! wasm/canvas-pixels nil)))
-
-(defn capture-canvas-pixels
-  "Captures the pixels of the viewport canvas"
-  []
-  (when wasm/canvas
-    (let [context wasm/gl-context
-          width (.-width wasm/canvas)
-          height (.-height wasm/canvas)
-          buffer (js/Uint8ClampedArray. (* width height  4))
-          _ (.readPixels ^js context 0 0 width height (.-RGBA ^js context) (.-UNSIGNED_BYTE ^js context) buffer)
-          image-data (js/ImageData. buffer width height)]
-      (set! wasm/canvas-pixels image-data))))
--- a/frontend/src/app/render_wasm/wasm.cljs
+++ b/frontend/src/app/render_wasm/wasm.cljs
@@ -12,8 +12,6 @@

 ;; Reference to the HTML canvas element.
 (defonce canvas nil)
-;; Reference to the captured pixels of the canvas (for page switching effect)
-(defonce canvas-pixels nil)

 ;; Reference to the Emscripten GL context wrapper.
 (defonce gl-context-handle nil)
@@ -58,4 +56,3 @@
       :stroke-linecap shared/RawStrokeLineCap
       :stroke-linejoin shared/RawStrokeLineJoin
       :fill-rule shared/RawFillRule})
-
--- a/frontend/src/app/util/i18n.cljs
+++ b/frontend/src/app/util/i18n.cljs
@@ -114,7 +114,7 @@

 (defn- load
  [locale]
-  (let [path (str "./translation." locale ".js?version=" (:full cf/version))]
+  (let [path (str "./translation." locale ".js?version=" cf/version-tag)]
    (->> (mod/import path)
         (p/fmap (fn [result] (unchecked-get result "default")))
         (p/fnly (fn [data cause]
--- a/frontend/src/app/worker/thumbnails.cljs
+++ b/frontend/src/app/worker/thumbnails.cljs
@@ -179,7 +179,6 @@

                      (->> (render-canvas-blob canvas width height bgcolor)
                           (p/fnly (fn [data cause]
-                                     (wasm.api/clear-canvas)
                                     (if cause
                                       (rx/error! subs cause)
                                       (rx/push! subs
--- a/frontend/text-editor/src/editor/controllers/SelectionController.js
+++ b/frontend/text-editor/src/editor/controllers/SelectionController.js
@@ -242,6 +242,7 @@ export class SelectionController extends EventTarget {
        continue;
      }
      let styleValue = element.style.getPropertyValue(styleName);
+
      if (styleName === "font-family") {
        styleValue = sanitizeFontFamily(styleValue);
      }
@@ -276,29 +277,22 @@ export class SelectionController extends EventTarget {
    this.#applyDefaultStylesToCurrentStyle();
    const root = startNode.parentElement.parentElement.parentElement;
    this.#applyStylesFromElementToCurrentStyle(root);
-    if (startNode === endNode) {
-      const paragraph = startNode.parentElement.parentElement;
+    // FIXME: I don't like this approximation. Having to iterate nodes twice
+    // is bad for performance. I think we need another way of "computing"
+    // the cascade.
+    for (const textNode of this.#textNodeIterator.iterateFrom(
+      startNode,
+      endNode,
+    )) {
+      const paragraph = textNode.parentElement.parentElement;
      this.#applyStylesFromElementToCurrentStyle(paragraph);
-      const textSpan = startNode.parentElement;
-      this.#applyStylesFromElementToCurrentStyle(textSpan);
-    } else {
-      // FIXME: I don't like this approximation. Having to iterate nodes twice
-      // is bad for performance. I think we need another way of "computing"
-      // the cascade.
-      for (const textNode of this.#textNodeIterator.iterateFrom(
-        startNode,
-        endNode,
-      )) {
-        const paragraph = textNode.parentElement.parentElement;
-        this.#applyStylesFromElementToCurrentStyle(paragraph);
-      }
-      for (const textNode of this.#textNodeIterator.iterateFrom(
-        startNode,
-        endNode,
-      )) {
-        const textSpan = textNode.parentElement;
-        this.#mergeStylesFromElementToCurrentStyle(textSpan);
-      }
+    }
+    for (const textNode of this.#textNodeIterator.iterateFrom(
+      startNode,
+      endNode,
+    )) {
+      const textSpan = textNode.parentElement;
+      this.#mergeStylesFromElementToCurrentStyle(textSpan);
    }
    return this;
  }
--- a/frontend/translations/en.po
+++ b/frontend/translations/en.po
@@ -1559,12 +1559,6 @@ msgstr "Old password is incorrect"
 msgid "feedback.description"
 msgstr "Description"

-msgid "errors.webgl-context-lost.main-message"
-msgstr "Oops! The canvas context was lost"
-
-msgid "errors.webgl-context-lost.desc-message"
-msgstr "WebGL has stopped working. Please reload the page to reset it"
-
 #: src/app/main/ui/settings/feedback.cljs:122
 msgid "feedback.description-placeholder"
 msgstr "Please describe the reason of your feedback"
@@ -2527,9 +2521,6 @@ msgstr "Release notes"
 msgid "labels.reload-file"
 msgstr "Reload file"

-msgid "labels.reload-page"
-msgstr "Reload page"
-
 #: src/app/main/ui/workspace/libraries.cljs, src/app/main/ui/dashboard/team.cljs
 #, unused
 msgid "labels.remove"
--- a/frontend/translations/es.po
+++ b/frontend/translations/es.po
@@ -1552,12 +1552,6 @@ msgstr "El email o la contraseña son incorrectos."
 msgid "errors.wrong-old-password"
 msgstr "La contraseña anterior no es correcta"

-msgid "errors.webgl-context-lost.main-message"
-msgstr "Ups! Se ha perdido el contexto del canvas"
-
-msgid "errors.webgl-context-lost.desc-message"
-msgstr "WebGL ha dejado de funcionar. Por favor, recarga la página para restaurarlo"
-
 #: src/app/main/ui/settings/feedback.cljs:120
 msgid "feedback.description"
 msgstr "Descripción"
@@ -2508,9 +2502,6 @@ msgstr "Notas de versión"
 msgid "labels.reload-file"
 msgstr "Recargar archivo"

-msgid "labels.reload-page"
-msgstr "Recargar página"
-
 #: src/app/main/ui/workspace/libraries.cljs, src/app/main/ui/dashboard/team.cljs
 #, unused
 msgid "labels.remove"
--- a/render-wasm/_build_env
+++ b/render-wasm/_build_env
@@ -1,6 +1,6 @@
 #!/usr/bin/env bash

-export CURRENT_VERSION=${CURRENT_VERSION:-develop};
+export VERSION_TAG=${VERSION:-develop};

 if [ "$NODE_ENV" = "production" ];  then
    export BUILD_MODE="release";
@@ -81,7 +81,7 @@ function copy_artifacts {
    cp target/wasm32-unknown-emscripten/$BUILD_MODE/render_wasm.js $DEST/$BUILD_NAME.js;
    cp target/wasm32-unknown-emscripten/$BUILD_MODE/render_wasm.wasm $DEST/$BUILD_NAME.wasm;

-    sed -i "s/render_wasm.wasm/$BUILD_NAME.wasm?version=$CURRENT_VERSION/g" $DEST/$BUILD_NAME.js;
+    sed -i "s/render_wasm.wasm/$BUILD_NAME.wasm?version=$VERSION_TAG/g" $DEST/$BUILD_NAME.js;

    yarn esbuild target/wasm32-unknown-emscripten/$BUILD_MODE/render_wasm.js \
        --log-level=error \
--- a/render-wasm/src/main.rs
+++ b/render-wasm/src/main.rs
@@ -284,7 +284,6 @@ pub extern "C" fn set_view_end() {
            performance::end_measure!("set_view_end::clear_tile_index");
            performance::end_timed_log!("clear_tile_index", _clear_start);
        }
-        state.render_state.sync_cached_viewbox();
        performance::end_measure!("set_view_end");
        performance::end_timed_log!("set_view_end", _end_start);
        #[cfg(feature = "profile-macros")]
--- a/render-wasm/src/render.rs
+++ b/render-wasm/src/render.rs
@@ -10,6 +10,7 @@ mod shadows;
 mod strokes;
 mod surfaces;
 pub mod text;
+
 mod ui;

 use skia_safe::{self as skia, Matrix, RRect, Rect};
@@ -52,25 +53,6 @@ pub struct NodeRenderState {
    mask: bool,
 }

-/// Get simplified children of a container, flattening nested flattened containers
-fn get_simplified_children<'a>(tree: ShapesPoolRef<'a>, shape: &'a Shape) -> Vec<Uuid> {
-    let mut result = Vec::new();
-
-    for child_id in shape.children_ids_iter(false) {
-        if let Some(child) = tree.get(child_id) {
-            if child.can_flatten() {
-                // Child is flattened: recursively get its simplified children
-                result.extend(get_simplified_children(tree, child));
-            } else {
-                // Child is not flattened: add it directly
-                result.push(*child_id);
-            }
-        }
-    }
-
-    result
-}
-
 impl NodeRenderState {
    pub fn is_root(&self) -> bool {
        self.id.is_nil()
@@ -416,7 +398,12 @@ impl RenderState {
    }

    fn frame_clip_layer_blur(shape: &Shape) -> Option<Blur> {
-        shape.frame_clip_layer_blur()
+        match shape.shape_type {
+            Type::Frame(_) if shape.clip() => shape.blur.filter(|blur| {
+                !blur.hidden && blur.blur_type == BlurType::LayerBlur && blur.value > 0.
+            }),
+            _ => None,
+        }
    }

    /// Runs `f` with `ignore_nested_blurs` temporarily forced to `true`.
@@ -534,59 +521,38 @@ impl RenderState {

        let paint = skia::Paint::default();

-        // Only draw surfaces that have content (dirty flag optimization)
-        if self.surfaces.is_dirty(SurfaceId::TextDropShadows) {
-            self.surfaces
-                .draw_into(SurfaceId::TextDropShadows, SurfaceId::Current, Some(&paint));
-        }
+        self.surfaces
+            .draw_into(SurfaceId::TextDropShadows, SurfaceId::Current, Some(&paint));

-        if self.surfaces.is_dirty(SurfaceId::Fills) {
-            self.surfaces
-                .draw_into(SurfaceId::Fills, SurfaceId::Current, Some(&paint));
-        }
+        self.surfaces
+            .draw_into(SurfaceId::Fills, SurfaceId::Current, Some(&paint));

        let mut render_overlay_below_strokes = false;
        if let Some(shape) = shape {
            render_overlay_below_strokes = shape.has_fills();
        }

-        if render_overlay_below_strokes && self.surfaces.is_dirty(SurfaceId::InnerShadows) {
+        if render_overlay_below_strokes {
            self.surfaces
                .draw_into(SurfaceId::InnerShadows, SurfaceId::Current, Some(&paint));
        }

-        if self.surfaces.is_dirty(SurfaceId::Strokes) {
-            self.surfaces
-                .draw_into(SurfaceId::Strokes, SurfaceId::Current, Some(&paint));
-        }
+        self.surfaces
+            .draw_into(SurfaceId::Strokes, SurfaceId::Current, Some(&paint));

-        if !render_overlay_below_strokes && self.surfaces.is_dirty(SurfaceId::InnerShadows) {
+        if !render_overlay_below_strokes {
            self.surfaces
                .draw_into(SurfaceId::InnerShadows, SurfaceId::Current, Some(&paint));
        }

-        // Build mask of dirty surfaces that need clearing
-        let mut dirty_surfaces_to_clear = 0u32;
-        if self.surfaces.is_dirty(SurfaceId::Strokes) {
-            dirty_surfaces_to_clear |= SurfaceId::Strokes as u32;
-        }
-        if self.surfaces.is_dirty(SurfaceId::Fills) {
-            dirty_surfaces_to_clear |= SurfaceId::Fills as u32;
-        }
-        if self.surfaces.is_dirty(SurfaceId::InnerShadows) {
-            dirty_surfaces_to_clear |= SurfaceId::InnerShadows as u32;
-        }
-        if self.surfaces.is_dirty(SurfaceId::TextDropShadows) {
-            dirty_surfaces_to_clear |= SurfaceId::TextDropShadows as u32;
-        }
+        let surface_ids = SurfaceId::Strokes as u32
+            | SurfaceId::Fills as u32
+            | SurfaceId::InnerShadows as u32
+            | SurfaceId::TextDropShadows as u32;

-        if dirty_surfaces_to_clear != 0 {
-            self.surfaces.apply_mut(dirty_surfaces_to_clear, |s| {
-                s.canvas().clear(skia::Color::TRANSPARENT);
-            });
-            // Clear dirty flags for surfaces we just cleared
-            self.surfaces.clear_dirty(dirty_surfaces_to_clear);
-        }
+        self.surfaces.apply_mut(surface_ids, |s| {
+            s.canvas().clear(skia::Color::TRANSPARENT);
+        });
    }

    pub fn clear_focus_mode(&mut self) {
@@ -639,90 +605,11 @@ impl RenderState {
            | strokes_surface_id as u32
            | innershadows_surface_id as u32
            | text_drop_shadows_surface_id as u32;
-
-        // Only save canvas state if we have clipping or transforms
-        // For simple shapes without clipping, skip expensive save/restore
-        let needs_save =
-            clip_bounds.is_some() || offset.is_some() || !shape.transform.is_identity();
-
-        if needs_save {
-            self.surfaces.apply_mut(surface_ids, |s| {
-                s.canvas().save();
-            });
-        }
+        self.surfaces.apply_mut(surface_ids, |s| {
+            s.canvas().save();
+        });

        let antialias = shape.should_use_antialias(self.get_scale());
-        let fast_mode = self.options.is_fast_mode();
-        let has_nested_fills = self
-            .nested_fills
-            .last()
-            .is_some_and(|fills| !fills.is_empty());
-        let has_inherited_blur = !self.ignore_nested_blurs
-            && self.nested_blurs.iter().flatten().any(|blur| {
-                !blur.hidden && blur.blur_type == BlurType::LayerBlur && blur.value > 0.0
-            });
-        let can_render_directly = apply_to_current_surface
-            && clip_bounds.is_none()
-            && offset.is_none()
-            && parent_shadows.is_none()
-            && !shape.needs_layer()
-            && shape.blur.is_none()
-            && !has_inherited_blur
-            && shape.shadows.is_empty()
-            && shape.transform.is_identity()
-            && matches!(
-                shape.shape_type,
-                Type::Rect(_) | Type::Circle | Type::Path(_) | Type::Bool(_)
-            )
-            && !(shape.fills.is_empty() && has_nested_fills)
-            && !shape
-                .svg_attrs
-                .as_ref()
-                .is_some_and(|attrs| attrs.fill_none);
-
-        if can_render_directly {
-            let scale = self.get_scale();
-            let translation = self
-                .surfaces
-                .get_render_context_translation(self.render_area, scale);
-            self.surfaces.apply_mut(SurfaceId::Current as u32, |s| {
-                let canvas = s.canvas();
-                canvas.save();
-                canvas.scale((scale, scale));
-                canvas.translate(translation);
-            });
-
-            for fill in shape.fills().rev() {
-                fills::render(self, shape, fill, antialias, SurfaceId::Current);
-            }
-
-            for stroke in shape.visible_strokes().rev() {
-                strokes::render(
-                    self,
-                    shape,
-                    stroke,
-                    Some(SurfaceId::Current),
-                    None,
-                    antialias,
-                );
-            }
-
-            self.surfaces.apply_mut(SurfaceId::Current as u32, |s| {
-                s.canvas().restore();
-            });
-
-            if self.options.is_debug_visible() {
-                let shape_selrect_bounds = self.get_shape_selrect_bounds(shape);
-                debug::render_debug_shape(self, Some(shape_selrect_bounds), None);
-            }
-
-            if needs_save {
-                self.surfaces.apply_mut(surface_ids, |s| {
-                    s.canvas().restore();
-                });
-            }
-            return;
-        }

        // set clipping
        if let Some(clips) = clip_bounds.as_ref() {
@@ -779,9 +666,6 @@ impl RenderState {
        } else if shape_has_blur {
            shape.to_mut().set_blur(None);
        }
-        if fast_mode {
-            shape.to_mut().set_blur(None);
-        }

        let center = shape.center();
        let mut matrix = shape.transform;
@@ -799,18 +683,16 @@ impl RenderState {
                    matrix.pre_concat(&svg_transform);
                }

-                self.surfaces
-                    .canvas_and_mark_dirty(fills_surface_id)
-                    .concat(&matrix);
+                self.surfaces.canvas(fills_surface_id).concat(&matrix);

                if let Some(svg) = shape.svg.as_ref() {
-                    svg.render(self.surfaces.canvas_and_mark_dirty(fills_surface_id));
+                    svg.render(self.surfaces.canvas(fills_surface_id))
                } else {
                    let font_manager = skia::FontMgr::from(self.fonts().font_provider().clone());
                    let dom_result = skia::svg::Dom::from_str(&sr.content, font_manager);
                    match dom_result {
                        Ok(dom) => {
-                            dom.render(self.surfaces.canvas_and_mark_dirty(fills_surface_id));
+                            dom.render(self.surfaces.canvas(fills_surface_id));
                            shape.to_mut().set_svg(dom);
                        }
                        Err(e) => {
@@ -826,8 +708,18 @@ impl RenderState {
                });

                let text_content = text_content.new_bounds(shape.selrect());
+                let mut drop_shadows = shape.drop_shadow_paints();
+
+                if let Some(inherited_shadows) = self.get_inherited_drop_shadows() {
+                    drop_shadows.extend(inherited_shadows);
+                }
+
+                let inner_shadows = shape.inner_shadow_paints();
+                let blur_filter = shape.image_filter(1.);
                let count_inner_strokes = shape.count_visible_inner_strokes();
                let mut paragraph_builders = text_content.paragraph_builder_group_from_text(None);
+                let mut paragraphs_with_shadows =
+                    text_content.paragraph_builder_group_from_text(Some(true));
                let mut stroke_paragraphs_list = shape
                    .visible_strokes()
                    .rev()
@@ -841,8 +733,62 @@ impl RenderState {
                        )
                    })
                    .collect::<Vec<_>>();
-                if fast_mode {
-                    // Fast path: render fills and strokes only (skip shadows/blur).
+
+                let mut stroke_paragraphs_with_shadows_list = shape
+                    .visible_strokes()
+                    .rev()
+                    .map(|stroke| {
+                        text::stroke_paragraph_builder_group_from_text(
+                            &text_content,
+                            stroke,
+                            &shape.selrect(),
+                            count_inner_strokes,
+                            Some(true),
+                        )
+                    })
+                    .collect::<Vec<_>>();
+
+                if let Some(parent_shadows) = parent_shadows {
+                    if !shape.has_visible_strokes() {
+                        for shadow in parent_shadows {
+                            text::render(
+                                Some(self),
+                                None,
+                                &shape,
+                                &mut paragraphs_with_shadows,
+                                text_drop_shadows_surface_id.into(),
+                                Some(&shadow),
+                                blur_filter.as_ref(),
+                            );
+                        }
+                    } else {
+                        shadows::render_text_shadows(
+                            self,
+                            &shape,
+                            &mut paragraphs_with_shadows,
+                            &mut stroke_paragraphs_with_shadows_list,
+                            text_drop_shadows_surface_id.into(),
+                            &parent_shadows,
+                            &blur_filter,
+                        );
+                    }
+                } else {
+                    // 1. Text drop shadows
+                    if !shape.has_visible_strokes() {
+                        for shadow in &drop_shadows {
+                            text::render(
+                                Some(self),
+                                None,
+                                &shape,
+                                &mut paragraphs_with_shadows,
+                                text_drop_shadows_surface_id.into(),
+                                Some(shadow),
+                                blur_filter.as_ref(),
+                            );
+                        }
+                    }
+
+                    // 2. Text fills
                    text::render(
                        Some(self),
                        None,
@@ -850,9 +796,21 @@ impl RenderState {
                        &mut paragraph_builders,
                        Some(fills_surface_id),
                        None,
-                        None,
+                        blur_filter.as_ref(),
                    );

+                    // 3. Stroke drop shadows
+                    shadows::render_text_shadows(
+                        self,
+                        &shape,
+                        &mut paragraphs_with_shadows,
+                        &mut stroke_paragraphs_with_shadows_list,
+                        text_drop_shadows_surface_id.into(),
+                        &drop_shadows,
+                        &blur_filter,
+                    );
+
+                    // 4. Stroke fills
                    for stroke_paragraphs in stroke_paragraphs_list.iter_mut() {
                        text::render(
                            Some(self),
@@ -861,134 +819,34 @@ impl RenderState {
                            stroke_paragraphs,
                            Some(strokes_surface_id),
                            None,
-                            None,
-                        );
-                    }
-                } else {
-                    let mut drop_shadows = shape.drop_shadow_paints();
-
-                    if let Some(inherited_shadows) = self.get_inherited_drop_shadows() {
-                        drop_shadows.extend(inherited_shadows);
-                    }
-
-                    let inner_shadows = shape.inner_shadow_paints();
-                    let blur_filter = shape.image_filter(1.);
-                    let mut paragraphs_with_shadows =
-                        text_content.paragraph_builder_group_from_text(Some(true));
-                    let mut stroke_paragraphs_with_shadows_list = shape
-                        .visible_strokes()
-                        .rev()
-                        .map(|stroke| {
-                            text::stroke_paragraph_builder_group_from_text(
-                                &text_content,
-                                stroke,
-                                &shape.selrect(),
-                                count_inner_strokes,
-                                Some(true),
-                            )
-                        })
-                        .collect::<Vec<_>>();
-
-                    if let Some(parent_shadows) = parent_shadows {
-                        if !shape.has_visible_strokes() {
-                            for shadow in parent_shadows {
-                                text::render(
-                                    Some(self),
-                                    None,
-                                    &shape,
-                                    &mut paragraphs_with_shadows,
-                                    text_drop_shadows_surface_id.into(),
-                                    Some(&shadow),
-                                    blur_filter.as_ref(),
-                                );
-                            }
-                        } else {
-                            shadows::render_text_shadows(
-                                self,
-                                &shape,
-                                &mut paragraphs_with_shadows,
-                                &mut stroke_paragraphs_with_shadows_list,
-                                text_drop_shadows_surface_id.into(),
-                                &parent_shadows,
-                                &blur_filter,
-                            );
-                        }
-                    } else {
-                        // 1. Text drop shadows
-                        if !shape.has_visible_strokes() {
-                            for shadow in &drop_shadows {
-                                text::render(
-                                    Some(self),
-                                    None,
-                                    &shape,
-                                    &mut paragraphs_with_shadows,
-                                    text_drop_shadows_surface_id.into(),
-                                    Some(shadow),
-                                    blur_filter.as_ref(),
-                                );
-                            }
-                        }
-
-                        // 2. Text fills
-                        text::render(
-                            Some(self),
-                            None,
-                            &shape,
-                            &mut paragraph_builders,
-                            Some(fills_surface_id),
-                            None,
                            blur_filter.as_ref(),
                        );
+                    }

-                        // 3. Stroke drop shadows
-                        shadows::render_text_shadows(
-                            self,
-                            &shape,
-                            &mut paragraphs_with_shadows,
-                            &mut stroke_paragraphs_with_shadows_list,
-                            text_drop_shadows_surface_id.into(),
-                            &drop_shadows,
-                            &blur_filter,
-                        );
+                    // 5. Stroke inner shadows
+                    shadows::render_text_shadows(
+                        self,
+                        &shape,
+                        &mut paragraphs_with_shadows,
+                        &mut stroke_paragraphs_with_shadows_list,
+                        Some(innershadows_surface_id),
+                        &inner_shadows,
+                        &blur_filter,
+                    );

-                        // 4. Stroke fills
-                        for stroke_paragraphs in stroke_paragraphs_list.iter_mut() {
+                    // 6. Fill Inner shadows
+                    if !shape.has_visible_strokes() {
+                        for shadow in &inner_shadows {
                            text::render(
                                Some(self),
                                None,
                                &shape,
-                                stroke_paragraphs,
-                                Some(strokes_surface_id),
-                                None,
+                                &mut paragraphs_with_shadows,
+                                Some(innershadows_surface_id),
+                                Some(shadow),
                                blur_filter.as_ref(),
                            );
                        }
-
-                        // 5. Stroke inner shadows
-                        shadows::render_text_shadows(
-                            self,
-                            &shape,
-                            &mut paragraphs_with_shadows,
-                            &mut stroke_paragraphs_with_shadows_list,
-                            Some(innershadows_surface_id),
-                            &inner_shadows,
-                            &blur_filter,
-                        );
-
-                        // 6. Fill Inner shadows
-                        if !shape.has_visible_strokes() {
-                            for shadow in &inner_shadows {
-                                text::render(
-                                    Some(self),
-                                    None,
-                                    &shape,
-                                    &mut paragraphs_with_shadows,
-                                    Some(innershadows_surface_id),
-                                    Some(shadow),
-                                    blur_filter.as_ref(),
-                                );
-                            }
-                        }
                    }
                }
            }
@@ -1028,25 +886,16 @@ impl RenderState {
                        None,
                        antialias,
                    );
-                    if !fast_mode {
-                        shadows::render_stroke_inner_shadows(
-                            self,
-                            shape,
-                            stroke,
-                            antialias,
-                            innershadows_surface_id,
-                        );
-                    }
-                }
-
-                if !fast_mode {
-                    shadows::render_fill_inner_shadows(
+                    shadows::render_stroke_inner_shadows(
                        self,
                        shape,
+                        stroke,
                        antialias,
                        innershadows_surface_id,
                    );
                }
+
+                shadows::render_fill_inner_shadows(self, shape, antialias, innershadows_surface_id);
                // bools::debug_render_bool_paths(self, shape, shapes, modifiers, structure);
            }
        };
@@ -1059,13 +908,9 @@ impl RenderState {
        if apply_to_current_surface {
            self.apply_drawing_to_render_canvas(Some(&shape));
        }
-
-        // Only restore if we saved (optimization for simple shapes)
-        if needs_save {
-            self.surfaces.apply_mut(surface_ids, |s| {
-                s.canvas().restore();
-            });
-        }
+        self.surfaces.apply_mut(surface_ids, |s| {
+            s.canvas().restore();
+        });
    }

    pub fn update_render_context(&mut self, tile: tiles::Tile) {
@@ -1136,7 +981,6 @@ impl RenderState {
    ) -> Result<(), String> {
        let _start = performance::begin_timed_log!("start_render_loop");
        let scale = self.get_scale();
-
        self.tile_viewbox.update(self.viewbox, scale);

        self.focus_mode.reset();
@@ -1187,7 +1031,6 @@ impl RenderState {
        // reorder by distance to the center.
        self.current_tile = None;
        self.render_in_progress = true;
-
        self.apply_drawing_to_render_canvas(None);

        if sync_render {
@@ -1274,6 +1117,18 @@ impl RenderState {
            self.nested_fills.push(Vec::new());
        }

+        let mut paint = skia::Paint::default();
+        paint.set_blend_mode(element.blend_mode().into());
+        paint.set_alpha_f(element.opacity());
+
+        if let Some(frame_blur) = Self::frame_clip_layer_blur(element) {
+            let scale = self.get_scale();
+            let sigma = frame_blur.value * scale;
+            if let Some(filter) = skia::image_filters::blur((sigma, sigma), None, None, None) {
+                paint.set_image_filter(filter);
+            }
+        }
+
        // When we're rendering the mask shape we need to set a special blend mode
        // called 'destination-in' that keeps the drawn content within the mask.
        // @see https://skia.org/docs/user/api/skblendmode_overview/
@@ -1286,40 +1141,16 @@ impl RenderState {
                .save_layer(&mask_rec);
        }

-        // Only create save_layer if actually needed
-        // For simple shapes with default opacity and blend mode, skip expensive save_layer
-        // Groups with masks need a layer to properly handle the mask rendering
-        let needs_layer = element.needs_layer();
-
-        if needs_layer {
-            let mut paint = skia::Paint::default();
-            paint.set_blend_mode(element.blend_mode().into());
-            paint.set_alpha_f(element.opacity());
-
-            if let Some(frame_blur) = Self::frame_clip_layer_blur(element) {
-                let scale = self.get_scale();
-                let sigma = frame_blur.value * scale;
-                if let Some(filter) = skia::image_filters::blur((sigma, sigma), None, None, None) {
-                    paint.set_image_filter(filter);
-                }
-            }
-
-            let layer_rec = skia::canvas::SaveLayerRec::default().paint(&paint);
-            self.surfaces
-                .canvas(SurfaceId::Current)
-                .save_layer(&layer_rec);
-        }
+        let layer_rec = skia::canvas::SaveLayerRec::default().paint(&paint);
+        self.surfaces
+            .canvas(SurfaceId::Current)
+            .save_layer(&layer_rec);

        self.focus_mode.enter(&element.id);
    }

    #[inline]
-    pub fn render_shape_exit(
-        &mut self,
-        element: &Shape,
-        visited_mask: bool,
-        clip_bounds: Option<ClipStack>,
-    ) {
+    pub fn render_shape_exit(&mut self, element: &Shape, visited_mask: bool) {
        if visited_mask {
            // Because masked groups needs two rendering passes (first drawing
            // the content and then drawing the mask), we need to do an
@@ -1375,7 +1206,7 @@ impl RenderState {
            element_strokes.to_mut().clip_content = false;
            self.render_shape(
                &element_strokes,
-                clip_bounds,
+                None,
                SurfaceId::Fills,
                SurfaceId::Strokes,
                SurfaceId::InnerShadows,
@@ -1386,14 +1217,7 @@ impl RenderState {
            );
        }

-        // Only restore if we created a layer (optimization for simple shapes)
-        // Groups with masks need restore to properly handle the mask rendering
-        let needs_layer = element.needs_layer();
-
-        if needs_layer {
-            self.surfaces.canvas(SurfaceId::Current).restore();
-        }
-
+        self.surfaces.canvas(SurfaceId::Current).restore();
        self.focus_mode.exit(&element.id);
    }

@@ -1626,8 +1450,6 @@ impl RenderState {
                "Error: Element with root_id {} not found in the tree.",
                node_render_state.id
            ))?;
-            let scale = self.get_scale();
-            let mut extrect: Option<Rect> = None;

            // If the shape is not in the tile set, then we add them.
            if self.tiles.get_tiles_of(node_id).is_none() {
@@ -1635,44 +1457,22 @@ impl RenderState {
            }

            if visited_children {
-                // Skip render_shape_exit for flattened containers
-                if !element.can_flatten() {
-                    self.render_shape_exit(element, visited_mask, clip_bounds);
-                }
+                self.render_shape_exit(element, visited_mask);
                continue;
            }

            if !node_render_state.is_root() {
                let transformed_element: Cow<Shape> = Cow::Borrowed(element);
+                let scale = self.get_scale();
+                let extrect = transformed_element.extrect(tree, scale);

-                // Aggressive early exit: check hidden first (fastest check)
-                if transformed_element.hidden {
-                    continue;
-                }
-
-                // For frames and groups, we must use extrect because they can have nested content
-                // that extends beyond their selrect. Using selrect for early exit would incorrectly
-                // skip frames/groups that have nested content in the current tile.
-                let is_container = matches!(
-                    transformed_element.shape_type,
-                    crate::shapes::Type::Frame(_) | crate::shapes::Type::Group(_)
-                );
-
-                let has_effects = transformed_element.has_effects_that_extend_bounds();
-
-                let is_visible = if is_container || has_effects {
-                    let element_extrect =
-                        extrect.get_or_insert_with(|| transformed_element.extrect(tree, scale));
-                    element_extrect.intersects(self.render_area)
-                        && !transformed_element.visually_insignificant(scale, tree)
-                } else {
-                    let selrect = transformed_element.selrect();
-                    selrect.intersects(self.render_area)
-                        && !transformed_element.visually_insignificant(scale, tree)
-                };
+                let is_visible = extrect.intersects(self.render_area)
+                    && !transformed_element.hidden
+                    && !transformed_element.visually_insignificant(scale, tree);

                if self.options.is_debug_visible() {
-                    let shape_extrect_bounds = self.get_shape_extrect_bounds(element, tree);
+                    let shape_extrect_bounds =
+                        self.get_shape_extrect_bounds(&transformed_element, tree);
                    debug::render_debug_shape(self, None, Some(shape_extrect_bounds));
                }

@@ -1681,14 +1481,10 @@ impl RenderState {
                }
            }

-            // Skip render_shape_enter/exit for flattened containers
-            // If a container was flattened, it doesn't affect children visually, so we skip
-            // the expensive enter/exit operations and process children directly
-            if !element.can_flatten() {
-                self.render_shape_enter(element, mask);
-            }
+            self.render_shape_enter(element, mask);

            if !node_render_state.is_root() && self.focus_mode.is_active() {
+                let scale: f32 = self.get_scale();
                let translation = self
                    .surfaces
                    .get_render_context_translation(self.render_area, scale);
@@ -1728,11 +1524,9 @@ impl RenderState {
                            .save_layer(&layer_rec);

                        // First pass: Render shadow in black to establish alpha mask
-                        let element_extrect =
-                            extrect.get_or_insert_with(|| element.extrect(tree, scale));
                        self.render_drop_black_shadow(
                            element,
-                            element_extrect,
+                            &element.extrect(tree, scale),
                            shadow,
                            clip_bounds.clone(),
                            scale,
@@ -1747,6 +1541,7 @@ impl RenderState {
                                if shadow_shape.hidden {
                                    continue;
                                }
+
                                let clip_bounds = node_render_state
                                    .get_nested_shadow_clip_bounds(element, shadow);

@@ -1887,18 +1682,14 @@ impl RenderState {
                self.apply_drawing_to_render_canvas(Some(element));
            }

-            // Skip nested state updates for flattened containers
-            // Flattened containers don't affect children, so we don't need to track their state
-            if !element.can_flatten() {
-                match element.shape_type {
-                    Type::Frame(_) if Self::frame_clip_layer_blur(element).is_some() => {
-                        self.nested_blurs.push(None);
-                    }
-                    Type::Frame(_) | Type::Group(_) => {
-                        self.nested_blurs.push(element.blur);
-                    }
-                    _ => {}
+            match element.shape_type {
+                Type::Frame(_) if Self::frame_clip_layer_blur(element).is_some() => {
+                    self.nested_blurs.push(None);
                }
+                Type::Frame(_) | Type::Group(_) => {
+                    self.nested_blurs.push(element.blur);
+                }
+                _ => {}
            }

            // Set the node as visited_children before processing children
@@ -1913,35 +1704,24 @@ impl RenderState {
            if element.is_recursive() {
                let children_clip_bounds =
                    node_render_state.get_children_clip_bounds(element, None);
-
-                let children_ids: Vec<_> = if element.can_flatten() {
-                    // Container was flattened: get simplified children (which skip this level)
-                    get_simplified_children(tree, element)
-                } else {
-                    // Container not flattened: use original children
-                    element.children_ids_iter(false).copied().collect()
-                };
+                let mut children_ids: Vec<_> = element.children_ids_iter(false).collect();

                // Z-index ordering on Layouts
-                let children_ids = if element.has_layout() {
-                    let mut ids = children_ids;
+                if element.has_layout() {
                    if element.is_flex() && !element.is_flex_reverse() {
-                        ids.reverse();
+                        children_ids.reverse();
                    }

-                    ids.sort_by(|id1, id2| {
+                    children_ids.sort_by(|id1, id2| {
                        let z1 = tree.get(id1).map(|s| s.z_index()).unwrap_or(0);
                        let z2 = tree.get(id2).map(|s| s.z_index()).unwrap_or(0);
                        z2.cmp(&z1)
                    });
-                    ids
-                } else {
-                    children_ids
-                };
+                }

                for child_id in children_ids.iter() {
                    self.pending_nodes.push(NodeRenderState {
-                        id: *child_id,
+                        id: **child_id,
                        visited_children: false,
                        clip_bounds: children_clip_bounds.clone(),
                        visited_mask: false,
@@ -1967,16 +1747,6 @@ impl RenderState {
        allow_stop: bool,
    ) -> Result<(), String> {
        let mut should_stop = false;
-        let root_ids = {
-            if let Some(shape_id) = base_object {
-                vec![*shape_id]
-            } else {
-                let Some(root) = tree.get(&Uuid::nil()) else {
-                    return Err(String::from("Root shape not found"));
-                };
-                root.children_ids(false)
-            }
-        };

        while !should_stop {
            if let Some(current_tile) = self.current_tile {
@@ -2033,6 +1803,17 @@ impl RenderState {
                .canvas(SurfaceId::Current)
                .clear(self.background_color);

+            let root_ids = {
+                if let Some(shape_id) = base_object {
+                    vec![*shape_id]
+                } else {
+                    let Some(root) = tree.get(&Uuid::nil()) else {
+                        return Err(String::from("Root shape not found"));
+                    };
+                    root.children_ids(false)
+                }
+            };
+
            // If we finish processing every node rendering is complete
            // let's check if there are more pending nodes
            if let Some(next_tile) = self.pending_tiles.pop() {
@@ -2040,13 +1821,21 @@ impl RenderState {

                if !self.surfaces.has_cached_tile_surface(next_tile) {
                    if let Some(ids) = self.tiles.get_shapes_at(next_tile) {
-                        // We only need first level shapes, in the same order as the parent node
-                        let mut valid_ids = Vec::with_capacity(ids.len());
-                        for root_id in root_ids.iter() {
-                            if ids.contains(root_id) {
-                                valid_ids.push(*root_id);
-                            }
-                        }
+                        let root_ids_map: std::collections::HashMap<Uuid, usize> = root_ids
+                            .iter()
+                            .enumerate()
+                            .map(|(i, id)| (*id, i))
+                            .collect();
+
+                        // We only need first level shapes
+                        let mut valid_ids: Vec<Uuid> = ids
+                            .iter()
+                            .filter(|id| root_ids_map.contains_key(id))
+                            .copied()
+                            .collect();
+
+                        // These shapes for the tile should be ordered as they are in the parent node
+                        valid_ids.sort_by_key(|id| root_ids_map.get(id).unwrap_or(&usize::MAX));

                        self.pending_nodes.extend(valid_ids.into_iter().map(|id| {
                            NodeRenderState {
@@ -2293,10 +2082,6 @@ impl RenderState {
        (self.viewbox.zoom - self.cached_viewbox.zoom).abs() > f32::EPSILON
    }

-    pub fn sync_cached_viewbox(&mut self) {
-        self.cached_viewbox = self.viewbox;
-    }
-
    pub fn mark_touched(&mut self, uuid: Uuid) {
        self.touched_ids.insert(uuid);
    }
--- a/render-wasm/src/render/fills.rs
+++ b/render-wasm/src/render/fills.rs
@@ -18,7 +18,7 @@ fn draw_image_fill(
    }

    let size = image.unwrap().dimensions();
-    let canvas = render_state.surfaces.canvas_and_mark_dirty(surface_id);
+    let canvas = render_state.surfaces.canvas(surface_id);
    let container = &shape.selrect;
    let path_transform = shape.to_path_transform();

--- a/render-wasm/src/render/filters.rs
+++ b/render-wasm/src/render/filters.rs
@@ -41,7 +41,7 @@ where
    F: FnOnce(&mut RenderState, SurfaceId),
 {
    if let Some((image, scale)) = render_into_filter_surface(render_state, bounds, draw_fn) {
-        let canvas = render_state.surfaces.canvas_and_mark_dirty(target_surface);
+        let canvas = render_state.surfaces.canvas(target_surface);

        // If we scaled down, we need to scale the source rect and adjust the destination
        if scale < 1.0 {
--- a/render-wasm/src/render/shadows.rs
+++ b/render-wasm/src/render/shadows.rs
@@ -135,7 +135,7 @@ pub fn render_text_shadows(

    let canvas = render_state
        .surfaces
-        .canvas_and_mark_dirty(surface_id.unwrap_or(SurfaceId::TextDropShadows));
+        .canvas(surface_id.unwrap_or(SurfaceId::TextDropShadows));

    for shadow in shadows {
        let shadow_layer = SaveLayerRec::default().paint(shadow);
--- a/render-wasm/src/render/strokes.rs
+++ b/render-wasm/src/render/strokes.rs
@@ -387,7 +387,7 @@ fn draw_image_stroke_in_container(
    }

    let size = image.unwrap().dimensions();
-    let canvas = render_state.surfaces.canvas_and_mark_dirty(surface_id);
+    let canvas = render_state.surfaces.canvas(surface_id);
    let container = &shape.selrect;
    let path_transform = shape.to_path_transform();
    let svg_attrs = shape.svg_attrs.as_ref();
@@ -606,7 +606,7 @@ fn render_internal(

    let scale = render_state.get_scale();
    let target_surface = surface_id.unwrap_or(SurfaceId::Strokes);
-    let canvas = render_state.surfaces.canvas_and_mark_dirty(target_surface);
+    let canvas = render_state.surfaces.canvas(target_surface);
    let selrect = shape.selrect;
    let path_transform = shape.to_path_transform();
    let svg_attrs = shape.svg_attrs.as_ref();
@@ -688,7 +688,7 @@ pub fn render_text_paths(
    let scale = render_state.get_scale();
    let canvas = render_state
        .surfaces
-        .canvas_and_mark_dirty(surface_id.unwrap_or(SurfaceId::Strokes));
+        .canvas(surface_id.unwrap_or(SurfaceId::Strokes));
    let selrect = &shape.selrect;
    let svg_attrs = shape.svg_attrs.as_ref();
    let mut paint: skia_safe::Handle<_> =
--- a/render-wasm/src/render/surfaces.rs
+++ b/render-wasm/src/render/surfaces.rs
@@ -55,8 +55,6 @@ pub struct Surfaces {
    tiles: TileTextureCache,
    sampling_options: skia::SamplingOptions,
    margins: skia::ISize,
-    // Tracks which surfaces have content (dirty flag bitmask)
-    dirty_surfaces: u32,
 }

 #[allow(dead_code)]
@@ -107,7 +105,6 @@ impl Surfaces {
            tiles,
            sampling_options,
            margins,
-            dirty_surfaces: 0,
        }
    }

@@ -150,51 +147,10 @@ impl Surfaces {
        None
    }

-    /// Returns a mutable reference to the canvas and automatically marks
-    /// render surfaces as dirty when accessed. This tracks which surfaces
-    /// have content for optimization purposes.
-    pub fn canvas_and_mark_dirty(&mut self, id: SurfaceId) -> &skia::Canvas {
-        // Automatically mark render surfaces as dirty when accessed
-        // This tracks which surfaces have content for optimization
-        match id {
-            SurfaceId::Fills
-            | SurfaceId::Strokes
-            | SurfaceId::InnerShadows
-            | SurfaceId::TextDropShadows => {
-                self.mark_dirty(id);
-            }
-            _ => {}
-        }
-        self.canvas(id)
-    }
-
-    /// Returns a mutable reference to the canvas without any side effects.
-    /// Use this when you only need to read or manipulate the canvas state
-    /// without marking the surface as dirty.
    pub fn canvas(&mut self, id: SurfaceId) -> &skia::Canvas {
        self.get_mut(id).canvas()
    }

-    /// Marks a surface as having content (dirty)
-    pub fn mark_dirty(&mut self, id: SurfaceId) {
-        self.dirty_surfaces |= id as u32;
-    }
-
-    /// Checks if a surface has content
-    pub fn is_dirty(&self, id: SurfaceId) -> bool {
-        (self.dirty_surfaces & id as u32) != 0
-    }
-
-    /// Clears the dirty flag for a surface or set of surfaces
-    pub fn clear_dirty(&mut self, ids: u32) {
-        self.dirty_surfaces &= !ids;
-    }
-
-    /// Clears all dirty flags
-    pub fn clear_all_dirty(&mut self) {
-        self.dirty_surfaces = 0;
-    }
-
    pub fn flush_and_submit(&mut self, gpu_state: &mut GpuState, id: SurfaceId) {
        let surface = self.get_mut(id);
        gpu_state.context.flush_and_submit_surface(surface, None);
@@ -203,12 +159,9 @@ impl Surfaces {
    pub fn draw_into(&mut self, from: SurfaceId, to: SurfaceId, paint: Option<&skia::Paint>) {
        let sampling_options = self.sampling_options;

-        self.get_mut(from).clone().draw(
-            self.canvas_and_mark_dirty(to),
-            (0.0, 0.0),
-            sampling_options,
-            paint,
-        );
+        self.get_mut(from)
+            .clone()
+            .draw(self.canvas(to), (0.0, 0.0), sampling_options, paint);
    }

    pub fn apply_mut(&mut self, ids: u32, mut f: impl FnMut(&mut skia::Surface)) {
@@ -259,33 +212,18 @@ impl Surfaces {

    pub fn update_render_context(&mut self, render_area: skia::Rect, scale: f32) {
        let translation = self.get_render_context_translation(render_area, scale);
-
-        // When context changes (zoom/pan/tile), clear all render surfaces first
-        // to remove any residual content from previous tiles, then mark as dirty
-        // so they get redrawn with new transformations
-        let surface_ids = SurfaceId::Fills as u32
-            | SurfaceId::Strokes as u32
-            | SurfaceId::InnerShadows as u32
-            | SurfaceId::TextDropShadows as u32;
-
-        // Clear surfaces before updating transformations to remove residual content
-        self.apply_mut(surface_ids, |s| {
-            s.canvas().clear(skia::Color::TRANSPARENT);
-        });
-
-        // Mark all render surfaces as dirty so they get redrawn
-        self.mark_dirty(SurfaceId::Fills);
-        self.mark_dirty(SurfaceId::Strokes);
-        self.mark_dirty(SurfaceId::InnerShadows);
-        self.mark_dirty(SurfaceId::TextDropShadows);
-
-        // Update transformations
-        self.apply_mut(surface_ids, |s| {
-            let canvas = s.canvas();
-            canvas.reset_matrix();
-            canvas.scale((scale, scale));
-            canvas.translate(translation);
-        });
+        self.apply_mut(
+            SurfaceId::Fills as u32
+                | SurfaceId::Strokes as u32
+                | SurfaceId::InnerShadows as u32
+                | SurfaceId::TextDropShadows as u32,
+            |s| {
+                let canvas = s.canvas();
+                canvas.reset_matrix();
+                canvas.scale((scale, scale));
+                canvas.translate(translation);
+            },
+        );
    }

    #[inline]
@@ -326,21 +264,19 @@ impl Surfaces {
    pub fn draw_rect_to(&mut self, id: SurfaceId, shape: &Shape, paint: &Paint) {
        if let Some(corners) = shape.shape_type.corners() {
            let rrect = RRect::new_rect_radii(shape.selrect, &corners);
-            self.canvas_and_mark_dirty(id).draw_rrect(rrect, paint);
+            self.canvas(id).draw_rrect(rrect, paint);
        } else {
-            self.canvas_and_mark_dirty(id)
-                .draw_rect(shape.selrect, paint);
+            self.canvas(id).draw_rect(shape.selrect, paint);
        }
    }

    pub fn draw_circle_to(&mut self, id: SurfaceId, shape: &Shape, paint: &Paint) {
-        self.canvas_and_mark_dirty(id)
-            .draw_oval(shape.selrect, paint);
+        self.canvas(id).draw_oval(shape.selrect, paint);
    }

    pub fn draw_path_to(&mut self, id: SurfaceId, shape: &Shape, paint: &Paint) {
        if let Some(path) = shape.get_skia_path() {
-            self.canvas_and_mark_dirty(id).draw_path(&path, paint);
+            self.canvas(id).draw_path(&path, paint);
        }
    }

@@ -368,9 +304,6 @@ impl Surfaces {
        self.canvas(SurfaceId::UI)
            .clear(skia::Color::TRANSPARENT)
            .reset_matrix();
-
-        // Clear all dirty flags after reset
-        self.clear_all_dirty();
    }

    pub fn cache_current_tile_texture(
--- a/render-wasm/src/render/text.rs
+++ b/render-wasm/src/render/text.rs
@@ -192,7 +192,7 @@ pub fn render(
            }
        }

-        let canvas = render_state.surfaces.canvas_and_mark_dirty(target_surface);
+        let canvas = render_state.surfaces.canvas(target_surface);
        render_text_on_canvas(canvas, shape, paragraph_builders, shadow, blur);
        return;
    }
@@ -371,7 +371,7 @@ pub fn render_as_path(
 ) {
    let canvas = render_state
        .surfaces
-        .canvas_and_mark_dirty(surface_id.unwrap_or(SurfaceId::Fills));
+        .canvas(surface_id.unwrap_or(SurfaceId::Fills));

    for (path, paint) in paths {
        // Note: path can be empty
@@ -397,7 +397,7 @@ pub fn render_position_data(
        let rect = Rect::from_xywh(pd.x, pd.y, pd.width, pd.height);
        render_state
            .surfaces
-            .canvas_and_mark_dirty(surface_id)
+            .canvas(surface_id)
            .draw_rect(rect, &paint);
    }
 }
--- a/render-wasm/src/shapes.rs
+++ b/render-wasm/src/shapes.rs
@@ -90,18 +90,6 @@ impl Type {
        }
    }

-    pub fn clear_corners(&mut self) {
-        match self {
-            Type::Rect(data) => {
-                data.corners = None;
-            }
-            Type::Frame(data) => {
-                data.corners = None;
-            }
-            _ => {}
-        }
-    }
-
    pub fn path(&self) -> Option<&Path> {
        match self {
            Type::Path(path) => Some(path),
@@ -706,11 +694,9 @@ impl Shape {
    pub fn set_corners(&mut self, raw_corners: (f32, f32, f32, f32)) {
        if let Some(corners) = make_corners(raw_corners) {
            self.shape_type.set_corners(corners);
-        } else {
-            self.shape_type.clear_corners();
+            self.invalidate_bounds();
+            self.invalidate_extrect();
        }
-        self.invalidate_bounds();
-        self.invalidate_extrect();
    }

    pub fn set_svg(&mut self, svg: skia::svg::Dom) {
@@ -934,13 +920,8 @@ impl Shape {
            }

            Type::Group(_) | Type::Frame(_) if !self.clip_content => {
-                // For frames and groups, we must always calculate extrect for all children
-                // to ensure accurate bounds that include nested content across all tiles.
-                // Using selrect for children can cause frames to be incorrectly omitted from
-                // tiles where they have nested content.
                for child_id in self.children_ids_iter(false) {
                    if let Some(child_shape) = shapes_pool.get(child_id) {
-                        // Always calculate full extrect for children to ensure accurate bounds
                        let child_extrect = child_shape.calculate_extrect(shapes_pool, scale);
                        rect.join(child_extrect);
                    }
@@ -1438,100 +1419,6 @@ impl Shape {
        !self.fills.is_empty()
    }

-    /// Determines if this frame or group can be flattened (doesn't affect children visually)
-    /// A container can be flattened if it has no visual effects that affect its children
-    /// and doesn't render its own content (no fills/strokes)
-    pub fn can_flatten(&self) -> bool {
-        // Only frames and groups can be flattened
-        if !matches!(self.shape_type, Type::Frame(_) | Type::Group(_)) {
-            return false;
-        }
-
-        // Cannot flatten if it has visual effects that affect children:
-
-        if self.clip_content {
-            return false;
-        }
-
-        if !self.transform.is_identity() {
-            return false;
-        }
-
-        if self.opacity != 1.0 {
-            return false;
-        }
-
-        if self.blend_mode() != BlendMode::default() {
-            return false;
-        }
-
-        if self.blur.is_some() {
-            return false;
-        }
-
-        if !self.shadows.is_empty() {
-            return false;
-        }
-
-        if let Type::Group(group) = &self.shape_type {
-            if group.masked {
-                return false;
-            }
-        }
-
-        if self.hidden {
-            return false;
-        }
-
-        // If the container itself has fills/strokes, it renders something visible
-        // We cannot flatten containers that render their own background/border
-        // because they need to be rendered even if they don't affect children
-        if self.has_fills() || self.has_visible_strokes() {
-            return false;
-        }
-
-        true
-    }
-
-    /// Checks if this shape needs a layer for rendering due to visual effects
-    /// (opacity < 1.0, non-default blend mode, or frame clip layer blur)
-    pub fn needs_layer(&self) -> bool {
-        self.opacity() < 1.0
-            || self.blend_mode().0 != skia::BlendMode::SrcOver
-            || self.has_frame_clip_layer_blur()
-            || (matches!(self.shape_type, Type::Group(g) if g.masked))
-    }
-
-    /// Checks if this frame has clip layer blur (affects children)
-    /// A frame has clip layer blur if it clips content and has layer blur
-    pub fn has_frame_clip_layer_blur(&self) -> bool {
-        self.frame_clip_layer_blur().is_some()
-    }
-
-    /// Returns the frame clip layer blur if this frame has one
-    /// A frame has clip layer blur if it clips content and has layer blur
-    pub fn frame_clip_layer_blur(&self) -> Option<Blur> {
-        use crate::shapes::BlurType;
-        match self.shape_type {
-            Type::Frame(_) if self.clip_content => self.blur.filter(|blur| {
-                !blur.hidden && blur.blur_type == BlurType::LayerBlur && blur.value > 0.0
-            }),
-            _ => None,
-        }
-    }
-
-    /// Checks if this shape has visual effects that might extend its bounds beyond selrect
-    /// Shapes with these effects require expensive extrect calculation for accurate visibility checks
-    pub fn has_effects_that_extend_bounds(&self) -> bool {
-        !self.shadows.is_empty()
-            || self.blur.is_some()
-            || !self.strokes.is_empty()
-            || !self.transform.is_identity()
-            || !math::is_close_to(self.rotation, 0.0)
-            || matches!(self.shape_type, Type::Group(_) | Type::Frame(_))
-            || matches!(self.shape_type, Type::Text(_))
-    }
-
    pub fn count_visible_inner_strokes(&self) -> usize {
        self.visible_strokes()
            .filter(|s| s.kind == StrokeKind::Inner)
@@ -1605,13 +1492,6 @@ mod tests {
        } else {
            unreachable!();
        }
-
-        shape.set_corners((0.0, 0.0, 0.0, 0.0));
-        if let Type::Rect(Rect { corners, .. }) = shape.shape_type {
-            assert_eq!(corners, None);
-        } else {
-            unreachable!();
-        }
    }

    #[test]
--- a/render-wasm/src/state.rs
+++ b/render-wasm/src/state.rs
@@ -100,16 +100,6 @@ impl<'a> State<'a> {
    }

    pub fn start_render_loop(&mut self, timestamp: i32) -> Result<(), String> {
-        // If zoom changed, we MUST rebuild the tile index before using it.
-        // Otherwise, the index will have tiles from the old zoom level, causing visible
-        // tiles to appear empty. This can happen if start_render_loop() is called before
-        // set_view_end() finishes rebuilding the index, or if set_view_end() hasn't been
-        // called yet.
-        let zoom_changed = self.render_state.zoom_changed();
-        if zoom_changed {
-            self.rebuild_tiles_shallow();
-        }
-
        self.render_state
            .start_render_loop(None, &self.shapes, timestamp, false)?;
        Ok(())
Author	SHA1	Message	Date
Alonso Torres	47775a9e2c	Merge pull request #8134 from penpot/alotor-fix-plugins-export 🐛 Fix problem with export in plugins	2026-01-20 15:03:04 +01:00
Andrey Antukh	8191d04114	✨ Use non-legacy config example on docker compose file	2026-01-20 13:25:55 +01:00
Andrey Antukh	88f0f75174	Merge pull request #8129 from penpot/niwinz-staging-bugfix-1 ✨ Several improvements for build process	2026-01-20 12:26:55 +01:00
Andrey Antukh	1ffa956251	✨ Include timestamp on version tag	2026-01-20 12:26:39 +01:00
Andrey Antukh	31054099ff	✨ Use pseudo-names on release builds of frontend (#8105 )	2026-01-20 12:26:39 +01:00
Eva Marco	983487d73c	🐛 Fix shadow token reference validation (#8128 )	2026-01-20 10:56:27 +01:00