Skip to content

Instantly share code, notes, and snippets.

@mzgoddard
Created April 25, 2018 21:55
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mzgoddard/68b84c96953f2d351ba36f3e840546dc to your computer and use it in GitHub Desktop.
Save mzgoddard/68b84c96953f2d351ba36f3e840546dc to your computer and use it in GitHub Desktop.
Scratch webpack time and size deltas bumping to webpack 4

webpack version, loaders and plugins by repo

scratch-vm webpack@3 babel-loader buffer-loader@0.0.1 copy-webpack-plugin expose-loader file-loader script-loader worker-loader scratch-svg-renderer webpack@3 babel-loader base64-loader scratch-render webpack@3 babel-loader base64-loader copy-webpack-plugin ify-loader raw-loader scratch-audio webpack@2 babel-loader scratch-storage webpack@2 babel-loader binary-loader file-loader json-loader scratch-blocks webpack@1 copy-webpack-plugin exports-loader imports-loader scratch-paint webpack@3 babel-loader css-loader html-webpack-plugin postcss-loader style-loader svg-url-loader url-loader scratch-l10n webpack@3 babel-loader scratch-gui webpack@3 babel-loader buffer-loader copy-webpack-plugin css-loader file-loader html-webpack-plugin postcss-loader raw-loader style-loader

scratch-www webpack@2 babel-loader copy-webpack-plugin css-loader file-loader html-webpack-plugin json-loader postcss-loader sass-loader style-loader url-loader scratchjr webpack@1 babel-loader expose-loader strip-sourcemap-loader@0.0.1 scratchjr-website webpack@3 babel-loader copy-webpack-plugin css-loader file-loader html-loader html-webpack-plugin json-loader postcss-loader sass-loader style-loader url-loader

Build time and size deltas

scratch-vm

develop

development

✨ Done in 21.85s. yarn build 23.52s user 1.28s system 112% cpu 22.143 total

zen at boop-b in ~/Code/scratch/scratch-vm (webpack-4●●) $ ll dist/web total 65936 -rw-r--r-- 1 zen staff 51K Apr 25 15:26 extension-worker.js -rw-r--r-- 1 zen staff 41K Apr 25 15:26 extension-worker.js.map -rw-r--r--@ 1 zen staff 8.0M Apr 25 15:26 scratch-vm.js -rw-r--r-- 1 zen staff 8.0M Apr 25 15:26 scratch-vm.js.map -rw-r--r-- 1 zen staff 8.0M Apr 25 15:26 scratch-vm.min.js -rw-r--r-- 1 zen staff 8.0M Apr 25 15:26 scratch-vm.min.js.map

zen at boop-b in ~/Code/scratch/scratch-vm (webpack-4●●) $ ll dist/node total 38096 drwxr-xr-x 3 zen staff 102B Jan 23 18:06 assets -rw-r--r-- 1 zen staff 59K Apr 25 15:26 extension-worker.js -rw-r--r-- 1 zen staff 47K Apr 25 15:26 extension-worker.js.map -rw-r--r-- 1 zen staff 9.2M Apr 25 15:26 scratch-vm.js -rw-r--r-- 1 zen staff 9.2M Apr 25 15:26 scratch-vm.js.map

production

✨ Done in 55.42s. NODE_ENV=production yarn build 58.53s user 1.83s system 108% cpu 55.713 total

zen at boop-b in ~/Code/scratch/scratch-vm (develop●) $ ll dist/web total 62600 -rw-r--r-- 1 zen staff 44K Apr 25 15:52 extension-worker.js -rw-r--r-- 1 zen staff 43K Apr 25 15:52 extension-worker.js.map -rw-r--r-- 1 zen staff 7.8M Apr 25 15:52 scratch-vm.js -rw-r--r-- 1 zen staff 8.1M Apr 25 15:52 scratch-vm.js.map -rw-r--r-- 1 zen staff 6.4M Apr 25 15:52 scratch-vm.min.js -rw-r--r-- 1 zen staff 8.1M Apr 25 15:51 scratch-vm.min.js.map

