Merge JS + enable minification + Lighthouse

assets/style.css

@@ -1,4 +1,4 @@
-.light-theme {
+.light {
 	--background: #FFF;
 	--header-bg: #8be0c0;
 	--dialog-bg: #EEE;
@@ -35,8 +35,8 @@ body {
 }
 
 button {
-	padding: 5px 8px;
-	font-size: 16px;
+	padding: 6px 8px;
+	font-size: 16.5px;
 	border: none;
 	border-radius: 7px;
 	cursor: pointer;

eslint.config.js

@@ -225,7 +225,7 @@ module.exports = [
 			globals: global
 		},
 		files: ["**/*.js"],
-		ignores: ["eslint.config.js", "assets/jszip.min.js"],
+		ignores: ["eslint.config.js", "minify.js", "assets/jszip.min.js"],
 		plugins: {
 			unicorn,
 			sonarjs,
@@ -240,7 +240,7 @@ module.exports = [
 				...globals.node
 			}
 		},
-		files: ["eslint.config.js"],
+		files: ["eslint.config.js", "minify.js"],
 		plugins: {
 			unicorn,
 			sonarjs,

index.html

@@ -15,7 +15,6 @@
 		<link href="./assets/images/icon-192x192.png" rel="apple-touch-icon" sizes="192x192">
 
 		<link rel="stylesheet" href="./assets/style.css">
-		<script src="./assets/analyzer.js"></script>
 		<script src="./assets/script.js"></script>
 		<script src="./assets/jszip.min.js" async></script>
 	</head>

minify.js

@@ -0,0 +1,50 @@
+const fsPromises = require("node:fs").promises
+const UglifyJS = require("uglify-js")
+
+const nameCache = {}
+const defaultOptions = {
+	compress: {
+		passes: 2,
+		unsafe: true,
+		unsafe_Function: true,
+		unsafe_math: true,
+		unsafe_proto: true,
+		unsafe_regexp: true
+	}
+}
+
+const minifyFile = async (path, options = {}) => {
+	const filename = path.split("/").pop()
+	const result = UglifyJS.minify({
+		[path]: await fsPromises.readFile(path, "utf8")
+	}, {
+		sourceMap: {
+			root: "https://pack-analyzer.pages.dev/assets/",
+			filename,
+			url: filename + ".map"
+		},
+		warnings: "verbose",
+		parse: {
+			shebang: false
+		},
+		nameCache,
+		mangle: true,
+		...defaultOptions,
+		...options
+	})
+
+	if (result.error) throw result.error
+	if (result.warnings && result.warnings.length > defaultOptions.compress.passes) console.log(path, result.warnings)
+
+	if (process.env.MINIFY_ENABLED) {
+		await fsPromises.writeFile(path, result.code)
+		await fsPromises.writeFile(path + ".map", result.map)
+	}
+}
+
+async function main() {
+	await minifyFile("./assets/script.js", {
+		module: false
+	})
+}
+main()

package.json

@@ -10,6 +10,12 @@
     "type": "git",
     "url": "https://github.com/DEVTomatoCake/Pack-Analyzer.git"
   },
+  "scripts": {
+    "minify": "node minify.js"
+  },
+  "dependencies": {
+    "uglify-js": "^3.17.4"
+  },
   "devDependencies": {
     "@html-eslint/eslint-plugin": "^0.23.1",
     "@html-eslint/parser": "^0.23.0",

serviceworker.js

@@ -18,8 +18,7 @@ self.addEventListener("install", event => {
 		const fallbackCache = await caches.open("fallback" + version)
 		fallbackCache.addAll([
 			"/assets/style.css",
-			"/assets/script.js",
-			"/assets/analyzer.js"
+			"/assets/script.js"
 		])
 	})())
 })