Developing Ember.js
apps for production is nothing like what you see on the tutorials or
guides around the interwebs. Most guides just throw some code on an HTML
file and maybe two or three extra JavaScript files. That’s not how it
works in a real world scenario.
If you are working with any of these client side JavaScript frameworks you need to deal with modules, pre-compiling templates, source maps, css pre-processors, linting and minification of files. It’s a lot of stuff.
Lucky for us in the Ember.js camp there’s a lot of stuff going on.
I’ve tried all of them and they are cool. But after a year of using Brunch on Backbone.js and more recently Ember.js projects they all feel either, incomplete or slow. I’ve also tried using Grunt but the Gruntfile became huge and over complicated really fast. It felt like I had more Grunt code than Ember code and worst of all: GRUNT IS SLOW! Really slow if you want to watch your files and re-build on changes. SUPER SLOW.
Brunch is blazing fast, mature (older than Grunt) and it has all the features you might ever need.
Builder, linter, concatenator, minifier
Brunch can compile your JS, CoffeeScript, Stylus, Sass (+ Compass), LESS, Handlebar, (and much more) files, concatenate output to and minify it. It just doesn’t care about languages or frameworks you use.
File watcher
Brunch recompiles and concats all your stuff automatically on any change, headlessly. No more need in compacted Makefiles and watchers.
Auto-reload
Brunch reloads your browser window every time you change stuff (with auto reload plugin).
Auto-support for modules
All script and template files may be wrapped in modules (CommonJS or AMD) to prohibit global public access and encapsulate code. Brunch may also do the job of r.js optimizer automatically.
Blazing fast
Speed is important for app watchers. Usual brunch compilation takes less time than you need to alt-tab to browser window. Unlike Grunt, Brunch recompiles only changed parts of your app and extensively uses caching for others.
Incredibly simple
All you need to do with Brunch is run one command and everything will be managed for you, without need to write sophisticated 300LOC build configs.
Headless Bower integration
Brunch supports headless integration with Bower package manager. Unlike with Grunt, you don’t need to specify all used files in details — brunch will auto-detect them in most cases and automatically concat in correct order.
Headless source maps generation
Brunch automatically generates source maps for all your files so debugging becomes very simple even when all files are concatenated and minified.
ES6 Module Syntax
Just today I created a 26 line plugin that adds ES6 module syntax to brunch It was incredibly easy to write, and share using npm. Other plugins.
Skeletons
Brunch can generate your project from predefined template. There’s a lot of great skeleton projects you can use already, including a bunch made just for Ember.js.
from http://elweb.co/building-ember-js-applications-for-production/
If you are working with any of these client side JavaScript frameworks you need to deal with modules, pre-compiling templates, source maps, css pre-processors, linting and minification of files. It’s a lot of stuff.
Lucky for us in the Ember.js camp there’s a lot of stuff going on.
I’ve tried all of them and they are cool. But after a year of using Brunch on Backbone.js and more recently Ember.js projects they all feel either, incomplete or slow. I’ve also tried using Grunt but the Gruntfile became huge and over complicated really fast. It felt like I had more Grunt code than Ember code and worst of all: GRUNT IS SLOW! Really slow if you want to watch your files and re-build on changes. SUPER SLOW.
Brunch is blazing fast, mature (older than Grunt) and it has all the features you might ever need.
Builder, linter, concatenator, minifier
Brunch can compile your JS, CoffeeScript, Stylus, Sass (+ Compass), LESS, Handlebar, (and much more) files, concatenate output to and minify it. It just doesn’t care about languages or frameworks you use.
File watcher
Brunch recompiles and concats all your stuff automatically on any change, headlessly. No more need in compacted Makefiles and watchers.
Auto-reload
Brunch reloads your browser window every time you change stuff (with auto reload plugin).
Auto-support for modules
All script and template files may be wrapped in modules (CommonJS or AMD) to prohibit global public access and encapsulate code. Brunch may also do the job of r.js optimizer automatically.
Blazing fast
Speed is important for app watchers. Usual brunch compilation takes less time than you need to alt-tab to browser window. Unlike Grunt, Brunch recompiles only changed parts of your app and extensively uses caching for others.
Incredibly simple
All you need to do with Brunch is run one command and everything will be managed for you, without need to write sophisticated 300LOC build configs.
Headless Bower integration
Brunch supports headless integration with Bower package manager. Unlike with Grunt, you don’t need to specify all used files in details — brunch will auto-detect them in most cases and automatically concat in correct order.
Headless source maps generation
Brunch automatically generates source maps for all your files so debugging becomes very simple even when all files are concatenated and minified.
ES6 Module Syntax
Just today I created a 26 line plugin that adds ES6 module syntax to brunch It was incredibly easy to write, and share using npm. Other plugins.
Skeletons
Brunch can generate your project from predefined template. There’s a lot of great skeleton projects you can use already, including a bunch made just for Ember.js.
- Brunch with Ember
- Brunch with Ember Reloaded (I made this one)
- Brunch with Ember Reloaded ES6 Branch
- Tapas with Ember
- Sassy Brunch with Ember and CoffeeSoup
- Brunch with Ember Sideloaded
- Brunch with Ember and Bootstrap
- Other skeletons
from http://elweb.co/building-ember-js-applications-for-production/