zen at boop-b in ~/Code/scratch/scratch-vm (develop●) $ ll dist/node total 38048 -rw-r--r-- 1 zen staff 48K Apr 25 15:52 extension-worker.js -rw-r--r-- 1 zen staff 50K Apr 25 15:52 extension-worker.js.map -rw-r--r-- 1 zen staff 9.0M Apr 25 15:52 scratch-vm.js -rw-r--r-- 1 zen staff 9.5M Apr 25 15:52 scratch-vm.js.map

webpack-4

development

✨ Done in 14.76s. yarn build 16.43s user 1.02s system 115% cpu 15.059 total

zen at boop-b in ~/Code/scratch/scratch-vm (webpack-4●●) $ ll dist/web total 40112 -rw-r--r-- 1 zen staff 51K Apr 25 15:33 extension-worker.js -rw-r--r-- 1 zen staff 41K Apr 25 15:33 extension-worker.js.map -rw-r--r--@ 1 zen staff 4.8M Apr 25 15:33 scratch-vm.js -rw-r--r-- 1 zen staff 4.9M Apr 25 15:33 scratch-vm.js.map -rw-r--r-- 1 zen staff 4.8M Apr 25 15:33 scratch-vm.min.js -rw-r--r-- 1 zen staff 4.9M Apr 25 15:33 scratch-vm.min.js.map

zen at boop-b in ~/Code/scratch/scratch-vm (webpack-4●●) $ ll dist/node total 25208 -rw-r--r-- 1 zen staff 59K Apr 25 15:33 extension-worker.js -rw-r--r-- 1 zen staff 47K Apr 25 15:33 extension-worker.js.map -rw-r--r--@ 1 zen staff 6.1M Apr 25 15:33 scratch-vm.js -rw-r--r-- 1 zen staff 6.1M Apr 25 15:33 scratch-vm.js.map

production

✨ Done in 29.21s. NODE_ENV=production yarn build 33.00s user 1.33s system 116% cpu 29.514 total

zen at boop-b in ~/Code/scratch/scratch-vm (webpack-4●●) $ ll dist/web total 43000 -rw-r--r-- 1 zen staff 44K Apr 25 15:55 extension-worker.js -rw-r--r-- 1 zen staff 41K Apr 25 15:55 extension-worker.js.map -rw-r--r-- 1 zen staff 4.7M Apr 25 15:55 scratch-vm.js -rw-r--r-- 1 zen staff 4.9M Apr 25 15:55 scratch-vm.js.map -rw-r--r--@ 1 zen staff 3.2M Apr 25 15:55 scratch-vm.min.js -rw-r--r-- 1 zen staff 8.1M Apr 25 15:51 scratch-vm.min.js.map

zen at boop-b in ~/Code/scratch/scratch-vm (webpack-4●●) $ ll dist/node total 24584 -rw-r--r-- 1 zen staff 49K Apr 25 15:55 extension-worker.js -rw-r--r-- 1 zen staff 47K Apr 25 15:55 extension-worker.js.map -rw-r--r-- 1 zen staff 5.8M Apr 25 15:55 scratch-vm.js -rw-r--r-- 1 zen staff 6.1M Apr 25 15:55 scratch-vm.js.map

production with chunked music sounds

✨ Done in 29.48s. NODE_ENV=production yarn build 33.60s user 1.27s system 116% cpu 29.808 total

zen at boop-b in ~/Code/scratch/scratch-vm (webpack-4●●) $ ll dist/web total 39056 -rw-r--r-- 1 zen staff 1.9M Apr 25 15:57 0.js -rw-r--r-- 1 zen staff 2.0M Apr 25 15:57 0.js.map -rw-r--r-- 1 zen staff 44K Apr 25 15:57 extension-worker.js -rw-r--r-- 1 zen staff 41K Apr 25 15:57 extension-worker.js.map -rw-r--r-- 1 zen staff 2.7M Apr 25 15:57 scratch-vm.js -rw-r--r-- 1 zen staff 2.9M Apr 25 15:57 scratch-vm.js.map -rw-r--r--@ 1 zen staff 1.3M Apr 25 15:57 scratch-vm.min.js -rw-r--r-- 1 zen staff 8.1M Apr 25 15:51 scratch-vm.min.js.map

