solid-js 1.3.0-beta.1 → 1.3.0-beta.2

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "solid-js",
   "description": "A declarative JavaScript library for building user interfaces.",
-  "version": "1.3.0-beta.1",
+  "version": "1.3.0-beta.2",
   "author": "Ryan Carniato",
   "license": "MIT",
   "homepage": "https://github.com/solidjs/solid#readme",
@@ -132,5 +132,5 @@
     "compiler",
     "performance"
   ],
-  "gitHead": "148c4c7d4f55842ec606364a972ce9abeb46c324"
+  "gitHead": "afe407af6463d4956c2c283370895b4d02b205e8"
 }

package/web/dist/dev.cjs

@@ -219,11 +219,6 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}) {
   }
 }
 function hydrate(code, element) {
-  if (!globalThis._$HY.sync) {
-    let dispose;
-    globalThis._$HY.queue.push(() => dispose = hydrate(code, element));
-    return () => dispose();
-  }
   solidJs.sharedConfig.completed = globalThis._$HY.completed;
   solidJs.sharedConfig.events = globalThis._$HY.events;
   solidJs.sharedConfig.load = globalThis._$HY.load;

package/web/dist/dev.js

@@ -216,11 +216,6 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}) {
   }
 }
 function hydrate(code, element) {
-  if (!globalThis._$HY.sync) {
-    let dispose;
-    globalThis._$HY.queue.push(() => dispose = hydrate(code, element));
-    return () => dispose();
-  }
   sharedConfig.completed = globalThis._$HY.completed;
   sharedConfig.events = globalThis._$HY.events;
   sharedConfig.load = globalThis._$HY.load;

package/web/dist/server.cjs

@@ -233,7 +233,6 @@ function stringifyString(str) {
 }
 
 const REPLACE_SCRIPT = `function $df(e,t){t=document.getElementById(e),document.getElementById("pl"+e).replaceWith(...t.childNodes),_$HY.set(e)}`;
-const SYNC_SCRIPT = `_$HY.sync=!0;for(let e=0;e<_$HY.queue.length;e++)_$HY.queue[e]()`;
 function renderToString(code, options = {}) {
   solidJs.sharedConfig.context = {
     id: "",
@@ -243,7 +242,7 @@ function renderToString(code, options = {}) {
     nonce: options.nonce
   };
   let html = resolveSSRNode(escape(code()));
-  return injectAssets(solidJs.sharedConfig.context.assets, html) + `<script${options.nonce ? ` nonce="${options.nonce}"` : ""}>${SYNC_SCRIPT}</script>`;
+  return injectAssets(solidJs.sharedConfig.context.assets, html);
 }
 function renderToStringAsync(code, options = {}) {
   const {
@@ -263,9 +262,9 @@ function renderToStringAsync(code, options = {}) {
   solidJs.sharedConfig.context.writeResource = (id, p) => p.then(d => scripts += `_$HY.set("${id}", ${devalue(d)});`);
   const timeout = new Promise((_, reject) => setTimeout(() => reject("renderToString timed out"), timeoutMs));
   return Promise.race([asyncWrap(() => escape(code())), timeout]).then(res => {
-    let html = resolveSSRNode(res);
-    html += `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts.length ? scripts + ";" : ""}${SYNC_SCRIPT}</script>`;
-    return injectAssets(context.assets, html);
+    let html = injectAssets(context.assets, resolveSSRNode(res));
+    if (scripts.length) html = injectScripts(html, scripts, nonce);
+    return html;
   });
 }
 function renderToPipeableStream(code, options) {
@@ -342,7 +341,8 @@ function renderToPipeableStream(code, options) {
   let html = resolveSSRNode(escape(code()));
   html = injectAssets(solidJs.sharedConfig.context.assets, html);
   Promise.resolve().then(() => {
-    buffer.write(html + `<script${nonce ? ` nonce="${nonce}"` : ""}>${tasks.length ? tasks.join(";") + ";" : ""}${SYNC_SCRIPT}</script>`);
+    if (tasks.length) html = injectScripts(html, tasks.join(";"), nonce);
+    buffer.write(html);
     tasks.length = 0;
     scheduled = false;
     onCompleteShell && onCompleteShell();
@@ -446,7 +446,8 @@ function pipeToWritable(code, writable, options = {}) {
   let html = resolveSSRNode(escape(code()));
   html = injectAssets(solidJs.sharedConfig.context.assets, html);
   Promise.resolve().then(() => {
-    buffer.write(encoder.encode(html + `<script${nonce ? ` nonce="${nonce}"` : ""}>${tasks.length ? tasks.join(";") + ";" : ""}${SYNC_SCRIPT}</script>`));
+    if (tasks.length) html = injectScripts(html, tasks.join(";"), nonce);
+    buffer.write(encoder.encode(html));
     tasks.length = 0;
     scheduled = false;
     onCompleteShell && onCompleteShell(result);
@@ -611,7 +612,7 @@ function generateHydrationScript({
   eventNames = ["click", "input"],
   nonce
 }) {
-  return `<script${nonce ? ` nonce="${nonce}"` : ""}>((e,t,o={})=>{t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host instanceof Node?e.host:e.parentNode)),["${eventNames.join('","')}"].forEach((o=>document.addEventListener(o,(o=>{let n=o.composedPath&&o.composedPath()[0]||o.target,s=t(n);s&&!e.completed.has(s)&&e.events.push([s,o])})))),e.init=(e,t)=>{o[e]=[new Promise((e=>t=e)),t]},e.set=(e,t,n)=>{if(!(n=o[e]))return o[e]=[t];n[1](t)},e.load=(e,t)=>{if(t=o[e])return t[0]}})(window._$HY||(_$HY={events:[],completed:new WeakSet,queue:[]}));</script>`;
+  return `<script${nonce ? ` nonce="${nonce}"` : ""}>((e,t,o={})=>{t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host instanceof Node?e.host:e.parentNode)),["${eventNames.join('","')}"].forEach((o=>document.addEventListener(o,(o=>{let n=o.composedPath&&o.composedPath()[0]||o.target,s=t(n);s&&!e.completed.has(s)&&e.events.push([s,o])})))),e.init=(e,t)=>{o[e]=[new Promise((e=>t=e)),t]},e.set=(e,t,n)=>{if(!(n=o[e]))return o[e]=[t];n[1](t)},e.load=(e,t)=>{if(t=o[e])return t[0]}})(window._$HY||(_$HY={events:[],completed:new WeakSet}));</script><!xs>`;
 }
 function injectAssets(assets, html) {
   for (let i = 0; i < assets.length; i++) {
@@ -619,6 +620,14 @@ function injectAssets(assets, html) {
   }
   return html;
 }
+function injectScripts(html, scripts, nonce) {
+  const tag = `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts}</script>`;
+  const index = html.indexOf("<!xs>");
+  if (index > -1) {
+    return html.slice(0, index) + tag + html.slice(index);
+  }
+  return html + tag;
+}
 const FRAGMENT_REPLACE = /<!\[([\d.]+)\]>/;
 function asyncWrap(fn) {
   return new Promise(resolve => {

package/web/dist/server.js

@@ -230,7 +230,6 @@ function stringifyString(str) {
 }
 
 const REPLACE_SCRIPT = `function $df(e,t){t=document.getElementById(e),document.getElementById("pl"+e).replaceWith(...t.childNodes),_$HY.set(e)}`;
-const SYNC_SCRIPT = `_$HY.sync=!0;for(let e=0;e<_$HY.queue.length;e++)_$HY.queue[e]()`;
 function renderToString(code, options = {}) {
   sharedConfig.context = {
     id: "",
@@ -240,7 +239,7 @@ function renderToString(code, options = {}) {
     nonce: options.nonce
   };
   let html = resolveSSRNode(escape(code()));
-  return injectAssets(sharedConfig.context.assets, html) + `<script${options.nonce ? ` nonce="${options.nonce}"` : ""}>${SYNC_SCRIPT}</script>`;
+  return injectAssets(sharedConfig.context.assets, html);
 }
 function renderToStringAsync(code, options = {}) {
   const {
@@ -260,9 +259,9 @@ function renderToStringAsync(code, options = {}) {
   sharedConfig.context.writeResource = (id, p) => p.then(d => scripts += `_$HY.set("${id}", ${devalue(d)});`);
   const timeout = new Promise((_, reject) => setTimeout(() => reject("renderToString timed out"), timeoutMs));
   return Promise.race([asyncWrap(() => escape(code())), timeout]).then(res => {
-    let html = resolveSSRNode(res);
-    html += `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts.length ? scripts + ";" : ""}${SYNC_SCRIPT}</script>`;
-    return injectAssets(context.assets, html);
+    let html = injectAssets(context.assets, resolveSSRNode(res));
+    if (scripts.length) html = injectScripts(html, scripts, nonce);
+    return html;
   });
 }
 function renderToPipeableStream(code, options) {
@@ -339,7 +338,8 @@ function renderToPipeableStream(code, options) {
   let html = resolveSSRNode(escape(code()));
   html = injectAssets(sharedConfig.context.assets, html);
   Promise.resolve().then(() => {
-    buffer.write(html + `<script${nonce ? ` nonce="${nonce}"` : ""}>${tasks.length ? tasks.join(";") + ";" : ""}${SYNC_SCRIPT}</script>`);
+    if (tasks.length) html = injectScripts(html, tasks.join(";"), nonce);
+    buffer.write(html);
     tasks.length = 0;
     scheduled = false;
     onCompleteShell && onCompleteShell();
@@ -443,7 +443,8 @@ function pipeToWritable(code, writable, options = {}) {
   let html = resolveSSRNode(escape(code()));
   html = injectAssets(sharedConfig.context.assets, html);
   Promise.resolve().then(() => {
-    buffer.write(encoder.encode(html + `<script${nonce ? ` nonce="${nonce}"` : ""}>${tasks.length ? tasks.join(";") + ";" : ""}${SYNC_SCRIPT}</script>`));
+    if (tasks.length) html = injectScripts(html, tasks.join(";"), nonce);
+    buffer.write(encoder.encode(html));
     tasks.length = 0;
     scheduled = false;
     onCompleteShell && onCompleteShell(result);
@@ -608,7 +609,7 @@ function generateHydrationScript({
   eventNames = ["click", "input"],
   nonce
 }) {
-  return `<script${nonce ? ` nonce="${nonce}"` : ""}>((e,t,o={})=>{t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host instanceof Node?e.host:e.parentNode)),["${eventNames.join('","')}"].forEach((o=>document.addEventListener(o,(o=>{let n=o.composedPath&&o.composedPath()[0]||o.target,s=t(n);s&&!e.completed.has(s)&&e.events.push([s,o])})))),e.init=(e,t)=>{o[e]=[new Promise((e=>t=e)),t]},e.set=(e,t,n)=>{if(!(n=o[e]))return o[e]=[t];n[1](t)},e.load=(e,t)=>{if(t=o[e])return t[0]}})(window._$HY||(_$HY={events:[],completed:new WeakSet,queue:[]}));</script>`;
+  return `<script${nonce ? ` nonce="${nonce}"` : ""}>((e,t,o={})=>{t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host instanceof Node?e.host:e.parentNode)),["${eventNames.join('","')}"].forEach((o=>document.addEventListener(o,(o=>{let n=o.composedPath&&o.composedPath()[0]||o.target,s=t(n);s&&!e.completed.has(s)&&e.events.push([s,o])})))),e.init=(e,t)=>{o[e]=[new Promise((e=>t=e)),t]},e.set=(e,t,n)=>{if(!(n=o[e]))return o[e]=[t];n[1](t)},e.load=(e,t)=>{if(t=o[e])return t[0]}})(window._$HY||(_$HY={events:[],completed:new WeakSet}));</script><!xs>`;
 }
 function injectAssets(assets, html) {
   for (let i = 0; i < assets.length; i++) {
@@ -616,6 +617,14 @@ function injectAssets(assets, html) {
   }
   return html;
 }
+function injectScripts(html, scripts, nonce) {
+  const tag = `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts}</script>`;
+  const index = html.indexOf("<!xs>");
+  if (index > -1) {
+    return html.slice(0, index) + tag + html.slice(index);
+  }
+  return html + tag;
+}
 const FRAGMENT_REPLACE = /<!\[([\d.]+)\]>/;
 function asyncWrap(fn) {
   return new Promise(resolve => {

package/web/dist/web.cjs

@@ -218,11 +218,6 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}) {
   }
 }
 function hydrate(code, element) {
-  if (!globalThis._$HY.sync) {
-    let dispose;
-    globalThis._$HY.queue.push(() => dispose = hydrate(code, element));
-    return () => dispose();
-  }
   solidJs.sharedConfig.completed = globalThis._$HY.completed;
   solidJs.sharedConfig.events = globalThis._$HY.events;
   solidJs.sharedConfig.load = globalThis._$HY.load;

package/web/dist/web.js

@@ -215,11 +215,6 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}) {
   }
 }
 function hydrate(code, element) {
-  if (!globalThis._$HY.sync) {
-    let dispose;
-    globalThis._$HY.queue.push(() => dispose = hydrate(code, element));
-    return () => dispose();
-  }
   sharedConfig.completed = globalThis._$HY.completed;
   sharedConfig.events = globalThis._$HY.events;
   sharedConfig.load = globalThis._$HY.load;