diff --git a/frontend/src/app/main/data/workspace/libraries.cljs b/frontend/src/app/main/data/workspace/libraries.cljs
index e0f03ff49d..a20a6bb7ff 100644
--- a/frontend/src/app/main/data/workspace/libraries.cljs
+++ b/frontend/src/app/main/data/workspace/libraries.cljs
@@ -27,10 +27,13 @@
    [app.util.i18n :refer [tr]]
    [app.util.router :as rt]
    [app.util.time :as dt]
+   [app.util.logging :as log]
    [beicon.core :as rx]
    [cljs.spec.alpha :as s]
    [potok.core :as ptk]))
 
+(log/set-level! :warn)
+
 (declare sync-file)
 
 (defn default-color-name [color]
@@ -438,7 +441,7 @@
     ptk/WatchEvent
     (watch [_ state stream]
       ;; ===== Uncomment this to debug =====
-      ;; (js/console.info "##### RESET-COMPONENT of shape" (str id))
+      (log/info :msg "RESET-COMPONENT of shape" :id (str id))
       (let [[rchanges uchanges]
             (dwlh/generate-sync-shape-and-children-components (get state :current-page-id)
                                                               nil
@@ -447,7 +450,7 @@
                                                               (get state :workspace-libraries)
                                                               true)]
         ;; ===== Uncomment this to debug =====
-        ;; (js/console.debug "rchanges" (clj->js rchanges))
+        (log/debug :msg "RESET-COMPONENT finished" :js/rchanges rchanges)
 
         (rx/of (dwc/commit-changes rchanges uchanges {:commit-local? true}))))))
 
@@ -461,7 +464,7 @@
     ptk/WatchEvent
     (watch [_ state stream]
       ;; ===== Uncomment this to debug =====
-      ;; (js/console.info "##### UPDATE-COMPONENT of shape" (str id))
+      (log/info :msg "UPDATE-COMPONENT of shape" :id (str id))
       (let [page-id (:current-page-id state)
             objects (dwc/lookup-page-objects state page-id)
             shape   (get objects id)
@@ -474,7 +477,7 @@
                                               (get state :workspace-libraries))]
 
         ;; ===== Uncomment this to debug =====
-        ;; (js/console.debug "rchanges" (clj->js rchanges))
+        (log/debug :msg "UPDATE-COMPONENT finished" :js/rchanges rchanges)
 
         (rx/of (dwc/commit-changes rchanges uchanges {:commit-local? true}))))))
 
@@ -497,7 +500,7 @@
     ptk/WatchEvent
     (watch [_ state stream]
       ;; ===== Uncomment this to debug =====
-      (js/console.info "##### SYNC-FILE" (str (or file-id "local")))
+      (log/info :msg "SYNC-FILE" :file (str (or file-id "local")))
       (let [library-changes [(dwlh/generate-sync-library :components file-id state)
                              (dwlh/generate-sync-library :colors file-id state)
                              (dwlh/generate-sync-library :typographies file-id state)]
@@ -511,7 +514,7 @@
                                (->> library-changes (remove nil?) (map second) (flatten))
                                (->> file-changes (remove nil?) (map second) (flatten)))]
         ;; ===== Uncomment this to debug =====
-        ;; (js/console.debug "rchanges" (clj->js rchanges))
+        (log/debug :msg "SYNC-FILE finished" :js/rchanges rchanges)
         (rx/concat
           (rx/of (dm/hide-tag :sync-dialog))
           (when rchanges
@@ -538,14 +541,14 @@
     ptk/WatchEvent
     (watch [_ state stream]
       ;; ===== Uncomment this to debug =====
-      (js/console.info "##### SYNC-FILE" (str (or file-id "local")) "(2nd stage)")
+      (log/info :msg "SYNC-FILE (2nd stage)" :file (str (or file-id "local")))
       (let [[rchanges1 uchanges1] (dwlh/generate-sync-file :components nil state)
             [rchanges2 uchanges2] (dwlh/generate-sync-library :components file-id state)
             rchanges (d/concat rchanges1 rchanges2)
             uchanges (d/concat uchanges1 uchanges2)]
         (when rchanges
           ;; ===== Uncomment this to debug =====
-          ;; (js/console.debug "rchanges" (clj->js rchanges))
+          (log/debug :msg "SYNC-FILE (2nd stage) finished" :js/rchanges rchanges)
           (rx/of (dwc/commit-changes rchanges uchanges {:commit-local? true})))))))
 
 (def ignore-sync
diff --git a/frontend/src/app/main/data/workspace/libraries_helpers.cljs b/frontend/src/app/main/data/workspace/libraries_helpers.cljs
index c1b57cf950..92df54412e 100644
--- a/frontend/src/app/main/data/workspace/libraries_helpers.cljs
+++ b/frontend/src/app/main/data/workspace/libraries_helpers.cljs
@@ -15,8 +15,11 @@
    [app.common.pages-helpers :as cph]
    [app.common.geom.point :as gpt]
    [app.common.pages :as cp]
+   [app.util.logging :as log]
    [app.util.text :as ut]))
 
