3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-08-07 14:38:33 +02:00
Code Issues Projects Releases Packages Wiki Activity

🐛 Improve fonts loading related to thumbnals rendering

Browse source
This commit is contained in:
Andrey Antukh 2023-06-22 13:19:48 +02:00
parent a97929992e
commit 433b1b68c3
4 changed files with 44 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

1
frontend/src/app/config.cljs
View file

@ -79,6 +79,7 @@
"unknown" "unknown"
date))) date)))
;; --- Globar Config Vars ;; --- Globar Config Vars
(def default-theme "default") (def default-theme "default")

52
frontend/src/app/main/fonts.cljs
View file

@ -82,8 +82,12 @@
;; FONTS LOADING ;; FONTS LOADING
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defonce loaded (l/atom #{})) (defonce ^:dynamic loaded (l/atom #{}))
(defonce loading (l/atom {})) (defonce ^:dynamic loading (l/atom {}))
;; NOTE: mainly used on worker, when you don't really need load font
;; only know if the font is needed or not
(defonce ^:dynamic loaded-hints (l/atom #{}))
(defn- create-link-element (defn- create-link-element
[uri] [uri]
@ -190,34 +194,35 @@
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn ensure-loaded! (defn ensure-loaded!
[id] ([font-id] (ensure-loaded! font-id nil))
(log/debug :action "try-ensure-loaded!" :font-id id) ([font-id variant-id]
(if-not (exists? js/window) (log/debug :action "try-ensure-loaded!" :font-id font-id :variant-id variant-id)
(if-not (exists? js/window)
;; If we are in the worker environment, we just mark it as loaded ;; If we are in the worker environment, we just mark it as loaded
;; without really loading it. ;; without really loading it.
(do (do
(swap! loaded conj id) (swap! loaded-hints conj {:font-id font-id :font-variant-id variant-id})
(p/resolved id)) (p/resolved font-id))
(let [font (get @fontsdb id)] (let [font (get @fontsdb font-id)]
(cond (cond
(nil? font) (nil? font)
(p/resolved id) (p/resolved font-id)
;; Font already loaded, we just continue ;; Font already loaded, we just continue
(contains? @loaded id) (contains? @loaded font-id)
(p/resolved id) (p/resolved font-id)
;; Font is currently downloading. We attach the caller to the promise ;; Font is currently downloading. We attach the caller to the promise
(contains? @loading id) (contains? @loading font-id)
(p/resolved (get @loading id)) (p/resolved (get @loading font-id))
;; First caller, we create the promise and then wait ;; First caller, we create the promise and then wait
:else :else
(let [on-load (fn [resolve] (let [on-load (fn [resolve]
(swap! loaded conj id) (swap! loaded conj font-id)
(swap! loading dissoc id) (swap! loading dissoc font-id)
(resolve id)) (resolve font-id))
load-p (p/create load-p (p/create
(fn [resolve _] (fn [resolve _]
@ -225,8 +230,8 @@
(assoc ::on-loaded (partial on-load resolve)) (assoc ::on-loaded (partial on-load resolve))
(load-font))))] (load-font))))]
(swap! loading assoc id load-p) (swap! loading assoc font-id load-p)
load-p))))) load-p))))))
(defn ready (defn ready
[cb] [cb]
@ -294,14 +299,7 @@
(mapv second))) (mapv second)))
(defn render-font-styles (defn render-font-styles
[ids] [font-refs]
(->> (rx/from ids) (->> (rx/from font-refs)
(rx/mapcat (fn [font-id]
(let [font (get @fontsdb font-id)]
(->> (:variants font [])
(map :id)
(map (fn [variant-id]
{:font-id font-id
:font-variant-id variant-id}))))))
(rx/mapcat fetch-font-css) (rx/mapcat fetch-font-css)
(rx/reduce (fn [acc css] (dm/str acc "\n" css)) ""))) (rx/reduce (fn [acc css] (dm/str acc "\n" css)) "")))

9
frontend/src/app/main/ui/shapes/text.cljs
View file

@ -16,10 +16,13 @@
(defn- load-fonts! (defn- load-fonts!
[content] [content]
(let [default (:font-id txt/default-text-attrs)] (let [extract-fn (juxt :font-id :font-variant-id)
default (extract-fn txt/default-text-attrs)]
(->> (tree-seq map? :children content) (->> (tree-seq map? :children content)
(into #{default} (keep :font-id)) (into #{default} (keep extract-fn))
(run! fonts/ensure-loaded!)))) (run! (fn [[font-id variant-id]]
(when (some? font-id)
(fonts/ensure-loaded! font-id variant-id)))))))
(mf/defc text-shape (mf/defc text-shape
{::mf/wrap-props false} {::mf/wrap-props false}

23
frontend/src/app/worker/thumbnails.cljs
View file

@ -18,6 +18,7 @@
[app.util.webapi :as wapi] [app.util.webapi :as wapi]
[app.worker.impl :as impl] [app.worker.impl :as impl]
[beicon.core :as rx] [beicon.core :as rx]
[okulary.core :as l]
[promesa.core :as p] [promesa.core :as p]
[rumext.v2 :as mf])) [rumext.v2 :as mf]))
@ -61,18 +62,18 @@
(defn- render-thumbnail (defn- render-thumbnail
[{:keys [page file-id revn] :as params}] [{:keys [page file-id revn] :as params}]
(let [objects (:objects page) (binding [fonts/loaded-hints (l/atom #{})]
frame (some->> page :thumbnail-frame-id (get objects)) (let [objects (:objects page)
element (if frame frame (some->> page :thumbnail-frame-id (get objects))
(mf/element render/frame-svg #js {:objects objects :frame frame :show-thumbnails? true}) element (if frame
(mf/element render/page-svg #js {:data page :thumbnails? true :render-embed? true})) (mf/element render/frame-svg #js {:objects objects :frame frame :show-thumbnails? true})
data (rds/renderToStaticMarkup element) (mf/element render/page-svg #js {:data page :thumbnails? true :render-embed? true}))
font-ids (into @fonts/loaded (map first) @fonts/loading)] data (rds/renderToStaticMarkup element)]
{:data data {:data data
:fonts font-ids :fonts @fonts/loaded-hints
:file-id file-id :file-id file-id
:revn revn})) :revn revn})))
(defmethod impl/handler :thumbnails/generate-for-file (defmethod impl/handler :thumbnails/generate-for-file
[{:keys [file-id revn features] :as message} _] [{:keys [file-id revn features] :as message} _]