scratch-svg-renderer

develop

development

✨ Done in 2.62s. yarn build 3.01s user 0.30s system 114% cpu 2.906 total

zen at boop-b in ~/Code/scratch/scratch-svg-renderer (develop●) $ ll dist/web total 4560 -rw-r--r-- 1 zen staff 1.1M Apr 25 16:09 scratch-svg-renderer.js -rw-r--r-- 1 zen staff 1.1M Apr 25 16:09 scratch-svg-renderer.js.map

zen at boop-b in ~/Code/scratch/scratch-svg-renderer (develop●) $ ll dist/node total 4560 -rw-r--r-- 1 zen staff 1.1M Apr 25 16:09 scratch-svg-renderer.js -rw-r--r-- 1 zen staff 1.1M Apr 25 16:09 scratch-svg-renderer.js.map

production

✨ Done in 2.56s. NODE_ENV=production yarn build 3.07s user 0.27s system 116% cpu 2.854 total

zen at boop-b in ~/Code/scratch/scratch-svg-renderer (develop●) $ ll dist/web total 4560 -rw-r--r-- 1 zen staff 1.1M Apr 25 16:10 scratch-svg-renderer.js -rw-r--r-- 1 zen staff 1.1M Apr 25 16:10 scratch-svg-renderer.js.map

zen at boop-b in ~/Code/scratch/scratch-svg-renderer (develop●) $ ll dist/node total 4560 -rw-r--r-- 1 zen staff 1.1M Apr 25 16:10 scratch-svg-renderer.js -rw-r--r-- 1 zen staff 1.1M Apr 25 16:10 scratch-svg-renderer.js.map

webpack-4

development

✨ Done in 3.15s. yarn build 3.79s user 0.36s system 119% cpu 3.471 total

zen at boop-b in ~/Code/scratch/scratch-svg-renderer (webpack-4●●) $ ll dist/web total 4568 -rw-r--r-- 1 zen staff 1.1M Apr 25 16:02 scratch-svg-renderer.js -rw-r--r-- 1 zen staff 1.1M Apr 25 16:02 scratch-svg-renderer.js.map

zen at boop-b in ~/Code/scratch/scratch-svg-renderer (webpack-4●●) $ ll dist/node total 4568 -rw-r--r-- 1 zen staff 1.1M Apr 25 16:02 scratch-svg-renderer.js -rw-r--r-- 1 zen staff 1.1M Apr 25 16:02 scratch-svg-renderer.js.map

production

✨ Done in 2.78s. NODE_ENV=production yarn build 3.35s user 0.31s system 118% cpu 3.078 total

zen at boop-b in ~/Code/scratch/scratch-svg-renderer (webpack-4●●) $ ll dist/web total 2856 -rw-r--r-- 1 zen staff 708K Apr 25 16:07 scratch-svg-renderer.js -rw-r--r-- 1 zen staff 712K Apr 25 16:07 scratch-svg-renderer.js.map

zen at boop-b in ~/Code/scratch/scratch-svg-renderer (webpack-4●●) $ ll dist/node total 4544 -rw-r--r-- 1 zen staff 1.1M Apr 25 16:07 scratch-svg-renderer.js -rw-r--r-- 1 zen staff 1.1M Apr 25 16:07 scratch-svg-renderer.js.map

scratch-render

develop

development

✨ Done in 5.83s. yarn build 7.12s user 0.38s system 120% cpu 6.223 total

zen at boop-b in ~/Code/scratch/scratch-render (develop●) $ ll dist/web total 14368 -rw-r--r-- 1 zen staff 1.7M Apr 25 16:18 scratch-render.js -rw-r--r-- 1 zen staff 1.8M Apr 25 16:18 scratch-render.js.map -rw-r--r-- 1 zen staff 1.7M Apr 25 16:18 scratch-render.min.js -rw-r--r-- 1 zen staff 1.8M Apr 25 16:18 scratch-render.min.js.map

zen at boop-b in ~/Code/scratch/scratch-render (develop●) $ ll dist/node total 6904 -rw-r--r-- 1 zen staff 1.6M Apr 25 16:18 scratch-render.js -rw-r--r-- 1 zen staff 1.7M Apr 25 16:18 scratch-render.js.map