+(log/set-level! :warn)
+
 (defonce empty-changes [[] []])
 
 (defonce color-sync-attrs
@@ -97,10 +100,13 @@
   "Generate changes to synchronize all shapes in all pages of the current file,
   with the given asset of the given library."
   [asset-type library-id state]
-
   (s/assert #{:colors :components :typographies} asset-type)
   (s/assert (s/nilable ::us/uuid) library-id)
 
+  (log/info :msg "Sync local file with library"
+            :asset-type asset-type
+            :library (str (or library-id "local")))
+
   (let [library-items
         (if (nil? library-id)
           (get-in state [:workspace-data asset-type])
@@ -129,7 +135,11 @@
   "Generate changes to synchronize all shapes inside components of the current
   file library, that use the given type of asset of the given library."
   [asset-type library-id state]
-  ;; (js/console.info "--- SYNC local library " (str asset-type) " from library " (str (or library-id "nil")))
+
+  (log/info :msg "Sync local components with library"
+            :asset-type asset-type
+            :library (str (or library-id "local")))
+
   (let [library-items
         (if (nil? library-id)
           (get-in state [:workspace-data asset-type])
@@ -157,6 +167,11 @@
   "Generate changes to synchronize all shapes in a particular container
   (a page or a component) that are linked to the given library."
   [asset-type library-id state container page-id component-id]
+
+  (if page-id
+    (log/debug :msg "Sync page in local file" :page-id page-id)
+    (log/debug :msg "Sync component in local library" :component-id component-id))
+
   (let [has-asset-reference? (has-asset-reference-fn asset-type library-id)
         linked-shapes (cph/select-objects has-asset-reference? container)]
     (loop [shapes (seq linked-shapes)
@@ -336,6 +351,7 @@
   If reset? is true, all changed attributes will be copied and the 'touched'
   flags in the instance shape will be cleared."
   [page-id component-id shape-id local-file libraries reset?]
+  (log/debug :msg "Sync shape and children" :shape (str shape-id) :reset? reset?)
   (let [container      (cph/get-container page-id component-id local-file)
         shape          (cph/get-shape container shape-id)
         component      (cph/get-component (:component-id shape)
@@ -356,6 +372,9 @@
 
 (defn- generate-sync-shape-and-children-normal
   [page-id component-id container shape component root-shape root-component reset?]
+  (log/trace :msg "Sync shape (normal)"
+             :shape (str (:name shape))
+             :component (:name component))
   (let [[rchanges uchanges]
         (generate-sync-shape<-component shape
                                         root-shape
@@ -399,6 +418,9 @@
 
 (defn- generate-sync-shape-and-children-nested
   [page-id component-id container shape component root-shape root-component reset?]
+  (log/trace :msg "Sync shape (nested)"
+             :shape (str (:name shape))
+             :component (:name component))
   (let [component-shape (d/seek #(= (:shape-ref %)
                                     (:shape-ref shape))
                                 (vals (:objects component)))
@@ -447,6 +469,7 @@
   And if the component shapes are, in turn, instances of a second component,
   their 'touched' flags will be set accordingly."
   [page-id shape-id local-file libraries]
+  (log/debug :msg "Sync inverse shape and children" :shape (str shape-id))
   (let [page           (cph/get-container page-id nil local-file)
         shape          (cph/get-shape page shape-id)
         component      (cph/get-component (:component-id shape)
@@ -464,6 +487,9 @@
 
 (defn- generate-sync-shape-inverse-normal
   [page shape component root-shape root-component]
+  (log/trace :msg "Sync shape inverse (normal)"
+             :shape (str (:name shape))
+             :component (:name component))
   (let [[rchanges uchanges]
         (generate-sync-shape->component shape
                                         root-shape
@@ -499,6 +525,9 @@
 
 (defn- generate-sync-shape-inverse-nested
   [page shape component root-shape root-component]
+  (log/trace :msg "Sync shape inverse (nested)"
+             :shape (str (:name shape))
+             :component (:name component))
   (let [component-shape (d/seek #(= (:shape-ref %)
                                     (:shape-ref shape))
                                 (vals (:objects component)))
@@ -558,18 +587,12 @@
   "Generate changes to synchronize one shape inside a component, with other
   shape that is linked to it."
   [shape root-shape root-component component page-id]
-  ;; ===== Uncomment this to debug =====
-  ;; (js/console.log "component" (clj->js component))
   (if (nil? component)
     empty-changes
     (let [component-shape (get (:objects component) (:shape-ref shape))]
-      ;; ===== Uncomment this to debug =====
-      ;; (js/console.log "component-shape" (clj->js component-shape))
       (if (nil? component-shape)
         empty-changes
-        (let [;; ===== Uncomment this to debug =====
-              ;; _(js/console.info "update" (:name shape) "->" (:name component-shape))
-              [rchanges1 uchanges1]
+        (let [[rchanges1 uchanges1]
               (update-attrs component-shape
                             shape
                             root-component
@@ -680,13 +703,11 @@
                      set-touched? false
                      copy-touched? false}}]
 
-  ;; === Uncomment this to debug synchronization ===
-  ;; (println "SYNC"
-  ;;          (:name origin-shape)
-  ;;          "->"
-  ;;          (if page-id "[W]" "[C]")
-  ;;          (:name dest-shape)
-  ;;          (str options))
+  (log/info :msg (str "SYNC "
+                      (:name origin-shape)
+                      " -> "
+                      (if page-id "[W] " "[C] ")
+                      (:name dest-shape)))
 
   (let [; The position attributes need a special sync algorith, because we do
         ; not synchronize the absolute position, but the position relative of