Isomorphic hydration: skip re-render when server HTML present
sx-mount now checks if the target element has children (server- rendered HTML). If so, skips the client re-render and only runs hydration (process-elements, hydrate-islands, hydrate-elements). This preserves server-rendered CSSX styling and avoids the flash of unstyled content that occurred when the client replaced the server HTML before re-rendering. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
23
web/boot.sx
23
web/boot.sx
@@ -79,16 +79,19 @@
|
||||
;; extra-env: optional extra bindings dict
|
||||
(let ((el (resolve-mount-target target)))
|
||||
(when el
|
||||
(let ((node (sx-render-with-env source extra-env)))
|
||||
(dom-set-text-content el "")
|
||||
(dom-append el node)
|
||||
;; Hoist head elements from rendered content
|
||||
(hoist-head-elements-full el)
|
||||
;; Process sx- attributes, hydrate data-sx and islands
|
||||
(process-elements el)
|
||||
(sx-hydrate-elements el)
|
||||
(sx-hydrate-islands el)
|
||||
(run-post-render-hooks))))))
|
||||
;; If the server already rendered content (isomorphic SSR),
|
||||
;; skip re-render — just hydrate the existing DOM.
|
||||
(when (empty? (dom-child-list el))
|
||||
(let ((node (sx-render-with-env source extra-env)))
|
||||
(dom-set-text-content el "")
|
||||
(dom-append el node)
|
||||
;; Hoist head elements from rendered content
|
||||
(hoist-head-elements-full el)))
|
||||
;; Process sx- attributes, hydrate data-sx and islands
|
||||
(process-elements el)
|
||||
(sx-hydrate-elements el)
|
||||
(sx-hydrate-islands el)
|
||||
(run-post-render-hooks)))))
|
||||
|
||||
|
||||
;; --------------------------------------------------------------------------
|
||||
|
||||
Reference in New Issue
Block a user