Chaplin.js

vs

Marionette.js

Chaplin & Marionette

Two frameworks on top of Backbone that attempt to solve similar problems. They are both:

  • MIT Licensed
  • Came out of larger Backbone apps
  • Focus on event-driven architecture
  • Handle object and event disposal
  • Re-introduce controllers
  • Child/nest/sub-views & regions
  • CollectionView / CompositeView
  • Advocate ECMAScript 5 strict

What is chaplin?

  • Framework on top of Backbone
  • Specifically designed for single-page apps
  • Provides enough structure for client-side apps
  • Still gets out of your way like Backbone
  • Not a do-all framework

What is Marionette?


Chaplin vs. Marionette


  Chaplin Marionette
Controllers Each route goes to controller They um..well..
Routing Single route file (similar to rails) Each module registers a route
Templates Handlebars Underscore
Views Composition Regions & layouts

Chaplin

More like a framework

  • Structure
  • Inheritance
  • CommonJS/AMD support
  • Built using Coffeescript
  • Mediator
  • Object/event disposal
  • Router
  • Controller
  • Subviews
  • CollectionView
  • View Composition

Chaplin: Structure

Chaplin: Architecture

  • Built using CoffeeScript
  • Supports CommonJS and AMD

Chaplin: Inheritance


Chaplin: Mediator & Pub/Sub

Chaplin: Object/event Disposal

Chaplin: Router

Chaplin: Controllers

Chaplin: Sub-views

Chaplin: Collection View

Chaplin: Composition

chaplin

Upside:
  • Derived classes retain super class events
  • Controller and all children are disposed on diff. route
  • Mediator & pub/sub
  • Separation between View render and attach
  • View Composition
  • CommonJS / AMD

Downside:
Layout / regions are weak

Debatable:
Written in Coffeescript, but not required for use.

MArionette

More of a unified collection of libraries for Backbone

MArionette


Upside:
  • Application modules
  • Layout / regions

Downside:

Sources

Chaplin.js vs Marionette.js

By chrisabrams

Made with Slides.com

Chaplin.js vs Marionette.js

  • 5,646

More from chrisabrams