{"id":26722970,"url":"https://github.com/useallfive/ember-presentation","last_synced_at":"2025-07-18T08:05:36.321Z","repository":{"id":15432407,"uuid":"18164984","full_name":"UseAllFive/ember-presentation","owner":"UseAllFive","description":"Presentation documentation and demo.","archived":false,"fork":false,"pushed_at":"2014-03-28T16:49:26.000Z","size":148,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":23,"default_branch":"master","last_synced_at":"2025-03-27T20:43:17.523Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/UseAllFive.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-03-27T05:05:21.000Z","updated_at":"2014-05-17T00:27:52.000Z","dependencies_parsed_at":"2022-08-26T05:41:08.398Z","dependency_job_id":null,"html_url":"https://github.com/UseAllFive/ember-presentation","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/UseAllFive/ember-presentation","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UseAllFive%2Fember-presentation","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UseAllFive%2Fember-presentation/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UseAllFive%2Fember-presentation/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UseAllFive%2Fember-presentation/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/UseAllFive","download_url":"https://codeload.github.com/UseAllFive/ember-presentation/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UseAllFive%2Fember-presentation/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":265724848,"owners_count":23817891,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-03-27T20:38:27.265Z","updated_at":"2025-07-18T08:05:36.293Z","avatar_url":"https://github.com/UseAllFive.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Ember @ UA5\n\n## Intro\n\nRefer to [core concepts][].\n\nIn short: A heavy client-side web framework for building big, URL-driven clients.\n\n[core concepts]: http://emberjs.com/guides/concepts/core-concepts/\n\n\u003e We're not going to go through all the marketing points for the framework. The\ngoal is to assess the framework with objectivity. We're going to compare it with\nour current tools. And in the process I hope we can better understand if Ember\nis a fit.\n\n## Features\n\nRefer to [wikipedia][].\n\nHighlights:\n\n- Router controls state.\n- Full-featured templated-view layer. Enhanced Handlebars.\n- Web components layer.\n- Advanced objects, with optional prototype. See [object model guide][].\n- Out-of-the-box [application class][].\n- [Ember Data][] (beta) as ORM with persistence and RESTful networking (like\n  ActiveRecord or Doctrine 1).\n- Integration testing QUnit API and Chrome DevTools extension.\n- Solid documentation and guides. Like Symfony, written around use-cases, but\n  optionally go into depth about [internals][].\n\n[wikipedia]: http://en.wikipedia.org/wiki/EmberJS/\n[object model guide]: http://emberjs.com/guides/object-model/what-do-i-use-when/\n[application class]: http://emberjs.com/guides/application/\n[Ember Data]: https://github.com/emberjs/data/\n[internals]: http://emberjs.com/guides/understanding-ember/the-view-layer/\n\n\u003e We have a list of highlights; not many, just a few. Ember, despite its\nrelatively large size, doesn't seem to provide a ton of additional features.\nInstead it seems to provide a more complete MVC framework that also takes into\naccount web technologies by addressing web-components (js/css/html slices) and\nURLs for state.\n\n## Comparison\n\nSemi-comprehensive list of the feature differences with Backbone:\n\n### Foundation features:\n\nFeature              | Backbone             | Ember\n:------------------- | :------------------- | :-------------------\nobject super         | plain js, verbose    | `_super` magic method\nobject creation      | plain js, `new`      | `create` method\nobject accessors     | only data classes    | all and computable\nobject kvobservation | only data classes    | all props, auto: `*Changed`\nobject bindings      | manual, via events   | two-way, auto: `*Binding`\nobject mixins        | `_.extend`           | `extend`, `reopen`, `reopenClass`\nobject manipulation  | `_`                  | `Ember`\nobject collections   | `Collection`         | `ArrayController`, bonus `SortableMixin`, `Ember.Enumerable`\nobject key paths     | not provided         | `todos.@each.isDone`\nmethod decorators    | not provided         | prototype extensions (optional)\nredundancy guarding  | not provided         | `Ember.run.once`\n\n### View and template features:\n\nFeature              | Backbone             | Ember\n:------------------- | :------------------- | :-------------------\nseparation / control | view -\u003e model        | template -\u003e controller -\u003e model\nattribute bindings   | manual, via events   | two-way, auto: `attributeBindings`, `bind-attr`, `classNameBindings`\ntemplate context     | manual, in view      | controller (proxies and extends model)\ntemplate nesting     | manual, in view      | `render`, `outlet`\ntemplate helpers     | not provided         | `input`, `textarea` (auto-bind)\ntemplate partials    | depends on templater | `partial`, `view`\ntemplate sharing     | not provided         | `view` block form\nlayout templates     | not provided         | `yield`, `layoutName`\nview actions         | `events` map         | `action` (Handlebars), auto: view methods (if complex)\ncontainer views      | not provided         | `Ember.ContainerView`\n\n### Router and manager features:\n\nFeature              | Backbone             | Ember\n:------------------- | :------------------- | :-------------------\napp class            | makeshift            | `Ember.Application`\nurl generation       | manual, hard-coded   | `link-to`, auto-interpolation, auto-updating, `query-params`\nroute objects        | not provided         | route handlers via `Route.extend`\nroute groups         | new router           | router resource (REST) with 'namespaced' route names\nroute transitions    | not provided         | `Router.transitionTo`, `Controller.transitionToRoute`, nested routes means sequential transitions\nroute redirect       | manual (`navigate`)  | `redirect`, `transitions.abort`, `transition.retry`\nroute composition    | not provided         | nested `resource` calls\nloading integration  | manual, events?      | `loading` action and bubbling event and route\nerror integration    | manual, events?      | `error` action and bubbling event and route\ncontrollers          | not provided (MVP)   | `(Object/Array/)Controller`, 1 per route, `setupController`, store state\nstoring misc. state  | 'local' model        | controller, which proxies the model\nimplied controllers  | not provided         | can generate (instantiate), can override via `controllerName`\nimplied models       | not provided         | can override in `model`\nimplied templates    | not provided         | can override in `renderTemplate`\n\n### Network and persistence features:\n\nFeature              | Backbone             | Ember\n:------------------- | :------------------- | :-------------------\npromise support      | not provided         | accepted by `Route.model`\npromises             | jQuery               | `Ember.RSVP` or jQuery\nmodel library outlet | not provided         | makes `Ember.Data` optional\nroute hooks          | not provided         | `beforeModel`, `afterModel`, promise support (resolve and reject)\nroute guarding       | manual               | `willTransition` action\npersistence          | third-party          | `Ember.Data`/`DS` or third-party\ndata store           | third-party          | `DS.Store`, automatic caching, record management\norm / schema         | third-party          | `DS.attr`, `DS.hasMany`, `DS.belongsTo`\nRESTful networking   | `sync`, jQuery       | `DS.Adapter` (subclass-ok) or third-party\nserialization        | manual, `parse`      | `DS.RESTSerializer` (subclass-ok) \u003e `DS.JSONSerializer`\nsharing data         | manual, n models     | `Controller.needs` to share controllers\nskip url update      | not provided         | `location: 'none'`\nundo                 | not provided         | `Record.rollback`\n\n\u003e As a legend for Ember, the names follow conventions. Dasherized names are for\nHandlebars helpers. Camelized names are for properties and methods. Asterisked\nnames are for suffixes / prefixes.\n\n\u003e While Ember provides magic, most of its features seem to solve real pain points.\nIt favors convention over configuration: the framework automatically links its\ncomponents through an implicit set of default behaviors common to client-side\nCRUD apps. It provides more structure and spells out more of the solution. The\nbenefit is the dev has less design decisions to make. The detriment is ability\nto make less decisions can make the framework inflexible or upgrading difficult.\n\n\u003e From the above, it seems Ember relies heavily on custom Handlebars helpers. This\nmakes its templates very powerful, but still very declarative. It seems to draw\nfrom and provide some of the benefits of Angular. Ember goes a step further in\nbaking in error and loading integration into each layer of the app. It also uses\npromises throughout the networking and data layers to simplify async\ndevelopment.\n\n\u003e As a side note on Backbone. It can supplement features not provided out of the\nbox with extensions. But if it was to and the extensions are proper, the\nextensions would almost always be extending the base Backbone classes. This\nrequires your application to be extending from a different layer with a\ndifferent API. In general it is less likely the extensions will follow the same\nAPI conventions, or even play well with each other. For example, you can't\ncombine two extensions' subclasses of `Backbone.Model` without mixing in their\nmethods and properties into your own class, which will likely lead to conflict\nand less maintainability.\n\n## Joga+1\n\nSee 'Game City' demo.\n\n## Conclusion\n\nEmber feels like a full-featured framework akin to Rails and Symfony. It helps\nus do more out of the box and get larger client-side apps out the door with less\nof _our own_ code written than Backbone. But, like with Rails and Symfony, Ember\nhas a large surface area. This means it's not only more to learn but also more\nto migrate. Moreover, doing anything outside of the established conventions may\nnot be straightforward. But, given we are fans of Symfony, it would make sense\nthat if the project required it, we would also find Ember as useful.\n\n## Epilogue\n\n- [Discussion between framework creators about differences][https://gist.github.com/jashkenas/1732351].\n- [Proposed changes for 2014][http://emberjs.com/blog/2013/12/17/whats-coming-in-ember-in-2014.html].\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fuseallfive%2Fember-presentation","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fuseallfive%2Fember-presentation","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fuseallfive%2Fember-presentation/lists"}