14 ms·
Why does Ember.js rock?
- mintplant 13y agoNote that if you have, say, HTTPS Everywhere installed, the embedded JSFiddles won't display. The site the post is hosted on supports HTTPS, while JSFiddle apparently does not, so Firefox blocks "loading mixed active content".
- Kerrick 13y agoQuick fix here until I find a fiddle equivalent that allows SSL embeds: https://kerricklong.com/articles/why-ember-js-rocks.noembed.html https://kerricklong.com/articles/why-ember-js-rocks.noembed.... Sorry about that.
- azakai 13y agoI get that on Firefox Nightly with no extensions installed.
- octo_t 13y agoThe fact that this isn't "it doesn't" in full capitals and 72-pt font baffles me
- eitland 13y agoWhy?
- gunn 13y ago:( [blocked] The page at https://kerricklong.com/articles/why-ember-js-rocks.html https://kerricklong.com/articles/why-ember-js-rocks.html ran insecure content from http://jsfiddle.net/Kerrick/Vd6eF/embedded/result,html http://jsfiddle.net/Kerrick/Vd6eF/embedded/result,html. Unfortunately kerricklong.com won't serve http, nor jsfiddle.net https, so I don't see an easy fix.
- Kerrick 13y agoQuick fix here until I find a fiddle equivalent that allows SSL embeds: https://kerricklong.com/articles/why-ember-js-rocks.noembed.html https://kerricklong.com/articles/why-ember-js-rocks.noembed.... Sorry about that.
- kaichanvong 13y agoGetting an SSL error on all those links.
- rickharrison 13y agoI just used ember to build a side project (http://bests.com http://bests.com) and it turned me into a huge fan. It is great how little code you need in ember to tie an API with a UI in the browser.
- moocowduckquack 13y ago"I just used ember to build a side project (http://bests.com http://bests.com) and it turned me into a huge fan." Did it also send you spinning? (sorry)
- progx 13y agoI look at your code and i think for this small project you can use jquery and ajax. Where does it use the advantages of a big framework like Ember?
- rickharrison 13y agoThe advantage comes in for organization and simplicity of the code. I don't have to write any jQuery like for $("#item').html(). I just set a property on the model and it updates.
- deleted 13y ago[deleted]
- tantalor 13y agoYour answer to "why it rocks" is "data binding." Why does this seem like an important feature to you? What problem does it solve?
- oinksoft 13y agoSupport for two-way binding significantly speeds up development time when compared to the old way of doing things because so much of frontend development consists of shuttling JS objects to the document and returning user input to those objects. It is night and day using one of these frameworks when compared to the old favorites (ExtJS, Closure Library, Dojo).
- progx 13y agoYes it speeds up, but significantly ? Like in Backbone, some lines of code and if you build a small "Framework / Function-Set" on top of backbone Marionette (~10 Lines of Code), you have nearly the same feature. Did somebody really looked at Ember and its Ember-Data and the missing features that you need when you program a RESTful application? E.g. Server Errors. Ember "Frontend" is nice, but Ember "Backend" is (in my mind) not production ready. And only for a little two Way Binding 800 KB of Code? ;-) I think Ember has more to give.
- overgard 13y agoI have the same feeling -- I can't say I've ever needed that feature. I think it's /neat/, but it's not neat enough that I couldn't do without it.
- deleted 13y ago[deleted]
- Kerrick 13y agoI didn't do a 1:1 translation of each, I changed a bit of functionality. For example, the Components example would be much less verbose if I didn't have a form to edit the hCard.
- capkutay 13y agoI see ember and angular on hn today...are the backbone evangelists on summer vacation?
- Kerrick 13y agoEmber and Angular are new now. Backbone was new two years ago. I'm guessing that's why.
- deadreturns2 13y agoUsing Backbone is like being left in a desert and told to go home.
- mayhew 13y agoBackbone is a library, not a full-fledged framework like Ember and Angular. I could see Ember and Angular being implemented with Backbone. Backbone isn't opinionated and makes no design decisions for you. It's also very low-level (no two-way binding). Not really fair to compare them, they cover very different use cases.
- d0m 13y agoI've been saying this for 2 years.. Backbone is a MVC meta-framework!
- brianwillis 13y agoEvery generation has its war. My forefathers fought the great war of emacs and vi in the 1980s. Those were dark times, which many still refuse to speak of. When I think of the horrifying atrocities committed by both sides, the snarky BBS posts, the bickering over usenet, it shudders the mind. My generation got off relatively lightly. There were a handful of skirmishes during the browser wars which were difficult on the civilian population. Tables being used for layout, limited CSS support, that sort of thing. While many a fine web developer met their end at the hands of Internet Explorer 6, a lot of us (some would say, the less patriotic) chose to ride out the war as desktop application developers, avoiding the draft entirely. Today I see many of the young and impressionable being manipulated in an ardent search for desperate glory. They get roped in by blog posts, conference talks, friends and coworkers who are too young to remember the atrocities of old. I fear this generation's war will soon be upon us. It will not take place in mobile as many had expected (the Android/iOS battle was a classic case of corporate manipulation), but instead will be fought in Java Script.
- jmspring 13y agoFunny how so much of todays "wars" center around Javascript at the front end or bringing it down into lower levels/the back end -- nodes, etc. I like to refer to it as the era of the "Webscale Wars"...in homage to the awesome Mongo/Node webscale/rockstar bad ass tech videos. Missing in a lot of this is that many of these tools that allow for "X is OMFG so amazingly awesome and webscale and ..." is years of churn, some progress towards "standards", and a foundation in lower level languages that enable these technologies. In the gold rush, those that sold the shovels, the jeans, and the food made the bigger, less riskier dollar. In the coming generational war, as you posit, if it were to occur, having a toolset that includes things beyond Javascript will be key. In seriousness, especially on the nodejs front, any serious application you develop will run into bottle necks...in nearly 99% of those cases, just javascript isn't going to get you out of them. Breadth in experience, tooling, and mindset has it's advantages.
- hackula1 13y agoAs someone who would whole heartedly identify himself as a node dev, the most valuable code I write is in python. Node and JS in general is great for "glue code", but at the end of the day, most of us need to have something to actually glue together. Dependencies play a huge role in this. In my case, python has far better support for GIS, analytics, and machine learning. For 90% of us, scaling is not really ever an issue. Typically the real question is, does language X have library support for Y functionality.
- rogerthis 13y agoI don't care.
- rogerthis 13y agoEverybody is trying to emulate the old (VB, Delphi, etc) way.
- 10098 13y agoI was just thinking about this yesterday. Remember how easy it was to build a working UI in Delphi? Throw some controls on the form with a few clicks, maybe write some code, and it just worked. By comparison, integrating various javascript widgets into existing applications still remains such a pain, you'd think we've receded into the stone age of application development.
- Joeri 13y agoYou don't have to reminisce about delphi as if it is long gone. Delphi still exists, and it's still being actively developed. They now have a set of opengl-powered ui controls called firemonkey so you can use the same components and code to build native apps with hardware-accelerated ui for windows, mac and ios, with android support right around the corner. It is a pity that the perception of delphi is that it is yesteryear's technology, because in my opinion it is still the absolute best way to build windows native apps, better than microsoft's own tools, and technologically they are really onto something with firemonkey on top of their data binding layer (which does two-way data binding in a more powerful way than any of the web frameworks). See this example of building an app in delphi xe4: http://docwiki.embarcadero.com/RADStudio/XE4/en/Tutorial:_Using_LiveBinding_to_Create_an_Application_Without_Code http://docwiki.embarcadero.com/RADStudio/XE4/en/Tutorial:_Us... Note that i'm still doing web development though, because the era of the desktop is fading for the sort of software i'm making. I'm just aware that as good as frameworks like angular and ember are, they have a way still to go.
- gklitt 13y agoI get that this was written in quick response to the earlier post about AngularJS, but it would have been far more useful if it had actually drawn direct comparisons between the two frameworks. I'm currently using AngularJS for a project, and loving it. Everything in this blog post looked like something with a close equivalent in Angular (data binding => data binding, components => directives, Handlebars Helpers => filters), so I didn't see any compelling reason to try Ember. It is great to see competition in this space though! It seems that full-featured JS frameworks are progressing rapidly because of it.
- glitchdout 13y agoThere was a link posted in the other discussion (by visionscaper) that makes the direct comparisons that you suggested. Personally, that's also what I want to see in these types of blog posts. Cage Match – Ember.js vs. AngularJS : http://vimeo.com/68215606 http://vimeo.com/68215606 I still haven't had to pick one side, but this talk will certainly make me lean towards some framework. I just wish it was a 4-sided battle with Backbone.js and Knockout.js since those are the other 2 frameworks that are on my radar.
- gphreak 13y agoWhile the cage match was fun to watch I found it pretty one-sided. Tom Dale has awesome live stage skills and was better prepared. While Ember and Angular seem to be pretty close in terms of functionality etc, Angular has recently gained a lot of momentum judging by Google Trends, blog posts and available 3rd party libraries (http://ngmodules.org/ http://ngmodules.org/). This might not be important for everyone, but when I could just plugin an Angular bootstrap model and stuff worked, I was happy and chose Angular.
- skxc 13y agoI've recently started a project with angularjs and that "cage match" was incredibly fun to watch, we need more head-on stuff like this in webdev. :)
- jlampa 13y agoOT: What is the name of the editor the Angular guy is using?
- kenster07 13y agoThe example given for the "components" argument in this article is very contrived and unpersuasive.
- jcampbell1 13y agoI have nothing but praise for both Ember and Angular. Both give you real data binding, and delegation rather than events. Compared to Backbone, both are like being in heaven rather than the 4th level of "event" hell. There are a lot of differences, but if I had to pick, it would depend on the application. If I was building something with complex front-end requirements where the vocabulary was mostly tabs/panes/switches/filter-dropdowns/etc., then I would go with Angular. If I were building something where the data domain was more important, e.g. the vocabulary is more about authors/titles/posts/tags/etc. then I'd go with Ember. With Ember, persisting a complex model to a backend is a priority for the framework developers. With Angular, it is left as an exercise for the reader. With Angular, extending the DOM to create new web components is a central focus, but with Ember, it is totally an after thought. Ember Components are a joke compared to Angular directives... I was about to link to the Ember component source code showing how pointless they are. (A week ago they were useless) The devs have been furiously fixing Ember Components to have the power of Angular JS directives. I am so happy to see the good parts of Anular making their way into Ember. For those that hate Angular terminology, it appears 'isolate' has made its way to Ember. I hope 'transclusion' does as well. Need more than one way to {{yield}}
- djacobs 13y agoI think it's important to remember that Backbone is not one library but a modular ecosystem. I am a huge fan of Backbone Marionette + Relational + ModelBinder as a very valid alternative to Ember and Angular.
- padolsey 13y agoEven comparing Backbone (by itself) to these two is futile. It's thin, doesn't prescribe much, and doesn't even promise to offer what Emb/Ang do, so to compare them is unfair to all involved IMHO. I'm reluctant to try something big with Angular because of its insistence on dirty checking, which just ends up being an annoyingly leaky abstraction half the time (see $timeout, for example).
- Nitramp 13y agoI've written large applications in AngularJS, the dirty checking is generally not a problem. If you write complex directives that need to pass non-trivial data structures around, you have to know what you're doing, but it still works fine. I don't get your reference to $timeout - $timeout is Angular's more testable wrapper around setTimeout for an asynchronous operation. AFAICT it's entirely unrelated to dirty checking - sometimes you just want something to happen later. Am I missing something?
- sanarothe 13y agoI don't really like to mess with front-end stuff. Can someone explain why ember/angular are so amazing? What does it enable you to do so much more easily?
- bdcravens 13y agoTake a jumble of jQuery that is continually updating the DOM via event callbacks and function calls and giving you structured code that wires it up in a smart way. In the same way you don't need a framework like Django or Rails, but server-side code tends to turn into a mess without one.
- julianpye 13y agoI still can't let go of knockout, because it gave me such a hard time to learn it. I think what is needed are migration guides or services for various frameworks to Angular, the de-facto standard.
- yakz 13y agoI don't think you see much about Knockout around here because it comes from the ASP.NET MVC world. It's a nice lib, regardless. I would not describe it as being similar to Angular or Ember at all, though.
- overgard 13y agoOk but what am I going to use this data-binding for? Ensuring that nobody will ever have to (GASP) click a "calculate" button? I mean what am I supposed to use this for?
- ollysb 13y agoI'm using it to display analytics. The page has various controls to view different metrics with different filters etc. there's a single chart which updates as you change settings. The backend is super fast so the chart updates almost immediately when you change metrics/filters. Our users absolutely love it, it's so much easier for them to learn the interface when the feedback loop is so quick.
- deleted 13y ago[deleted]
- Volpe 13y agoHave your objects update from a form fields without having to select each element, assign it's inputted value to your JS object. Turns 50 lines (if you're lucky) of JS into 0. (with about 10 characters more markup).
- mrinterweb 13y agoThe site does not work for me.
- general_failure 13y agoI am mostly a systems dev but I have written my share of websites. They are all built with just jQuery. Can someone englighten me the need for data bindings and all these frameworks? For example, say, github.com. Where in that website would I use data bindings? Or say gmail for that matter. The idea of bindings is not alien to me but I just fail to appreciate why bindings are useful for most websites. (I do understand backbone.js but I just feel I can write what I want in a observer/listener pattern in 20 mins instead of bothering to learn all intricacies of a framework)
- Volpe 13y agoWhile this isn't really the place to explain it. What takes you 20 minutes with observer listener pattern takes less than 1 in angular (can't speak for ember). It is life changing if you've always hand rolled your own JS. There is not too much to either of these frameworks. A solid day and you'll be productive. There are many layers to becoming an expert, but (at least with angular) you can just use the bits you know, and refactor as you learn more. i.e. You don't have to know anything about what "directives" are to build an app
- perlgeek 13y agojQuery is great for progressive enhancement. Github serves mostly static pages, and then some javascript that adds a bit of functionality on top. But consider writing a spreadsheet application instead, where changing one cell can influence a lot of others. That seems like a good use case for data binding (though I admit I haven't used it so far).
- EugeneOZ 13y agoEach time I'm looking at the code of my previous web apps which are built with jQuery, I think how many boilerplate code here, could be replaced by Angular-code in 3-4 times less amount of lines and without many bugs (copy-paste is their reason and it's my sin, but because of often repeated boilerplate code). But it's not enough reason to rewrite them :)
- nolok 13y ago* not useful in github (simple page with some js extras on top, it's a prime job for jquery) * for gmail you would use it to handle emails for example. Your view in gmail never changes, if you're looking at tags, or archive, or sent mails, or inbox, ... It's always the same thing, but the dataset changes; it comes from different sources, it is sorted and filtered different, ... For a Gmail clone with angular, you do you app/html/css one time, and then you only ever manipulate your model, everything else is done for you. Want to filter email to only get those tagged "hacker news" ? Map reduce your email set then assign it to your model, that's it - no dom no event assign no view logic no nothing, only data. Now, I'm pretty sure you read this and you think "but I could do the same with what I'm used to, just create a setEmailList(emails) function and use it", that is entirely true. Angular does not provide new functionnalities that you couldn't get otherwise. What angular provide is that 1 - it will be way faster to code than your "traditionnal" method once you're used to it, because angular does most of it for you, and 2 - large changes, special cases and thus evolution of the app are much easier to handle and code. It provide those two things by being made explicitely for them. Angular is so tailored for that use case that it sucks and should never be used for anything else. Don't be fooled by all the hype into thinking every website should now use angular/ember/whatever, they shouldn't. It does only one kind of job, but it does it very, very well.
- itsbits 13y agoWe shouldn't compare backbone with EmberJS or Angular. Backbone alone is not MVC framework. I started with Backbone worked with Marionette but Ember is so awesome that now i even use for simple pages.
- kumarharsh 13y agoWell, seeing everyone saying how good ember is, here is a counter-argument: http://discuss.emberjs.com/t/getting-started-with-ember-js-is-easy-no-it-isnt/559 http://discuss.emberjs.com/t/getting-started-with-ember-js-i...
- renekooi 13y agoThat link says nothing about how good or bad Ember is, it refers to a lack of Getting Started documentation. Last time I checked (which was a few weeks to two months ago) the documentation was mostly of an 'intermediate' level, ie. hardly any documentation on the easy parts and hardly any documentation on the hard parts. It looks like it's gotten tons better since, eg. http://emberjs.com/guides/getting-started/ http://emberjs.com/guides/getting-started/
- ekanna 13y agoHave a look at http://ractivejs.org http://ractivejs.org
- halis 13y agoI say once you do our own or add databinding to backbone, life is very very good. I love the events on the models views and collections. I was almost thinking about writing a databinding where it only updates one property at a time on change. Why update the whole view or model. Is that provided in any backbone addition?
- Nitramp 13y agoYou can see the important difference between Amber and AngularJS in the 'computed properties' snippet of Amber: App = Ember.Application.create(); App.ApplicationController = Ember.Controller.extend({ name: '', greeting: function() { if (this.name.length < 1) return ''; return 'Hello, ' + this.name; }.property('name') }); You write this to use a property 'greeting' in a view that's calculated from a different property 'name'. This works for one model, but imagine you have dependencies across different model objects, nested properties, and so forth. Seems like it'll get complicated pretty quickly. In AngularJS, that's just (in the template, or a controller function, or where ever): {{name + greeting}} AngularJS uses dirty checking, which makes it trivial to implement complicated interdependencies between various fields. Any plain JavaScript code will work, including model objects that were not written as Ember code. This comes at the cost of the dirty-checking loop (checking each expression in a tight loop on every user 'event'), but in my experience that's at least not a problem for normal desktop web applications.
- manmal 13y agoI'm not sure I really catch your drift, but: Using {{name}} {{greeting}} in Ember should have the same effect as {{name + greeting}} in your example, right? You need not use computed properties in Ember, because updates on ordinary model fields are also updated in templates in real-time (AFAIK works very similar to KVO in Objective-C). Computed properties are just a ridiculously useful concept which allows you to modify/transform stuff before you show it to the user, similar to the view-model in MVVM. How would you show an empty string in Angular with "{{name + greeting}}" if name is empty?
- Kerrick 13y agoI wrote that contrived example to show off computed properties. In idiomatic Ember.js, I would have written the template as follows, with no Computed Property (indeed, no explicit Controller) needed: {{#if name}}Hello, {{name}}{{/if}}