production

✨ Done in 9.98s. NODE_ENV=production yarn build 12.14s user 0.46s system 122% cpu 10.272 total

zen at boop-b in ~/Code/scratch/scratch-render (develop●) $ ll dist/web total 12664 -rw-r--r-- 1 zen staff 1.7M Apr 25 16:19 scratch-render.js -rw-r--r-- 1 zen staff 1.8M Apr 25 16:19 scratch-render.js.map -rw-r--r-- 1 zen staff 883K Apr 25 16:19 scratch-render.min.js -rw-r--r-- 1 zen staff 1.8M Apr 25 16:18 scratch-render.min.js.map

zen at boop-b in ~/Code/scratch/scratch-render (develop●) $ ll dist/node total 6904 -rw-r--r-- 1 zen staff 1.6M Apr 25 16:19 scratch-render.js -rw-r--r-- 1 zen staff 1.7M Apr 25 16:19 scratch-render.js.map

webpack-4

development

✨ Done in 6.11s. yarn build 7.41s user 0.44s system 122% cpu 6.438 total

zen at boop-b in ~/Code/scratch/scratch-render (webpack-4●●) $ ll dist/web total 14416 -rw-r--r-- 1 zen staff 1.7M Apr 25 16:15 scratch-render.js -rw-r--r-- 1 zen staff 1.8M Apr 25 16:15 scratch-render.js.map -rw-r--r-- 1 zen staff 1.7M Apr 25 16:15 scratch-render.min.js -rw-r--r-- 1 zen staff 1.8M Apr 25 16:15 scratch-render.min.js.map

zen at boop-b in ~/Code/scratch/scratch-render (webpack-4●●) $ ll dist/node total 6928 -rw-r--r-- 1 zen staff 1.6M Apr 25 16:15 scratch-render.js -rw-r--r-- 1 zen staff 1.7M Apr 25 16:15 scratch-render.js.map

production

✨ Done in 13.25s. NODE_ENV=production yarn build 15.94s user 0.57s system 121% cpu 13.549 total

zen at boop-b in ~/Code/scratch/scratch-render (webpack-4●●) $ ll dist/web total 12664 -rw-r--r-- 1 zen staff 1.7M Apr 25 16:17 scratch-render.js -rw-r--r-- 1 zen staff 1.8M Apr 25 16:17 scratch-render.js.map -rw-r--r-- 1 zen staff 881K Apr 25 16:17 scratch-render.min.js -rw-r--r-- 1 zen staff 1.8M Apr 25 16:15 scratch-render.min.js.map

zen at boop-b in ~/Code/scratch/scratch-render (webpack-4●●) $ ll dist/node total 6904 -rw-r--r-- 1 zen staff 1.6M Apr 25 16:17 scratch-render.js -rw-r--r-- 1 zen staff 1.7M Apr 25 16:17 scratch-render.js.map

scratch-audio

develop

development

✨ Done in 1.01s. yarn build 1.34s user 0.13s system 112% cpu 1.306 total

zen at boop-b in ~/Code/scratch/scratch-audio (develop●) $ ll dist* -rw-r--r-- 1 zen staff 64K Apr 25 16:28 dist.js -rw-r--r-- 1 zen staff 65K Apr 25 16:28 dist.js.map

production

✨ Done in 1.06s. NODE_ENV=production yarn build 1.40s user 0.14s system 113% cpu 1.354 total

zen at boop-b in ~/Code/scratch/scratch-audio (develop●) $ ll dist* -rw-r--r-- 1 zen staff 64K Apr 25 16:28 dist.js -rw-r--r-- 1 zen staff 65K Apr 25 16:28 dist.js.map

webpack-4

development

✨ Done in 1.52s. yarn build 1.62s user 0.23s system 101% cpu 1.817 total

zen at boop-b in ~/Code/scratch/scratch-audio (webpack-4●●) $ ll dist* -rw-r--r-- 1 zen staff 71K Apr 25 16:26 dist.js -rw-r--r-- 1 zen staff 63K Apr 25 16:26 dist.js.map

production

