From 901fc02d78c3d5d8755e2b68f92d97b7ba7118b8 Mon Sep 17 00:00:00 2001 From: shadowtime2000 <66655515+shadowtime2000@users.noreply.github.com> Date: Mon, 2 Nov 2020 17:34:46 -0800 Subject: [PATCH 1/6] feat: preload all scripts --- html.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/html.ts b/html.ts index ef55a23f1..6366355a1 100644 --- a/html.ts +++ b/html.ts @@ -20,7 +20,7 @@ export function createHtml({ if (!util.isString(v) && util.isNEString(v.src)) { if (v.type === 'module') { return `` - } else if (v.async === true) { + } else { return `` } } From fbd3b5f3cb6e401314b0f52900c7c46e145b21f8 Mon Sep 17 00:00:00 2001 From: shadowtime2000 <66655515+shadowtime2000@users.noreply.github.com> Date: Mon, 2 Nov 2020 17:44:12 -0800 Subject: [PATCH 2/6] refactor: a refactor --- html.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/html.ts b/html.ts index 6366355a1..e5793b7fc 100644 --- a/html.ts +++ b/html.ts @@ -20,9 +20,8 @@ export function createHtml({ if (!util.isString(v) && util.isNEString(v.src)) { if (v.type === 'module') { return `` - } else { - return `` } + return `` } return '' })).filter(Boolean) From 82e6d68b3035a89d81d2786ee1f5fa51b684a33b Mon Sep 17 00:00:00 2001 From: shadowtime2000 <66655515+shadowtime2000@users.noreply.github.com> Date: Mon, 2 Nov 2020 18:32:29 -0800 Subject: [PATCH 3/6] feat: preload aleph library files --- html.ts | 96 +++++++++++++++++++++++++++++++++++---------------------- 1 file changed, 59 insertions(+), 37 deletions(-) diff --git a/html.ts b/html.ts index e5793b7fc..43c720942 100644 --- a/html.ts +++ b/html.ts @@ -1,64 +1,86 @@ -import util from './util.ts' +import util from "./util.ts"; export function createHtml({ - lang = 'en', + lang = "en", head = [], scripts = [], body, - minify = false + minify = false, }: { - lang?: string, - head?: string[], - scripts?: (string | { id?: string, type?: string, src?: string, innerText?: string, nomodule?: boolean, async?: boolean, preload?: boolean })[], - body: string, - minify?: boolean + lang?: string; + head?: string[]; + scripts?: + (string | { + id?: string; + type?: string; + src?: string; + innerText?: string; + nomodule?: boolean; + async?: boolean; + preload?: boolean; + })[]; + body: string; + minify?: boolean; }) { - const eol = minify ? '' : '\n' - const indent = minify ? '' : ' '.repeat(4) - const headTags = head.map(tag => tag.trim()) - .concat(scripts.map(v => { + const eol = minify ? "" : "\n"; + const indent = minify ? "" : " ".repeat(4); + const headTags = head.map((tag) => tag.trim()) + .concat(scripts.map((v) => { if (!util.isString(v) && util.isNEString(v.src)) { - if (v.type === 'module') { - return `` + if (v.type === "module") { + return ``; } - return `` + return ``; } - return '' - })).filter(Boolean) - const scriptTags = scripts.map(v => { + return ""; + })) + .concat( + [ + "/_aleph/-/deno.land/x/aleph/error.js", + "/_aleph/-/deno.land/x/aleph/aleph.js", + "/_aleph/-/deno.land/x/aleph/context.js", + "/_aleph/-/deno.land/x/aleph/events.js" + ].map((v) => + `` + ), + ) + .filter(Boolean); + const scriptTags = scripts.map((v) => { if (util.isString(v)) { - return `` + return ``; } else if (util.isNEString(v.innerText)) { - const { innerText, ...rest } = v - return `${eol}${innerText}${eol}${indent}` + const { innerText, ...rest } = v; + return `${eol}${innerText}${eol}${indent}`; } else if (util.isNEString(v.src) && !v.preload) { - return `` + return ``; } else { - return '' + return ""; } - }).filter(Boolean) + }).filter(Boolean); return [ - '', + "", ``, - '', + "", indent + '', - ...headTags.map(tag => indent + tag), - '', - '', + ...headTags.map((tag) => indent + tag), + "", + "", indent + body, - ...scriptTags.map(tag => indent + tag), - '', - '' - ].join(eol) + ...scriptTags.map((tag) => indent + tag), + "", + "", + ].join(eol); } function attrString(v: any): string { - return Object.keys(v).map(k => { + return Object.keys(v).map((k) => { if (v[k] === true) { - return ` ${k}` + return ` ${k}`; } else { - return ` ${k}=${JSON.stringify(String(v[k]))}` + return ` ${k}=${JSON.stringify(String(v[k]))}`; } - }).join('') + }).join(""); } From f94257ca9991b9c50261db5d4b15086d3525322b Mon Sep 17 00:00:00 2001 From: shadowtime2000 <66655515+shadowtime2000@users.noreply.github.com> Date: Tue, 3 Nov 2020 08:28:32 -0800 Subject: [PATCH 4/6] fix: modulepreload aleph library files --- html.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/html.ts b/html.ts index 43c720942..1f8f2f0e6 100644 --- a/html.ts +++ b/html.ts @@ -42,7 +42,7 @@ export function createHtml({ "/_aleph/-/deno.land/x/aleph/context.js", "/_aleph/-/deno.land/x/aleph/events.js" ].map((v) => - `` + `` ), ) .filter(Boolean); From db1cd35e12b70a0ae51a822624fa32d0cd048428 Mon Sep 17 00:00:00 2001 From: shadowtime2000 <66655515+shadowtime2000@users.noreply.github.com> Date: Tue, 3 Nov 2020 09:11:31 -0800 Subject: [PATCH 5/6] refactor: move preloading of library files to project.ts --- html.ts | 4 ++-- project.ts | 4 ++++ 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/html.ts b/html.ts index 1f8f2f0e6..80f0c89a5 100644 --- a/html.ts +++ b/html.ts @@ -35,7 +35,7 @@ export function createHtml({ } return ""; })) - .concat( + /*.concat( [ "/_aleph/-/deno.land/x/aleph/error.js", "/_aleph/-/deno.land/x/aleph/aleph.js", @@ -44,7 +44,7 @@ export function createHtml({ ].map((v) => `` ), - ) + )*/ .filter(Boolean); const scriptTags = scripts.map((v) => { if (util.isString(v)) { diff --git a/project.ts b/project.ts index 73e1b1554..ce76f0167 100644 --- a/project.ts +++ b/project.ts @@ -276,6 +276,10 @@ export class Project { data ? { type: 'application/json', innerText: JSON.stringify(data), id: 'ssr-data' } : '', { src: util.cleanPath(`${baseUrl}/_aleph/main.${mainModule.hash.slice(0, hashShort)}.js`), type: 'module' }, { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/nomodule.js${this.isDev ? '?dev' : ''}`), nomodule: true }, + { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/error.js`), type: 'module', preload: true }, + { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/aleph.js`), type: 'module', preload: true }, + { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/context.js`), type: 'module', preload: true }, + { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/events.js`), type: 'module', preload: true }, ...scripts ], body, From c7ce5b36a878581b0426463b277fe7894a676f47 Mon Sep 17 00:00:00 2001 From: shadowtime2000 <66655515+shadowtime2000@users.noreply.github.com> Date: Tue, 3 Nov 2020 09:48:06 -0800 Subject: [PATCH 6/6] refactor: inject preload scripts with function call --- project.ts | 20 +++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/project.ts b/project.ts index ce76f0167..26470d6d9 100644 --- a/project.ts +++ b/project.ts @@ -260,6 +260,18 @@ export class Project { return [status, data] } + getPreloadScripts(baseUrl: string) { + const scripts = [ + '-/deno.land/x/aleph/aleph.js', + '-/deno.land/x/aleph/context.js', + '-/deno.land/x/aleph/error.js', + '-/deno.land/x/aleph/events.js', + '-/deno.land/x/aleph/routing.js,', + '-/deno.land/x/aleph/util.js' + ] + return scripts.map(src => ({ src: `${baseUrl}${src}`, type: 'module', preload: true })) + } + async getPageHtml(loc: { pathname: string, search?: string }): Promise<[number, string, Record | null]> { if (!this.isSSRable(loc.pathname)) { const [url] = this.#routing.createRouter(loc) @@ -275,11 +287,7 @@ export class Project { scripts: [ data ? { type: 'application/json', innerText: JSON.stringify(data), id: 'ssr-data' } : '', { src: util.cleanPath(`${baseUrl}/_aleph/main.${mainModule.hash.slice(0, hashShort)}.js`), type: 'module' }, - { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/nomodule.js${this.isDev ? '?dev' : ''}`), nomodule: true }, - { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/error.js`), type: 'module', preload: true }, - { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/aleph.js`), type: 'module', preload: true }, - { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/context.js`), type: 'module', preload: true }, - { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/events.js`), type: 'module', preload: true }, + ...this.getPreloadScripts(baseUrl), ...scripts ], body, @@ -297,6 +305,7 @@ export class Project { scripts: [ { src: util.cleanPath(`${baseUrl}/_aleph/main.${mainModule.hash.slice(0, hashShort)}.js`), type: 'module' }, { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/nomodule.js${this.isDev ? '?dev' : ''}`), nomodule: true }, + ...this.getPreloadScripts(baseUrl) ], head: customLoading?.head || [], body: `
${customLoading?.body || ''}
`, @@ -383,6 +392,7 @@ export class Project { data ? { type: 'application/json', innerText: JSON.stringify(data), id: 'ssr-data' } : '', { src: util.cleanPath(`${baseUrl}/_aleph/main.${mainModule.hash.slice(0, hashShort)}.js`), type: 'module' }, { src: util.cleanPath(`${baseUrl}/_aleph/-/deno.land/x/aleph/nomodule.js${this.isDev ? '?dev' : ''}`), nomodule: true }, + ...this.getPreloadScripts(baseUrl), ...scripts ], body,