Merge pull request #5304 from penpot/niwinz-minor-improvements-renderer

✨ Make workspace and features system aware of render.wasm loading

frontend/package.json

@@ -20,6 +20,7 @@
     "build:app:assets": "node ./scripts/build-app-assets.js",
     "build:storybook": "yarn run build:storybook:assets && yarn run build:storybook:cljs && storybook build",
     "build:storybook:assets": "node ./scripts/build-storybook-assets.js",
+    "build:wasm": "../render-wasm/build",
     "build:storybook:cljs": "clojure -M:dev:shadow-cljs compile storybook",
     "build:app:libs": "node ./scripts/build-libs.js",
     "build:app:main": "clojure -M:dev:shadow-cljs release main worker",

frontend/scripts/build

@@ -20,6 +20,7 @@ yarn install || exit 1;
 rm -rf resources/public;
 rm -rf target/dist;
 
+yarn run build:wasm || exit 1;
 yarn run build:app:main --config-merge "{:release-version \"${CURRENT_HASH}-${TS}\"}" $EXTRA_PARAMS || exit 1
 yarn run build:app:libs || exit 1;
 yarn run build:app:assets || exit 1;

frontend/src/app/main/data/workspace.cljs

@@ -76,6 +76,7 @@
    [app.main.repo :as rp]
    [app.main.streams :as ms]
    [app.main.worker :as uw]
+   [app.render-wasm :as render.wasm]
    [app.util.dom :as dom]
    [app.util.globals :as ug]
    [app.util.http :as http]
@@ -264,14 +265,21 @@
     (watch [_ _ stream]
       (->> (rp/cmd! :get-project {:id project-id})
            (rx/mapcat (fn [project]
-                        (->> (rp/cmd! :get-team {:id (:team-id project)})
-                             (rx/mapcat (fn [team]
-                                          (let [bundle {:team team
-                                                        :project project
-                                                        :file-id file-id
-                                                        :project-id project-id}]
-                                            (rx/of (du/set-current-team team)
-                                                   (ptk/data-event ::bundle-stage-1 bundle))))))))
+                        (rx/concat
+                         ;; Wait the wasm module to be loaded or failed to
+                         ;; load. We need to wait the promise to be resolved
+                         ;; before continue with the next workspace loading
+                         ;; steps
+                         (->> (rx/from render.wasm/module)
+                              (rx/ignore))
+                         (->> (rp/cmd! :get-team {:id (:team-id project)})
+                              (rx/mapcat (fn [team]
+                                           (let [bundle {:team team
+                                                         :project project
+                                                         :file-id file-id
+                                                         :project-id project-id}]
+                                             (rx/of (du/set-current-team team)
+                                                    (ptk/data-event ::bundle-stage-1 bundle)))))))))
            (rx/take-until
             (rx/filter (ptk/type? ::fetch-bundle) stream))))))
 
