Full minify lib and inline modules, cache lib builds, app build modules

This commit is contained in:
octospacc 2023-09-29 00:19:44 +02:00
parent b375a33397
commit ddad1d4a8a
4 changed files with 79 additions and 59 deletions

View File

@ -1,4 +1,4 @@
<script src="Spacc.Web.js"></script>
<script src="SpaccDotWeb.js"></script>
<script id="Meta" type="text/json">{
"Name": "The Testing",
@ -12,7 +12,7 @@
Spacc.Select('#App').innerHTML = `
<p>1234</p>
<button >Log</button>
<button>Log</button>
`;
Spacc.Select('#App button').onclick = () => {

View File

@ -3,17 +3,18 @@ const SpaccDotWeb = ((args) => { //////////////////////////////////////////////
let windowObject, documentObject;
let Lib = {};
//let isDomVirtual = false;
let isBuildingApp = false;
let __scriptname;
const platformIsNode = (typeof module === 'object' && typeof module.exports === 'object');
const platformIsBrowser = (typeof window !== 'undefined' && typeof window.document !== 'undefined');
if (platformIsNode) {
Lib.fs = require('fs');
Lib.crypto = require('crypto');
Lib.childProcess = require('child_process');
Lib.jsdom = require('jsdom');
//isDomVirtual = true;
__scriptname = __filename.split('/').slice(-1)[0];
windowObject = new Lib.jsdom.JSDOM().window;
};
@ -30,29 +31,47 @@ const SpaccDotWeb = ((args) => { //////////////////////////////////////////////
let SpaccDotWeb = {};
if (platformIsNode) {
SpaccDotWeb.AppBuildStandalone = (fileIndex) => {
SpaccDotWeb.AppBuildStandalone = (opts) => {
isBuildingApp = true;
fileIndex ||= 'index.html';
opts ||= {};
opts.Page ||= 'index.html';
opts.Modules && !opts.Modules.includes('Main') && (opts.Modules = [...opts.Modules, 'Main']);
//isDomVirtual = true;
Lib.fs.mkdirSync(`${__dirname}/Build/${fileIndex}.tmp`, { recursive: true });
let htmlIndex = Lib.fs.readFileSync(fileIndex, 'utf8');
Lib.fs.mkdirSync(`${__dirname}/Build/App-${opts.Page}`, { recursive: true });
let htmlIndex = Lib.fs.readFileSync(opts.Page, 'utf8');
windowObject = new Lib.jsdom.JSDOM(htmlIndex).window;
documentObject = windowObject.document;
DomSetup();//SpaccDotWeb.AppInit();
DomSetup(opts.Modules);
Lib.fs.writeFileSync(`${__dirname}/Build/App-${opts.Page}/Full.html`, `<!DOCTYPE html>${documentObject.documentElement.outerHTML}`);
isBuildingApp = false;
Lib.fs.writeFileSync(`${__dirname}/Build/${fileIndex}`, `<!DOCTYPE html>${documentObject.documentElement.outerHTML}`);
};
SpaccDotWeb.LibBuild = () => {
Lib.fs.mkdirSync(`${__dirname}/Build/Assets.tmp`, { recursive: true });
let uptodate = true;
const compiledPath = `${__dirname}/Build/SpaccDotWeb.js`;
const minifiedPath = `${__dirname}/Build/SpaccDotWeb.min.js`;
const hashPath = `${__dirname}/Build/SpaccDotWeb.js.hash`;
const hashOld = (Lib.fs.existsSync(hashPath) && Lib.fs.readFileSync(hashPath, 'utf8'));
const hashNew = Lib.crypto.createHash('sha256').update(Lib.fs.readFileSync(__filename, 'utf8')).digest('hex');
if (!Lib.fs.existsSync(compiledPath) || !Lib.fs.existsSync(minifiedPath) || !(hashOld === hashNew)) {
uptodate = false;
Lib.fs.writeFileSync(hashPath, hashNew);
Lib.fs.writeFileSync(compiledPath, Lib.childProcess.execSync(`cat "${__filename}" | npx babel -f "${__scriptname}"`));
Lib.fs.writeFileSync(minifiedPath, Lib.childProcess.execSync(`cat "${compiledPath}" | npx uglifyjs`));
};
uptodate && console.log('Library is up-to-date.');
return { compiledText: Lib.fs.readFileSync(compiledPath, 'utf8'), minified: Lib.fs.readFileSync(minifiedPath, 'utf8') };
};
};
SpaccDotWeb.AppInit = function AppInit(){
try {
DomSetup();
} catch(err) { console.log(err) }
} catch(err) { console.log(err) };
};
//SpaccDotWeb.Make = () => {};
@ -73,7 +92,7 @@ SpaccDotWeb.Select = (query) => {
const AppMetaGet = () => JSON.parse(SpaccDotWeb.Select('#Meta').innerHTML);
const DomMakeBase = () => {
const DomMakeBase = (Modules) => {
const meta = AppMetaGet();
const htmlFrags = {
@ -84,14 +103,21 @@ const DomMakeBase = () => {
let scripts = '';
if (isBuildingApp/*isDomVirtual*/) {
const SpaccMinified = Lib.childProcess.execSync(`cat "${__filename}" | npx babel -f "${__filename.split('/').slice(-1)[0]}"`);
if (isBuildingApp) {
scripts += `<scr`+`ipt src="http://cdn.jsdelivr.net/npm/core-js-bundle/minified.min.js"></scr`+`ipt>`;
scripts += `<scr`+`ipt src="https://cdn.jsdelivr.net/npm/core-js-bundle/minified.min.js"></scr`+`ipt>`;
scripts += `<scr`+`ipt>${SpaccMinified}</scr`+`ipt>`;
//scripts += `<scr`+`ipt src="https://example.com/Spacc.Web.min.js"></scr`+`ipt>`;
//scripts += `<scr`+`ipt>${Lib.fs.readFileSync(__filename, 'utf8')}</scr`+`ipt>`;
scripts += `<scr`+`ipt>${SpaccDotWeb.LibBuild().minified}</scr`+`ipt>`;
for (const elem of documentObject.querySelectorAll('script[module]')) {
scripts += elem.outerHTML;
if (!Modules || (Modules && Modules.includes(elem.getAttribute('module')))) {
if (elem.getAttribute('src')) {
scripts += `<scr`+`ipt src="${elem.getAttribute('src')}"></scr`+`ipt>`
} else {
const tmpHash = Lib.crypto.createHash('sha256').update(elem.innerHTML).digest('hex');
const tmpPath = `${__dirname}/Build/Assets.tmp/${tmpHash}.js`;
Lib.fs.writeFileSync(tmpPath, elem.innerHTML);
scripts += `<scr`+`ipt>${Lib.childProcess.execSync(`cat "${tmpPath}" | npx babel -f "${tmpHash}.js" | npx uglifyjs`)}</scr`+`ipt>`;
};
};
};
};
@ -102,18 +128,17 @@ const DomMakeBase = () => {
${htmlFrags.Title}
${htmlFrags.Description}
${htmlFrags.Uri}
<!--<scr ipt src="https://example.com/index.js"></scr ipt>-->
`,
body: `<div id="App"></div>${scripts}`,
};
};
const DomSetup = () => {
const DomSetup = (Modules) => {
const doctypeNew = documentObject.implementation.createHTMLDocument().doctype;
windowObject.document.doctype
? documentObject.replaceChild(doctypeNew, documentObject.doctype)
: documentObject.insertBefore(doctypeNew, documentObject.childNodes[0]);
const domBase = DomMakeBase();
const domBase = DomMakeBase(Modules);
documentObject.write(domBase.head + domBase.body);
documentObject.head.innerHTML = domBase.head;
documentObject.body.innerHTML = domBase.body;

59
package-lock.json generated
View File

@ -11,9 +11,8 @@
"@babel/cli": "^7.23.0",
"@babel/core": "^7.23.0",
"@babel/preset-env": "^7.22.20",
"@xmldom/xmldom": "^0.8.10",
"core-js": "^3.32.2",
"jsdom": "^22.1.0"
"jsdom": "^22.1.0",
"uglify-js": "^3.17.4"
}
},
"node_modules/@ampproject/remapping": {
@ -1760,15 +1759,6 @@
"node": ">= 10"
}
},
"node_modules/@xmldom/xmldom": {
"version": "0.8.10",
"resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.8.10.tgz",
"integrity": "sha512-2WALfTl4xo2SkGCYRt6rDTFfk9R1czmBvUQy12gK2KuRKIpWEhcbbzy8EZXtz/jkRqHX8bFEc6FC1HjX4TUWYw==",
"dev": true,
"engines": {
"node": ">=10.0.0"
}
},
"node_modules/abab": {
"version": "2.0.6",
"resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz",
@ -1898,9 +1888,9 @@
}
},
"node_modules/browserslist": {
"version": "4.21.11",
"resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.21.11.tgz",
"integrity": "sha512-xn1UXOKUz7DjdGlg9RrUr0GGiWzI97UQJnugHtH0OLDfJB7jMgoIkYvRIEO1l9EeEERVqeqLYOcFBW9ldjypbQ==",
"version": "4.22.1",
"resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.1.tgz",
"integrity": "sha512-FEVc202+2iuClEhZhrWy6ZiAcRLvNMyYcxZ8raemul1DYVOVdFsbqckWLdsixQZCpJlwe77Z3UTalE7jsjnKfQ==",
"dev": true,
"funding": [
{
@ -1917,8 +1907,8 @@
}
],
"dependencies": {
"caniuse-lite": "^1.0.30001538",
"electron-to-chromium": "^1.4.526",
"caniuse-lite": "^1.0.30001541",
"electron-to-chromium": "^1.4.535",
"node-releases": "^2.0.13",
"update-browserslist-db": "^1.0.13"
},
@ -1930,9 +1920,9 @@
}
},
"node_modules/caniuse-lite": {
"version": "1.0.30001539",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001539.tgz",
"integrity": "sha512-hfS5tE8bnNiNvEOEkm8HElUHroYwlqMMENEzELymy77+tJ6m+gA2krtHl5hxJaj71OlpC2cHZbdSMX1/YEqEkA==",
"version": "1.0.30001541",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001541.tgz",
"integrity": "sha512-bLOsqxDgTqUBkzxbNlSBt8annkDpQB9NdzdTbO2ooJ+eC/IQcvDspDc058g84ejCelF7vHUx57KIOjEecOHXaw==",
"dev": true,
"funding": [
{
@ -2039,17 +2029,6 @@
"integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
"dev": true
},
"node_modules/core-js": {
"version": "3.32.2",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.32.2.tgz",
"integrity": "sha512-pxXSw1mYZPDGvTQqEc5vgIb83jGQKFGYWY76z4a7weZXUolw3G+OvpZqSRcfYOoOVUQJYEPsWeQK8pKEnUtWxQ==",
"dev": true,
"hasInstallScript": true,
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/core-js"
}
},
"node_modules/core-js-compat": {
"version": "3.32.2",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.32.2.tgz",
@ -2134,9 +2113,9 @@
}
},
"node_modules/electron-to-chromium": {
"version": "1.4.529",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.529.tgz",
"integrity": "sha512-6uyPyXTo8lkv8SWAmjKFbG42U073TXlzD4R8rW3EzuznhFS2olCIAfjjQtV2dV2ar/vRF55KUd3zQYnCB0dd3A==",
"version": "1.4.536",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.536.tgz",
"integrity": "sha512-L4VgC/76m6y8WVCgnw5kJy/xs7hXrViCFdNKVG8Y7B2isfwrFryFyJzumh3ugxhd/oB1uEaEEvRdmeLrnd7OFA==",
"dev": true
},
"node_modules/entities": {
@ -2923,6 +2902,18 @@
"node": ">=14"
}
},
"node_modules/uglify-js": {
"version": "3.17.4",
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.17.4.tgz",
"integrity": "sha512-T9q82TJI9e/C1TAxYvfb16xO120tMVFZrGA3f9/P4424DNu6ypK103y0GPFVa17yotwSyZW5iYXgjYHkGrJW/g==",
"dev": true,
"bin": {
"uglifyjs": "bin/uglifyjs"
},
"engines": {
"node": ">=0.8.0"
}
},
"node_modules/unicode-canonical-property-names-ecmascript": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz",

View File

@ -1,11 +1,15 @@
{
"name": "SpaccDotWeb",
"version": "indev",
"scripts": {
"build:lib": "node ./SpaccDotWeb.js 'SpaccDotWeb.LibBuild()'",
"build:clear": "rm -rf ./Build"
},
"devDependencies": {
"@babel/cli": "^7.23.0",
"@babel/core": "^7.23.0",
"@babel/preset-env": "^7.22.20",
"@xmldom/xmldom": "^0.8.10",
"jsdom": "^22.1.0"
"jsdom": "^22.1.0",
"uglify-js": "^3.17.4"
}
}