Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-13 02:28:18 -05:00
Code Issues Activity

✨ Changed grid render for performance

Browse source
This commit is contained in:
alonso.torres 2021-01-25 12:45:37 +01:00
parent 6a077c967a
commit 4513033634
2 changed files with 27 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -81,7 +81,7 @@
(when component
[:> component (obj/set! props "key" index)
(for [[index child] (d/enumerate children)]
(let [props (-> props
(let [props (-> (obj/clone props)
(obj/set! "node" child)
(obj/set! "index" index))]
[:> render-node props]))])))))

47
frontend/src/app/main/ui/workspace/frame_grid.cljs
View file

@ -15,35 +15,36 @@
[app.common.math :as mth]
[app.common.pages :as cp]
[app.common.geom.shapes :as gsh]
[app.util.geom.grid :as gg]))
[app.util.geom.grid :as gg]
[app.common.uuid :as uuid]))
(mf/defc square-grid [{:keys [frame zoom grid] :as props}]
(let [{:keys [color size] :as params} (-> grid :params)
(let [grid-id (mf/use-memo #(uuid/next))
{:keys [color size] :as params} (-> grid :params)
{color-value :color color-opacity :opacity} (-> grid :params :color)
;; Support for old color format
color-value (or color-value (:value (get-in grid [:params :color :value])))
{frame-width :width frame-height :height :keys [x y]} frame]
(when (> size 0)
color-value (or color-value (:value (get-in grid [:params :color :value])))]
[:g.grid
[:*
(for [xs (range size frame-width size)]
[:line {:key (str (:id frame) "-y-" xs)
:x1 (mth/round (+ x xs))
:y1 (mth/round y)
:x2 (mth/round (+ x xs))
:y2 (mth/round (+ y frame-height))
:style {:stroke color-value
[:defs
[:pattern {:id grid-id
:x (:x frame)
:y (:y frame)
:width size
:height size
:pattern-units "userSpaceOnUse"}
[:path {:d (str "M " size " " 0 " "
"L " 0 " " 0 " " 0 " " size " ")
:style {:fill "none"
:stroke color-value
:stroke-opacity color-opacity
:stroke-width (str (/ 1 zoom))}}])
(for [ys (range size frame-height size)]
[:line {:key (str (:id frame) "-x-" ys)
:x1 (mth/round x)
:y1 (mth/round (+ y ys))
:x2 (mth/round (+ x frame-width))
:y2 (mth/round (+ y ys))
:style {:stroke color-value
:stroke-opacity color-opacity
:stroke-width (str (/ 1 zoom))}}])]])))
:stroke-width (str (/ 1 zoom))}}]]]
[:rect {:x (:x frame)
:y (:y frame)
:width (:width frame)
:height (:height frame)
:fill (str "url(#" grid-id ")")}]]))
(mf/defc layout-grid [{:keys [key frame zoom grid]}]
(let [{color-value :color color-opacity :opacity} (-> grid :params :color)