Potentially removing brunch from the Phoenix new template generator

My 10c here. For context I am a front end developer, there are around 50 other FE devs at my company, and we work on several farly complex application platforms. I work on top of a C# codebase, but I don’t think the the backend is particularly relevant to this discussion - we face the same set of issues that having an Elixir/Phoenix based codebase would have as regards frontend.

I guess every non-junior dev at our company, and almost every non-junior FE dev I know has seen the “just use use NPM scripts” article referenced in the first post. And everyone reads it, thinks “isn’t that a great idea! Why am I using webpack/gulp/etc” and implements it in a few small projects, and it works great. Then you try to use it on a non-trivial project, and you start to hit issues. The NPM scripts approcach does not scale, it is fragile, and it gets complex really quickly. It seems a really simple solution, because it is. In the same way as [eg] awk or sed or ed are.

All of the current solutions are substandard in some way - WebPack get complex fast, Brunch just builds stuff, Gulp is Gulp (hello enormous config files). But Brunch is simple enough to do any common task with almost zero config - if I want to add, say, Scss support, it is a single line - no other FE build system can currently provide that. Webpack is arguably better for anything moderately complex (eg I need to unit test everything, so I’ve got to go there), but then the setup is still horribly complex. NPM is too low level; it gets more and more complex until the point that you build a build system. If you have 60 lines of NPM script, there’s gonna be an issue giving that to someone else. As an example - how do glue all of these ES6 modules together? I personally know how to do it, but then, if I write an NPM script that lints, transpiles then concatenates, it’s going to be utter gibberish. If I do that with a taskrunner or build tool, it will not be.

I think I’ve been spoilt a bit by Elixir (and Rust, and Go to some extent), where I have a language with a build system and test framework and built in documentation, and it all works somewhat seamlessly; there are simple answers that provide solutions that work in the majority of cases. There is one way to do things, and it works, out-of-the-box.

With JS, it’s a massive mess. You need some kind of build system that is simple, allows for flexibility, and isn’t complex to introduce that flexibility. It’s needs to be high-level. NPM scripts are simple (in the same way bash scripts are simple), and they allow flexibility if you type out the magic utterances, but adding/modifying functionality is painful and means modifying things at root level; it is in no way high level.

Brunch is pretty good - it’s pretty fast, it’s very easy to understand, it’s had a very long time for issues to be known and understood. Critically, it’s really easy to replace; it’s not like the asset pipeline, it’s not baked in. A canonical set of articles on how to replace with NPM Scripts/Webpack/Gulp/taskrunner-du-jour would possibly be the most useful thing that could exist re this issue.

13 Likes