wizbos-pub/wand-front-utils
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

more optimizations and tweaks

Browse Source
This commit is contained in:
notgne2 2019-12-22 23:52:39 -07:00
parent 95bf0de932
commit aeebfd82db
4 changed files with 96 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
default.nix
View File

@ -112,12 +112,12 @@ let
document.body.appendChild(sourceTarget) document.body.appendChild(sourceTarget)
''; '';
templateHtml = pkgs.writeText "template-html" '' templateHtml = pkgs.writeText "template.html" ''
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8"/> <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
<title><%= htmlWebpackPlugin.options.title %></title> <title>${prettyName}</title>
<link rel="apple-touch-icon" sizes="57x57" href="/appdata/apple-touch-icon-57x57.png"> <link rel="apple-touch-icon" sizes="57x57" href="/appdata/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/appdata/apple-touch-icon-60x60.png"> <link rel="apple-touch-icon" sizes="60x60" href="/appdata/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/appdata/apple-touch-icon-72x72.png"> <link rel="apple-touch-icon" sizes="72x72" href="/appdata/apple-touch-icon-72x72.png">
@ -155,8 +155,7 @@ let
<meta name="msapplication-config" content="/appdata/browserconfig.xml"> <meta name="msapplication-config" content="/appdata/browserconfig.xml">
<meta name="theme-color" content="${themeColor}"> <meta name="theme-color" content="${themeColor}">
</head> </head>
<body> <body></body>
</body>
</html> </html>
''; '';
in in

1
package.json
View File

@ -3,6 +3,7 @@
"copy-webpack-plugin": "^5.1.1", "copy-webpack-plugin": "^5.1.1",
"elm-webpack-loader": "^6.0.1", "elm-webpack-loader": "^6.0.1",
"favicons-webpack-plugin": "^1.0.2", "favicons-webpack-plugin": "^1.0.2",
"html-loader": "^0.5.5",
"html-webpack-plugin": "^3.2.0", "html-webpack-plugin": "^3.2.0",
"imagemin-webpack-plugin": "^2.4.2", "imagemin-webpack-plugin": "^2.4.2",
"jsdom": "^15.2.1", "jsdom": "^15.2.1",

54
pnpm-lock.yaml generated
View File

@ -2,6 +2,7 @@ dependencies:
copy-webpack-plugin: 5.1.1_webpack@4.41.4 copy-webpack-plugin: 5.1.1_webpack@4.41.4
elm-webpack-loader: 6.0.1 elm-webpack-loader: 6.0.1
favicons-webpack-plugin: 1.0.2_webpack@4.41.4 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 html-webpack-plugin: 3.2.0_webpack@4.41.4
imagemin-webpack-plugin: 2.4.2 imagemin-webpack-plugin: 2.4.2
jsdom: 15.2.1 jsdom: 15.2.1
@ -875,6 +876,12 @@ packages:
node: '>=0.10.0' node: '>=0.10.0'
resolution: resolution:
integrity: sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c= 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: /async-each/1.0.3:
dev: false dev: false
resolution: resolution:
@ -2327,7 +2334,7 @@ packages:
dev: false dev: false
resolution: resolution:
integrity: sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g== integrity: sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==
/es-abstract/1.17.0-next.1: /es-abstract/1.17.0:
dependencies: dependencies:
es-to-primitive: 1.2.1 es-to-primitive: 1.2.1
function-bind: 1.1.1 function-bind: 1.1.1
@ -2344,7 +2351,7 @@ packages:
engines: engines:
node: '>= 0.4' node: '>= 0.4'
resolution: resolution:
integrity: sha512-7MmGr03N7Rnuid6+wyhD9sHNE2n4tFSwExnU2lQl3lIo2ShXWGePY80zYaoMOmILWv57H0amMjZGHNzzGG70Rw== integrity: sha512-yYkE07YF+6SIBmg1MsJ9dlub5L48Ek7X0qz+c/CPCHS9EBXfESorzng4cJQjJW5/pB6vDF41u7F8vUhLVDqIug==
/es-to-primitive/1.2.1: /es-to-primitive/1.2.1:
dependencies: dependencies:
is-callable: 1.1.5 is-callable: 1.1.5
@ -2369,6 +2376,13 @@ packages:
dev: false dev: false
resolution: resolution:
integrity: sha1-UQnWLz5W6pZ8S2NQWu8IKRyKUgM= 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: /escape-html/1.0.3:
dev: false dev: false
resolution: resolution:
@ -2684,6 +2698,10 @@ packages:
dev: false dev: false
resolution: resolution:
integrity: sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc= 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: /favicons-webpack-plugin/1.0.2_webpack@4.41.4:
dependencies: dependencies:
cache-loader: 3.0.1_webpack@4.41.4 cache-loader: 3.0.1_webpack@4.41.4
@ -3426,6 +3444,16 @@ packages:
dev: false dev: false
resolution: resolution:
integrity: sha512-71lZziiDnsuabfdYiUeWdCVyKuqwWi23L8YeIgV9jSSZHCtb6wB1BKWooH7L3tn4/FuZJMVWyNaIDr4RGmaSYw== 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: /html-minifier/3.5.21:
dependencies: dependencies:
camel-case: 3.0.0 camel-case: 3.0.0
@ -5037,7 +5065,7 @@ packages:
/object.getownpropertydescriptors/2.1.0: /object.getownpropertydescriptors/2.1.0:
dependencies: dependencies:
define-properties: 1.1.3 define-properties: 1.1.3
es-abstract: 1.17.0-next.1 es-abstract: 1.17.0
dev: false dev: false
engines: engines:
node: '>= 0.8' node: '>= 0.8'
@ -5054,7 +5082,7 @@ packages:
/object.values/1.1.1: /object.values/1.1.1:
dependencies: dependencies:
define-properties: 1.1.3 define-properties: 1.1.3
es-abstract: 1.17.0-next.1 es-abstract: 1.17.0
function-bind: 1.1.1 function-bind: 1.1.1
has: 1.0.3 has: 1.0.3
dev: false dev: false
@ -5603,6 +5631,12 @@ packages:
dev: false dev: false
resolution: resolution:
integrity: sha1-X0+HyPkeWuPzuoerTPXgOxoX8aM= 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: /process-nextick-args/2.0.1:
dev: false dev: false
resolution: resolution:
@ -5863,6 +5897,17 @@ packages:
node: '>=0.10' node: '>=0.10'
resolution: resolution:
integrity: sha512-1JU/8q+VgFZyxwrJ+SVIOsh+KywWGpds3NTqikiKpDMZWScmAYyKIgqkO+ARvNWJfXeXR1zxz7aHF4u4CyH6vQ== 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: /redent/1.0.0:
dependencies: dependencies:
indent-string: 2.1.0 indent-string: 2.1.0
@ -7708,6 +7753,7 @@ specifiers:
copy-webpack-plugin: ^5.1.1 copy-webpack-plugin: ^5.1.1
elm-webpack-loader: ^6.0.1 elm-webpack-loader: ^6.0.1
favicons-webpack-plugin: ^1.0.2 favicons-webpack-plugin: ^1.0.2
html-loader: ^0.5.5
html-webpack-plugin: ^3.2.0 html-webpack-plugin: ^3.2.0
imagemin-webpack-plugin: ^2.4.2 imagemin-webpack-plugin: ^2.4.2
jsdom: ^15.2.1 jsdom: ^15.2.1

