0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-21 04:01:24 -05:00

🐛 Improve fonts loading related to thumbnals rendering

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
frontend/src/app

View file

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

View file

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

View file

@ -16,10 +16,13 @@
(defn- load-fonts!
[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)
(into #{default} (keep :font-id))
(run! fonts/ensure-loaded!))))
(into #{default} (keep extract-fn))
(run! (fn [[font-id variant-id]]
(when (some? font-id)
(fonts/ensure-loaded! font-id variant-id)))))))
(mf/defc text-shape
{::mf/wrap-props false}

View file

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