feat: improve client runtime bundle size & output

marko-js · Oct 8, 2021 · 423a88a · 423a88a
1 parent 3777c0d
commit 423a88a
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 23 deletions.
diff --git a/src/components/micro-frame/util/stream/web.component.ts b/src/components/micro-frame/util/stream/web.component.ts
@@ -14,27 +14,22 @@ interface State {
   err: undefined | Error;
 }
 
-export = class {
-  input!: Input;
-  state!: State;
-  el!: HTMLDivElement;
-  src: string | undefined;
-  controller?: AbortController;
+export = {
   onCreate() {
     this.state = {
       loading: false,
       err: undefined,
     };
-  }
+  },
   onMount() {
     // Only trigger a new load if this wasn't ssr'd, or the src has changed.
     this.src = this.el.dataset.ssr;
     this.el.removeAttribute("data-ssr");
     this.onUpdate();
-  }
+  },
   onDestroy() {
     this.controller?.abort();
-  }
+  },
   async onUpdate() {
     if (this.src === this.input.src) return;
 
@@ -48,10 +43,7 @@ export = class {
       const res = await fetch(this.src, {
         cache: this.input.cache,
         signal: controller.signal,
-        headers: {
-          ...this.input.headers,
-          accept: "text/html",
-        },
+        headers: Object.assign({}, this.input.headers, { accept: "text/html" }),
       });
       if (!res.ok) throw new Error(res.statusText);
       const reader = res.body!.getReader();
@@ -79,5 +71,15 @@ export = class {
         if (!this.input.catch) throw err;
       }
     }
-  }
+  },
+} as {
+  input: Input;
+  state: State;
+  el: HTMLDivElement;
+  src: string | undefined;
+  controller: AbortController | undefined;
+  onUpdate(): unknown;
+  onCreate(): unknown;
+  onMount(): unknown;
+  onDestroy(): unknown;
 };
diff --git a/src/components/micro-frame/util/writable-dom.ts b/src/components/micro-frame/util/writable-dom.ts
@@ -1,16 +1,14 @@
 type Options = {
   target: ParentNode;
   previousSibling?: ChildNode | null;
-  signal?: AbortSignal;
-  onLoad?(): void;
+  signal: AbortSignal;
+  onLoad(): void;
 };
 
-const noop = () => {};
-
 export = function toWritable({
   target,
   signal,
-  onLoad = noop,
+  onLoad,
   previousSibling,
 }: Options) {
   const doc = document.implementation.createHTMLDocument("");
@@ -19,22 +17,21 @@ export = function toWritable({
   const walker = doc.createTreeWalker(root);
   const targetNodes = new WeakMap<Node, Node>([[root, target]]);
   const nextSibling = previousSibling ? previousSibling.nextSibling : null;
-  const canContinue = () => !(signal && signal.aborted);
   let pendingText: Text | null = null;
   let scanNode: Node | null = null;
   let isBlocked = false;
   let isClosed = false;
 
   return {
     close() {
-      if (canContinue()) {
+      if (!signal.aborted) {
         doc.close();
         isClosed = true;
         if (!isBlocked) onLoad();
       }
     },
     write(chunk: string) {
-      if (canContinue()) {
+      if (!signal.aborted) {
         doc.write(chunk);
 
         if (pendingText) {
@@ -78,7 +75,7 @@ export = function toWritable({
             clone.onload = clone.onerror = () => {
               isBlocked = false;
               // Continue the normal content injecting walk.
-              if (canContinue()) walk();
+              if (!signal.aborted) walk();
             };
           }
         }