Comments (10)
I think it has something to do with webpack, google closure compiler or closure-webpack-plugin. Perhaps this bug is related to this: webpack-contrib/closure-webpack-plugin#100 .
@y0hy0h: BTW, do you use Windows for production builds? Personally I use Windows only for development server which should work fine after #82 fix, and I leave production building process to the CI which runs on Linux. Perhaps, WSL (Windows Subsystem for Linux) or Docker is the only option to develop on Windows with this toolset without a pain...
from elm-pages.
I'm currently trying it out, and for that I'm mostly on Windows (though I also have a Linux laptop on which I could work).
from elm-pages.
Very interesting. Thanks for investigating @vViktorPL and @y0hy0h. This is very helpful, I appreciate it!
I've been really unhappy with Google Closure Compiler overall.
I used to use this package: https://www.npmjs.com/package/elm-minify
But based on this thread, that package was deprecated: https://discourse.elm-lang.org/t/comparing-uglifyjs-and-google-closure-compiler/2883/4
But given that the Google Closure Compiler is causing so many issues, it seems like the minor performance gain (in some cases) is not worth it at all.
Is anybody up for doing a custom elm-pages
build with the Google Closure Compiler step turned off, and letting me know if that fixes the issues on Windows? If so, then maybe we can replace it with UglifyJS using these flags: https://guide.elm-lang.org/optimization/asset_size.html.
from elm-pages.
Ok, it seems that disabling the minimizer (Google Closure Compiler) makes it build on Windows. I simply made the minizimer
array empty.
In the starter repo, after this change, webpack warns me that the main.js
asset is big at 663 KiB (as well as images/author/dillon.jpg
). It has thus completed the build successfully.
Unfortunately, I have trouble testing the minifiers. I'm a bit overwhelmed by how to install Google Closure Compiler and unfortunately, the online app at https://closure-compiler.appspot.com/home just crashes with an unhelpful error code. Uglifyjs (installed via npm install uglify-js
, note the dash) seems to have trouble with the generated JS's syntax:
Parse error at dist/main.js:1754,0
const {
^
ERROR: Unexpected token: keyword «const»
I'm gonna stop tinkering with this for the day, but feel free to leave me suggestions on what to try. :)
from elm-pages.
Thanks so much for testing that out @y0hy0h and confirming that the issue is with Google Closure Compiler 👍
So I did some research, and I think I've got a promising approach.
Context
As I mentioned earlier, this nice package, elm-minify, was deprecated because it performed 3-4 times slower than Google Closure Compiler.
However, I've done some research, and I believe that using the latest uglifyjs-webpack-plugin
(not the older version that's built into Webpack) will speed things up.
In particular, setting the parallel flag is highly recommended in the docs:
And this blog post touches on the speed improvements that this change contributed (among other unrelated topics): https://medium.com/box-tech-blog/how-we-improved-webpack-build-performance-by-95-864a3a919d69
For reference, here's the original code for the elm-minify
webpack plugin. You can see that it doesn't set the parallel flag. I think that this should give us solid performance, allowing us to get rid of the Google Closure Compiler which has caused several problems 👍
from elm-pages.
Just a quick note on the proposal: Setting parallel: true
instead of a fixed number appears to adapt to the CPU cores.
from elm-pages.
Yeah, thanks for confirming that, I saw that too and was wondering why all the examples didn't just set it to true
🤔 Kind of odd, seems a lot simpler.
Digging into this a little more, it looks like the elm-minify
plugin did some clever stuff to make sure it doesn't use the Elm terser minify options for other JS code. I think we'll have to do something similar.
https://github.com/opvasger/elm-minify/blob/master/src/api.js#L59-L61
from elm-pages.
Could all files that are generated from Elm be marked? Something like main.elm.js
to make it simple to detect which files to apply the options to?
from elm-pages.
It looks like using webpack-sources
you can already get that metadata, which is nice.
I'll need to do some research and experimentation to try to get that working, though.
from elm-pages.
So I had another look at this issue.
First of all, uglifyjs is abandoned. Luckily, there is a replacement, terser, which works like a charm!
I tried it out online using the following config (which are the same arguments as with uglifyjs, just in JSON format) and it reduced main.js
from 755.421 bytes to 172.738 bytes.
// edit terser options
{
"compress": {
"pure_funcs": "F2,F3,F4,F5,F6,F7,F8,F9,A2,A3,A4,A5,A6,A7,A8,A9",
"pure_getters": true,
"keep_fargs": false,
"unsafe_comps": true,
"unsafe": true
},
"mangle": {},
"output": {},
"parse": {},
"rename": {},
}
I even replaced the previous Google Closure Compiler webpack plugin with the terser plugin and it simply works. main.js
is only 174.259 bytes big.
I have opened PR #90 where you can see and try out these changes.
from elm-pages.
Related Issues (20)
- elm-pages run script/src/AddRoute.elm fails when run before first build HOT 4
- [SSCCE] ANSI escape codes in `onError` and `ErrorPage` error messages
- Provide a way to render static 404 pages using elm-pages HOT 2
- Replace StaticHttp examples in BackendTask HOT 1
- Cannot watch for fragment changes in URL
- Scroll is reset on back navigation HOT 1
- DeadCodeEliminateData errors cached in elm-stuff
- Feature request: `Pages.Script.writeFileBinary`/`BackendTask.File.rawBinary` HOT 2
- `elm-pages build` inserts `import FatalError` into unit test modules HOT 2
- Update .gitignore generator template for elm-pages-cli-mjs HOT 1
- Compilation error when using `elm-pages docs` HOT 9
- npx elm-pages run <script name> does not work on Windows HOT 1
- Vite Pre-transform error after upgrade HOT 9
- Initialization failed while loading node modules HOT 4
- Compatibility Keys match, but elm-pages says they don't when running script HOT 7
- Feature request: `BackendTask.race` HOT 1
- Feature request: `Script.stateful` HOT 1
- `Debug.todo` causes a `Script` to stop with no error message HOT 5
- INTERNAL ERROR when calling custom task. HOT 1
- BadBody: INTERNAL ERROR when input to Backend.Custom.run is mutated HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from elm-pages.