@@ -354,13 +362,12 @@
       (let [stoper-s (rx/filter (ptk/type? ::finalize-file) stream)]
         (rx/merge
          (rx/of (ntf/hide)
+                ;; We initialize the features without knowning the
+                ;; team specific features in this step.
                 (features/initialize)
                 (dcm/retrieve-comment-threads file-id)
                 (fetch-bundle project-id file-id))
 
-        ;;  (when (contains? cf/flags :renderer-v2)
-        ;;    (rx/of (renderer/init)))
-
          (->> stream
               (rx/filter dch/commit?)
               (rx/map deref)

frontend/src/app/main/features.cljs

@@ -12,6 +12,7 @@
    [app.common.logging :as log]
    [app.config :as cf]
    [app.main.store :as st]
+   [app.render-wasm :as render.wasm]
    [beicon.v2.core :as rx]
    [clojure.set :as set]
    [cuerdas.core :as str]
@@ -110,7 +111,7 @@
        (when *assert*
          (->> (rx/from cfeat/no-migration-features)
               ;; text editor v2 isn't enabled by default even in devenv
-              ;; wasm render v1 isn't enabled by default even in devenv              
+              ;; wasm render v1 isn't enabled by default even in devenv
               (rx/filter #(not (or (contains? cfeat/backend-only-features %)
                                    (= "text-editor/v2" %)
                                    (= "render-wasm/v1" %)
@@ -120,6 +121,11 @@
 
      ptk/EffectEvent
      (effect [_ state _]
+       (let [features (get-team-enabled-features state)]
+         (if (contains? features "render-wasm/v1")
+           (render.wasm/initialize true)
+           (render.wasm/initialize false)))
+
        (log/trc :hint "initialized features"
                 :team (str/join "," (:features-team state))
                 :runtime (str/join "," (:features-runtime state)))))))

frontend/src/app/main/ui/workspace/viewport.cljs

@@ -51,7 +51,6 @@
    [app.main.ui.workspace.viewport.utils :as utils]
    [app.main.ui.workspace.viewport.viewport-ref :refer [create-viewport-ref]]
    [app.main.ui.workspace.viewport.widgets :as widgets]
-   [app.render-wasm :as render.wasm]
    [app.util.debug :as dbg]
    [beicon.v2.core :as rx]
    [rumext.v2 :as mf]))
@@ -657,6 +656,7 @@
 
 (mf/defc viewport
   [props]
-  (if ^boolean render.wasm/enabled?
-    [:& viewport.wasm/viewport props]
-    [:& viewport-classic props]))
+  (let [wasm-renderer-enabled? (features/use-feature "render-wasm/v1")]
+    (if ^boolean wasm-renderer-enabled?
+      [:& viewport.wasm/viewport props]
+      [:& viewport-classic props])))

frontend/src/app/render_wasm.cljs

@@ -11,15 +11,12 @@
    [app.common.data.macros :as dm]
    [app.common.types.shape.impl :as ctsi]
    [app.common.uuid :as uuid]
-   [app.main.features :as features]
-   [app.main.store :as st]
    [app.util.object :as obj]
    [promesa.core :as p]))
 
-(def enabled?
-  (features/active-feature? @st/state "render-wasm/v1"))
-
-(set! app.common.types.shape.impl/enabled-wasm-ready-shape enabled?)
+(defn initialize
+  [enabled?]
+  (set! app.common.types.shape.impl/enabled-wasm-ready-shape enabled?))
 
 (defonce internal-module #js {})
 
@@ -139,16 +136,18 @@
     (obj/set! js/window "shape_list" (fn [] ((unchecked-get internal-module "_shape_list"))))))
 
 (defonce module
-  (->> (js/dynamicImport "/js/render_wasm.js")
-       (p/mcat (fn [module]
-                 (let [default (unchecked-get module "default")]
-                   (default))))
-       (p/fmap (fn [module]
-                 (set! internal-module module)
-                 true))
-       (p/merr (fn [cause]
-                 (js/console.error cause)
-                 (p/resolved false)))))
+  (if (exists? js/dynamicImport)
+    (->> (js/dynamicImport "/js/render_wasm.js")
+         (p/mcat (fn [module]
+                   (let [default (unchecked-get module "default")]
+                     (default))))
+         (p/fmap (fn [module]
+                   (set! internal-module module)
+                   true))
+         (p/merr (fn [cause]
+                   (js/console.error cause)
+                   (p/resolved false))))
+    (p/resolved false)))
 
 (set! app.common.types.shape.impl/wasm-create-shape create-shape)
 (set! app.common.types.shape.impl/wasm-use-shape use-shape)

render-wasm/build

@@ -1,6 +1,11 @@
 #!/usr/bin/env bash
 
-export _BUILD_MODE=${1:-debug};
+
+if [ "$NODE_ENV" = "production" ];  then
+    export _BUILD_MODE="release";
+else
+    export _BUILD_MODE=${1:-debug};
+fi
 
 export EMSDK_QUIET=1
 export EMCC_CFLAGS="--no-entry -s ERROR_ON_UNDEFINED_SYMBOLS=0 -s MAX_WEBGL_VERSION=2 -s MODULARIZE=1 -s EXPORT_NAME=createRustSkiaModule -s EXPORTED_RUNTIME_METHODS=GL -s ENVIRONMENT=web -s EXPORT_ES6=1 -sMODULARIZE"