From aeebfd82dba61b2c4b0f258e04062dc789e2bd1c Mon Sep 17 00:00:00 2001 From: notgne2 Date: Sun, 22 Dec 2019 23:52:39 -0700 Subject: [PATCH] more optimizations and tweaks --- default.nix | 7 +++-- package.json | 3 ++- pnpm-lock.yaml | 54 +++++++++++++++++++++++++++++++++++--- webpack.config.js | 66 +++++++++++++++++++++++++++++------------------ 4 files changed, 96 insertions(+), 34 deletions(-) diff --git a/default.nix b/default.nix index 54c0908..63f5373 100644 --- a/default.nix +++ b/default.nix @@ -112,12 +112,12 @@ let document.body.appendChild(sourceTarget) ''; - templateHtml = pkgs.writeText "template-html" '' + templateHtml = pkgs.writeText "template.html" '' - <%= htmlWebpackPlugin.options.title %> + ${prettyName} @@ -155,8 +155,7 @@ let - - + ''; in diff --git a/package.json b/package.json index 9a58558..433fbca 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,7 @@ "copy-webpack-plugin": "^5.1.1", "elm-webpack-loader": "^6.0.1", "favicons-webpack-plugin": "^1.0.2", + "html-loader": "^0.5.5", "html-webpack-plugin": "^3.2.0", "imagemin-webpack-plugin": "^2.4.2", "jsdom": "^15.2.1", @@ -22,4 +23,4 @@ "author": "notgne2", "license": "AGPL-3.0", "description": "" -} \ No newline at end of file +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f8425d2..b8c1f37 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -2,6 +2,7 @@ dependencies: copy-webpack-plugin: 5.1.1_webpack@4.41.4 elm-webpack-loader: 6.0.1 favicons-webpack-plugin: 1.0.2_webpack@4.41.4 + html-loader: 0.5.5 html-webpack-plugin: 3.2.0_webpack@4.41.4 imagemin-webpack-plugin: 2.4.2 jsdom: 15.2.1 @@ -875,6 +876,12 @@ packages: node: '>=0.10.0' resolution: integrity: sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c= + /ast-types/0.9.6: + dev: false + engines: + node: '>= 0.8' + resolution: + integrity: sha1-ECyenpAF0+fjgpvwxPok7oYu6bk= /async-each/1.0.3: dev: false resolution: @@ -2327,7 +2334,7 @@ packages: dev: false resolution: integrity: sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g== - /es-abstract/1.17.0-next.1: + /es-abstract/1.17.0: dependencies: es-to-primitive: 1.2.1 function-bind: 1.1.1 @@ -2344,7 +2351,7 @@ packages: engines: node: '>= 0.4' resolution: - integrity: sha512-7MmGr03N7Rnuid6+wyhD9sHNE2n4tFSwExnU2lQl3lIo2ShXWGePY80zYaoMOmILWv57H0amMjZGHNzzGG70Rw== + integrity: sha512-yYkE07YF+6SIBmg1MsJ9dlub5L48Ek7X0qz+c/CPCHS9EBXfESorzng4cJQjJW5/pB6vDF41u7F8vUhLVDqIug== /es-to-primitive/1.2.1: dependencies: is-callable: 1.1.5 @@ -2369,6 +2376,13 @@ packages: dev: false resolution: integrity: sha1-UQnWLz5W6pZ8S2NQWu8IKRyKUgM= + /es6-templates/0.2.3: + dependencies: + recast: 0.11.23 + through: 2.3.8 + dev: false + resolution: + integrity: sha1-XLmsn7He1usSOTQrgdeSu7QHjuQ= /escape-html/1.0.3: dev: false resolution: @@ -2684,6 +2698,10 @@ packages: dev: false resolution: integrity: sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc= + /fastparse/1.1.2: + dev: false + resolution: + integrity: sha512-483XLLxTVIwWK3QTrMGRqUfUpoOs/0hbQrl2oz4J0pAcm3A3bu84wxTFqGqkJzewCLdME38xJLJAxBABfQT8sQ== /favicons-webpack-plugin/1.0.2_webpack@4.41.4: dependencies: cache-loader: 3.0.1_webpack@4.41.4 @@ -3426,6 +3444,16 @@ packages: dev: false resolution: integrity: sha512-71lZziiDnsuabfdYiUeWdCVyKuqwWi23L8YeIgV9jSSZHCtb6wB1BKWooH7L3tn4/FuZJMVWyNaIDr4RGmaSYw== + /html-loader/0.5.5: + dependencies: + es6-templates: 0.2.3 + fastparse: 1.1.2 + html-minifier: 3.5.21 + loader-utils: 1.2.3 + object-assign: 4.1.1 + dev: false + resolution: + integrity: sha512-7hIW7YinOYUpo//kSYcPB6dCKoceKLmOwjEMmhIobHuWGDVl0Nwe4l68mdG/Ru0wcUxQjVMEoZpkalZ/SE7zog== /html-minifier/3.5.21: dependencies: camel-case: 3.0.0 @@ -5037,7 +5065,7 @@ packages: /object.getownpropertydescriptors/2.1.0: dependencies: define-properties: 1.1.3 - es-abstract: 1.17.0-next.1 + es-abstract: 1.17.0 dev: false engines: node: '>= 0.8' @@ -5054,7 +5082,7 @@ packages: /object.values/1.1.1: dependencies: define-properties: 1.1.3 - es-abstract: 1.17.0-next.1 + es-abstract: 1.17.0 function-bind: 1.1.1 has: 1.0.3 dev: false @@ -5603,6 +5631,12 @@ packages: dev: false resolution: integrity: sha1-X0+HyPkeWuPzuoerTPXgOxoX8aM= + /private/0.1.8: + dev: false + engines: + node: '>= 0.6' + resolution: + integrity: sha512-VvivMrbvd2nKkiG38qjULzlc+4Vx4wm/whI9pQD35YrARNnhxeiRktSOhSukRLFNlzg6Br/cJPet5J/u19r/mg== /process-nextick-args/2.0.1: dev: false resolution: @@ -5863,6 +5897,17 @@ packages: node: '>=0.10' resolution: integrity: sha512-1JU/8q+VgFZyxwrJ+SVIOsh+KywWGpds3NTqikiKpDMZWScmAYyKIgqkO+ARvNWJfXeXR1zxz7aHF4u4CyH6vQ== + /recast/0.11.23: + dependencies: + ast-types: 0.9.6 + esprima: 3.1.3 + private: 0.1.8 + source-map: 0.5.7 + dev: false + engines: + node: '>= 0.8' + resolution: + integrity: sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM= /redent/1.0.0: dependencies: indent-string: 2.1.0 @@ -7708,6 +7753,7 @@ specifiers: copy-webpack-plugin: ^5.1.1 elm-webpack-loader: ^6.0.1 favicons-webpack-plugin: ^1.0.2 + html-loader: ^0.5.5 html-webpack-plugin: ^3.2.0 imagemin-webpack-plugin: ^2.4.2 jsdom: ^15.2.1 diff --git a/webpack.config.js b/webpack.config.js index 579e8c9..fa02330 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -29,28 +29,30 @@ const jsMin = { mangle: true, } +const htmlMin = { + minifyCSS: { + compatibility: 'ie9', + level: 2 + }, + minifyJS: jsMin, + + collapseBooleanAttributes: true, + removeRedundantAttributes: true, + removeScriptTypeAttributes: true, + removeStyleLinkTypeAttributes: true, + + removeComments: true, + sortAttributes: true, + sortClassName: true, +} + prerenderOpts = (width, height, name) => ({ outputDir: path.join(__dirname, 'dist', 'prerender', name), staticDir: path.join(__dirname, 'dist'), routes: ROUTES, - minify: { - minifyCSS: { - compatibility: 'ie9', - level: 2 - }, - minifyJS: jsMin, - - collapseBooleanAttributes: true, - removeRedundantAttributes: true, - removeScriptTypeAttributes: true, - removeStyleLinkTypeAttributes: true, - - removeComments: true, - sortAttributes: true, - sortClassName: true, - }, + minify: htmlMin, renderer: new Renderer({ - renderAfterTime: 500, + renderAfterTime: 300, viewport: { width: width, height: height, @@ -72,20 +74,31 @@ prerenderOpts = (width, height, name) => ({ }) module.exports = { + target: 'web', output: { filename: 'main.js', path: path.join(__dirname, 'dist'), publicPath: '/' }, module: { - rules: [{ - test: /\.elm$/, - exclude: [/elm-stuff/, /node_modules/], - loader: 'elm-webpack-loader', - options: { - optimize: true + rules: [ + { + test: /\.elm$/, + exclude: [/elm-stuff/, /node_modules/], + loader: 'elm-webpack-loader', + options: { + optimize: true + } + }, + { + test: /\.html$/, + loader: 'html-loader', + options: { + minimize: true, + ...htmlMin + }, } - }], + ], }, plugins: [ new TerserPlugin({ @@ -98,7 +111,7 @@ module.exports = { new HtmlWebpackPlugin({ hash: true, inject: true, - name: PRETTY_NAME, + minify: htmlMin, template: './template.html', meta: { viewport: 'width=360, initial-scale=1, maximum-scale=1' @@ -122,6 +135,9 @@ module.exports = { new InjectManifest({ importWorkboxFrom: 'local', swSrc: magicFile(` + workbox.core.skipWaiting(); + workbox.core.clientsClaim(); + workbox.precaching.cleanupOutdatedCaches() workbox.routing.registerNavigationRoute('/index.html'); workbox.precaching.precacheAndRoute(self.__precacheManifest); `),