Comment by mixonic | Hacker News Reader

Comment by mixonic | Hacker News Reader

Parent Full thread

Yeoman, Grunt, and Gulp are (I believe) all various implementations of a task runner. They chain tasks in different ways, but at the end of the day think of your asset build as a set of discrete steps.

Broccoli (https://github.com/broccolijs/broccoli), the build tool written by Jo Liss and supported by the Ember community, is truly an asset pipeline tool. It is concerned with transformations to filesystems and file contents, not tasks.

This makes Broccoli a faster and easier to use tool for implementing complex asset pipelines. The main domain object is "trees". A tree represents a directory hierarchy of files that will be regenerated on each build. Broccoli uses directories of symlinks in tmp/ to cache un-changed files from step to step, allowing it to restart a build at any depth and only process those files that change.

Some links you might enjoy on Broccoli:

* http://aexmachina.info/intro-to-broccoli/

* http://moduscreate.com/better-builds-begin-with-broccoli/

* http://hashrocket.com/blog/posts/broccoli-the-build-tool-not... (how Broccoli is used in Ember-CLI)

I can't speak to the weariness, but I can say that Broccoli is completely unlike Grunt, Gulp, or Yeoman and without it (or something like it) Ember-CLI and the next generation of build tools would be impossible. Broccoli has been in development since fall of 2013, and been used aggressively by Ember-CLI users since summer 2014. Give it a look!

In my experience using grunt, gulp and broccoli as task runner / build systems for complex applications, they all end up doing about the same thing.

In a way, it makes a lot of sense that broccoli is part of the Ember-CLI system - I found broccoli to be the most opinionated of the runners. As long as your structure mapped easily onto the opinions of broccoli, things were easy and speedy. If you want to do something not supported, or customize how things work, not so much. As an example, I submitted a PR to configure where and how broccoli stores its temp directory structure a year ago (./tmp wasn't right for my project), which is still open (and admittedly wasn't the most elegant solution).

Gulp and Grunt, on the other hand, make far fewer assumptions, provide very little in the way of out-of-the-box "just works", and are far more easy to tweak. In my own experience, my issue was getting certain cat/minify/sort processes to work in broccoli (to deal with angular module declaration ordering) was annoyingly complex enough that I just moved to gulp where it was easier (and someone else had already written a gulp plugin).

I used to be really into gulp, until I discovered that I could replace my entire gulp file with a 1 line shell script in package.json

If you can do it in one line of shell then do it - you don't need a build system. I don't understand why everyone sees it as a competition - just use the right tool for the problem you need to solve.

> In my experience using grunt, gulp and broccoli as task runner / build systems for complex applications, they all end up doing about the same thing.

This may be true for a codebase of trivial size. With a sizable codebase and many build steps (defeaturefy, babel, es6 modules, es3recast, jshint, jscs) you quickly see grunt and gulp fall flat.

Gulp and Grunt absolutely have a simpler API for blindly chaining tasks. And they have the ability (as task runners) to define multiple tasks and compose them.

Broccoli is tricky to learn. In Ember-CLI we go out of our way to make it invisible to devs who shouldn't need to care what tool is running the internals. For the internals however, it is definitely the correct tool.

For what it's worth, my gulp build handles both ES6 and Coffee files (although coffee is being phased out it is still present) on both the front (angular) and back (node) ends. It then takes the built files, merges the two streams (as well as any passed-through content from bower etc), and conditionally on development / beta / production sends them through sourcemap, angular-annotate, cat, minify and md5-rev (for cache busting) layers. It also handles injecting correct filenames into index.html and my karma.conf, sorting angular angular files so they're catted in dependency order, livereload, restarting the backend server, catching build errors, and quite a bit more. Plus sass, of course. It does this with a live asset server for development or building to static files for production. As a bonus, I also can use gulp to run various other important tasks like my ersatz database migration (rolled my own with node and some raw SQL fles) process.

I'd say: I ended up building all the features I wanted in broccoli as part of a gulp build system. It did not "fall flat", rather, at the time (about eight months ago), I found broccoli had fallen flat- it didn't handle what I wanted, and even when it did it was impossible to do incremental rebuilds (say) of files - change one thing and the whole system rebuilt itself leading to a livereload on * rather than a single changed file. On top of everything else, it was dog-slow on medium-to-large codebases. I understand that this has changed since, but the frustration I had originally getting it to do what I want coupled with the length of time it took to run rebuilds (nobody wants 10k msec builds when the same process elsewhere takes 300msec) made me transition to gulp. I'm sure broccoli is just fine nowadays, and my read of the emails (I still am watching the repo) seems to indicate that Stefan ironed out a lot of the performance issues around watching and rebuilding (symlinks on OSX, IIRC, were a dog).

As I said the first time around: you can do just about anything with gulp or grunt, you just have to DIY. If you happen to enjoy spending some time really getting to know your toolchain, they all end up doing about the same thing, and with grunt and gulp it's marginally easier to configure certain aspects of the process.

"defeaturefy" is a Googlewhackblatt (only result is this thread). Care to explain what this term means? My curiosity is piqued.

I guess he/she meant https://github.com/thomasboyt/defeatureify but forgot an I in the name.

Grunt and gulp are task runners, yeoman is a scaffolding tool that does exactly that, and all the generators I've used and written will scaffold out Grunt or Gulp tasks which take care of the build/test/deploy story. Usually with live-reload and filesystem watches for autoupdate.

Yeoman is for scaffolding

Reply on news.ycombinator.com