@inglorious/web 4.1.4 → 4.1.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inglorious/web",
-  "version": "4.1.4",
+  "version": "4.1.6",
   "description": "A new web framework that leverages the power of the Inglorious Store combined with the performance and simplicity of lit-html.",
   "author": "IceOnFire <antony.mistretta@gmail.com> (https://ingloriouscoderz.it)",
   "license": "MIT",
@@ -68,7 +68,7 @@
   "dependencies": {
     "@lit-labs/ssr-client": "^1.1.8",
     "lit-html": "^3.3.1",
-    "@inglorious/store": "9.3.1",
+    "@inglorious/store": "9.4.0",
     "@inglorious/utils": "3.7.3"
   },
   "devDependencies": {

package/src/mount.js

@@ -1,4 +1,3 @@
-import { hydrate } from "@lit-labs/ssr-client"
 import { html, render } from "lit-html"
 
 /**
@@ -8,25 +7,27 @@ import { html, render } from "lit-html"
  * @param {HTMLElement | DocumentFragment} element - The DOM element to mount the template to.
  * @returns {() => void} An unsubscribe function
  */
-export function mount(store, renderFn, element) {
+export async function mount(store, renderFn, element) {
   const api = { ...store._api }
   api.render = createRender(api)
 
   let shouldHydrate = element.hasChildNodes()
 
-  const unsubscribe = store.subscribe(() => {
+  // If we need to hydrate, load the heavy lifting only now
+  if (shouldHydrate) {
+    const { hydrate } = await import("@lit-labs/ssr-client")
     const template = renderFn(api)
+    hydrate(template, element)
+    shouldHydrate = false
+  }
 
-    if (shouldHydrate) {
-      hydrate(template, element)
-      shouldHydrate = false
-    } else {
-      render(template, element)
-    }
+  const unsubscribe = store.subscribe(() => {
+    const template = renderFn(api)
+    // Standard render is already in the main bundle (it's small)
+    render(template, element)
   })
 
   store.notify("init")
-
   return unsubscribe
 }