✨ Done in 1.96s. NODE_ENV=production yarn build 2.41s user 0.22s system 116% cpu 2.254 total

zen at boop-b in ~/Code/scratch/scratch-audio (webpack-4●●) $ ll dist* -rw-r--r-- 1 zen staff 22K Apr 25 16:26 dist.js -rw-r--r-- 1 zen staff 7.7K Apr 25 16:26 dist.js.map

scratch-storage

develop

development
production

webpack-4

development

✨ Done in 2.63s. yarn build 3.37s user 0.28s system 124% cpu 2.936 total

zen at boop-b in ~/Code/scratch/scratch-storage (webpack-4●●) $ ll dist/web total 6848 -rw-r--r--@ 1 zen staff 835K Apr 25 16:40 scratch-storage.js -rw-r--r-- 1 zen staff 873K Apr 25 16:40 scratch-storage.js.map -rw-r--r--@ 1 zen staff 835K Apr 25 16:40 scratch-storage.min.js -rw-r--r-- 1 zen staff 873K Apr 25 16:40 scratch-storage.min.js.map

zen at boop-b in ~/Code/scratch/scratch-storage (webpack-4●●) $ ll dist/node total 8520 -rw-r--r-- 1 zen staff 2.1M Apr 25 16:40 scratch-storage.js -rw-r--r-- 1 zen staff 2.1M Apr 25 16:40 scratch-storage.js.map

production

✨ Done in 6.61s. NODE_ENV=production yarn build 7.98s user 0.41s system 121% cpu 6.908 total

zen at boop-b in ~/Code/scratch/scratch-storage (webpack-4●●) $ ll dist/web total 4784 -rw-r--r-- 1 zen staff 825K Apr 25 16:37 scratch-storage.js -rw-r--r-- 1 zen staff 872K Apr 25 16:37 scratch-storage.js.map -rw-r--r-- 1 zen staff 610K Apr 25 16:37 scratch-storage.min.js -rw-r--r-- 1 zen staff 73K Apr 25 16:37 scratch-storage.min.js.map

zen at boop-b in ~/Code/scratch/scratch-storage (webpack-4●●) $ ll dist/node total 8232 -rw-r--r-- 1 zen staff 1.9M Apr 25 16:37 scratch-storage.js -rw-r--r-- 1 zen staff 2.1M Apr 25 16:37 scratch-storage.js.map

scratch-blocks

develop

development

webpack 3.93s user 0.90s system 122% cpu 3.929 total