36
webpack.config.js
View File

@ -29,11 +29,7 @@ const jsMin = {
mangle: true, mangle: true,
} }
prerenderOpts = (width, height, name) => ({ const htmlMin = {
outputDir: path.join(__dirname, 'dist', 'prerender', name),
staticDir: path.join(__dirname, 'dist'),
routes: ROUTES,
minify: {
minifyCSS: { minifyCSS: {
compatibility: 'ie9', compatibility: 'ie9',
level: 2 level: 2
@ -48,9 +44,15 @@ prerenderOpts = (width, height, name) => ({
removeComments: true, removeComments: true,
sortAttributes: true, sortAttributes: true,
sortClassName: true, sortClassName: true,
}, }
prerenderOpts = (width, height, name) => ({
outputDir: path.join(__dirname, 'dist', 'prerender', name),
staticDir: path.join(__dirname, 'dist'),
routes: ROUTES,
minify: htmlMin,
renderer: new Renderer({ renderer: new Renderer({
renderAfterTime: 500, renderAfterTime: 300,
viewport: { viewport: {
width: width, width: width,
height: height, height: height,
@ -72,20 +74,31 @@ prerenderOpts = (width, height, name) => ({
}) })
module.exports = { module.exports = {
target: 'web',
output: { output: {
filename: 'main.js', filename: 'main.js',
path: path.join(__dirname, 'dist'), path: path.join(__dirname, 'dist'),
publicPath: '/' publicPath: '/'
}, },
module: { module: {
rules: [{ rules: [
{
test: /\.elm$/, test: /\.elm$/,
exclude: [/elm-stuff/, /node_modules/], exclude: [/elm-stuff/, /node_modules/],
loader: 'elm-webpack-loader', loader: 'elm-webpack-loader',
options: { options: {
optimize: true optimize: true
} }
}], },
{
test: /\.html$/,
loader: 'html-loader',
options: {
minimize: true,
...htmlMin
},
}
],
}, },
plugins: [ plugins: [
new TerserPlugin({ new TerserPlugin({
@ -98,7 +111,7 @@ module.exports = {
new HtmlWebpackPlugin({ new HtmlWebpackPlugin({
hash: true, hash: true,
inject: true, inject: true,
name: PRETTY_NAME, minify: htmlMin,
template: './template.html', template: './template.html',
meta: { meta: {
viewport: 'width=360, initial-scale=1, maximum-scale=1' viewport: 'width=360, initial-scale=1, maximum-scale=1'
@ -122,6 +135,9 @@ module.exports = {
new InjectManifest({ new InjectManifest({
importWorkboxFrom: 'local', importWorkboxFrom: 'local',
swSrc: magicFile(` swSrc: magicFile(`
workbox.core.skipWaiting();
workbox.core.clientsClaim();
workbox.precaching.cleanupOutdatedCaches()
workbox.routing.registerNavigationRoute('/index.html'); workbox.routing.registerNavigationRoute('/index.html');
workbox.precaching.precacheAndRoute(self.__precacheManifest); workbox.precaching.precacheAndRoute(self.__precacheManifest);
`), `),