zen at boop-b in ~/Code/scratch/scratch-blocks (local-closure●) $ ll dist/* -rw-r--r-- 1 zen staff 888K Apr 25 17:29 dist/horizontal.js -rw-r--r--@ 1 zen staff 960K Apr 25 17:29 dist/vertical.js

dist/web: total 3712 -rw-r--r-- 1 zen staff 888K Apr 25 17:29 horizontal.js -rw-r--r--@ 1 zen staff 961K Apr 25 17:29 vertical.js

production

NODE_ENV=production webpack 3.92s user 0.81s system 126% cpu 3.742 total

zen at boop-b in ~/Code/scratch/scratch-blocks (local-closure●) $ ll dist/* -rw-r--r-- 1 zen staff 888K Apr 25 17:30 dist/horizontal.js -rw-r--r--@ 1 zen staff 960K Apr 25 17:30 dist/vertical.js

dist/web: total 3712 -rw-r--r-- 1 zen staff 888K Apr 25 17:30 horizontal.js -rw-r--r--@ 1 zen staff 961K Apr 25 17:30 vertical.js

webpack-4

development

webpack 4.27s user 0.93s system 121% cpu 4.272 total

zen at boop-b in ~/Code/scratch/scratch-blocks (webpack-4●●) $ ll dist/* -rw-r--r-- 1 zen staff 909K Apr 25 17:21 dist/horizontal.js -rw-r--r--@ 1 zen staff 984K Apr 25 17:21 dist/vertical.js

dist/web: total 3800 -rw-r--r-- 1 zen staff 909K Apr 25 17:21 horizontal.js -rw-r--r--@ 1 zen staff 984K Apr 25 17:21 vertical.js

production

NODE_ENV=production webpack 11.98s user 0.97s system 123% cpu 10.491 total

zen at boop-b in ~/Code/scratch/scratch-blocks (webpack-4●●) $ ll dist/* -rw-r--r-- 1 zen staff 887K Apr 25 17:26 dist/horizontal.js -rw-r--r--@ 1 zen staff 959K Apr 25 17:26 dist/vertical.js

dist/web: total 3664 -rw-r--r-- 1 zen staff 876K Apr 25 17:26 horizontal.js -rw-r--r--@ 1 zen staff 949K Apr 25 17:26 vertical.js

scratch-paint

develop

development

✨ Done in 13.69s. yarn build 14.61s user 0.90s system 110% cpu 14.002 total

zen at boop-b in ~/Code/scratch/scratch-paint (develop●) $ ll dist total 7816 -rw-r--r-- 1 zen staff 1.8M Apr 25 17:45 scratch-paint.js -rw-r--r-- 1 zen staff 2.0M Apr 25 17:45 scratch-paint.js.map

production

✨ Done in 13.35s. NODE_ENV=production yarn build 14.97s user 0.74s system 114% cpu 13.735 total

zen at boop-b in ~/Code/scratch/scratch-paint (develop●) $ ll dist total 7816 -rw-r--r-- 1 zen staff 1.8M Apr 25 17:45 scratch-paint.js -rw-r--r-- 1 zen staff 2.0M Apr 25 17:45 scratch-paint.js.map

webpack-4

development

✨ Done in 15.88s. yarn build 16.32s user 1.12s system 107% cpu 16.197 total

zen at boop-b in ~/Code/scratch/scratch-paint (webpack-4●●) $ ll dist total 15952 -rw-r--r-- 1 zen staff 1.9M Apr 25 17:41 scratch-paint.js -rw-r--r-- 1 zen staff 1.9M Apr 25 17:41 scratch-paint.js.map -rw-r--r-- 1 zen staff 1.9M Apr 25 17:41 scratch-paint.min.js -rw-r--r-- 1 zen staff 1.9M Apr 25 17:41 scratch-paint.min.js.map

production

✨ Done in 21.72s. NODE_ENV=production yarn build 24.41s user 1.10s system 115% cpu 22.022 total

zen at boop-b in ~/Code/scratch/scratch-paint (webpack-4●●) $ ll dist total 9248 -rw-r--r-- 1 zen staff 1.8M Apr 25 17:42 scratch-paint.js -rw-r--r-- 1 zen staff 1.9M Apr 25 17:42 scratch-paint.js.map -rw-r--r-- 1 zen staff 837K Apr 25 17:42 scratch-paint.min.js

scratch-l10n

develop

development

webpack 0.82s user 0.10s system 104% cpu 0.882 total

zen at boop-b in ~/Code/scratch/scratch-l10n (master●) $ ll dist total 168 -rw-r--r-- 1 zen staff 38K Apr 25 17:52 l10n.js -rw-r--r-- 1 zen staff 42K Apr 25 17:52 l10n.js.map

production

NODE_ENV=production webpack 0.76s user 0.07s system 111% cpu 0.741 total

zen at boop-b in ~/Code/scratch/scratch-l10n (master●) $ ll dist total 168 -rw-r--r-- 1 zen staff 38K Apr 25 17:52 l10n.js -rw-r--r-- 1 zen staff 42K Apr 25 17:52 l10n.js.map

webpack-4

development

webpack 0.91s user 0.10s system 110% cpu 0.912 total

zen at boop-b in ~/Code/scratch/scratch-l10n (webpack-4●●) $ ll dist total 168 -rw-r--r-- 1 zen staff 40K Apr 25 17:50 l10n.js -rw-r--r-- 1 zen staff 41K Apr 25 17:50 l10n.js.map

production

NODE_ENV=production webpack 1.63s user 0.17s system 114% cpu 1.569 total

zen at boop-b in ~/Code/scratch/scratch-l10n (webpack-4●●) $ ll dist total 80 -rw-r--r-- 1 zen staff 34K Apr 25 17:51 l10n.js -rw-r--r-- 1 zen staff 2.2K Apr 25 17:51 l10n.js.map

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment