Skip to content

Other implementations

Yang Zhang edited this page Jul 16, 2013 · 57 revisions

Due to the current number of MVC/MVVM/MV* frameworks in circulation at the moment, it's not always possible to include each one in TodoMVC, but we would still like to show some of them off here.

MV*

Broke.js

The Broke Javascript Framework is a porting of the fantastic Django Web Framework on Javascript. It summarizes all the best concepts present in Django like url resolving, decoupling, DRY principle, project-specific settings and a pretty simple template engine. It could be put in the big Javascript MVC frameworks group outside there, but, as Django is, this is more a MTV (Model-Template-View) framework.

ClojureScript One

This submission uses the ClojureScript One MVC framework.

ClojureScript One is a "IDE in the browser" to develop/test/deploy web apps in Clojure/ClojureScript View part is done with Enfocus/Enlive.

Halo

Halo is a client-side MVC framework based on Addy Osmani's talks about Aura. It was conceived while Aura was still in private development, causing some concepts to be shared and others to be significantly different.

Non-MV*

abaaso

abaaso is a modern, lightweight Enterprise class RESTful JavaScript application framework. This version provides an alternative way to do the application with a focus on events & OOP, which create a reactive GUI. Sorting is implemented on the DataList with an SQL like syntax.

ClojureScript + C2

Clojure is a lisp-dialect on the JVM, and ClojureScript is Clojure compiled to JavaScript. This particular submission uses the C2 Clojure library, which is (roughly) what would happen if Knockout.js and D3.js had a baby and raised it on a diet of 100% organic, free-range, immutable data structures.

Laces.js

Laces.js provides you with a Model, but nothing more. It provides you with the laces to tie your model to whatever View or Controller you prefer. It consists of about 700 lines of JavaScript code, including whitespace and comments. Optionally, you can add one or more add-ons for extra features.

reactive.coffee

A lightweight CoffeeScript library/DSL for reactive programming and for declaratively building dynamic web UIs. It focuses on simplicity and on scalability in both performance and application architecture.

VanillaJS by Ondras

A fresh take on the existing "vanillajs" implementation in pure JavaScript. This version is rather short and compact, leverages JS prototypes and event handling using the EventListener paradigm. Its goal is to show that a viable solution is well possible without tons of kilobytes of external tools - and that this solution is readable, maintainable and usable.

Combinations

AngularFire

Firebase bindings for AngularJS that will make it even easier for developers to write rich, real-time web applications using the two technologies.

AngularJS + Persistence.js

Backbone.Marionette

Backbone.Marionette is a composite application library for Backbone.js that aims to simplify the construction of large scale JavaScript applications. It is a collection of common design and implementation patterns found in the applications that I (Derick Bailey) have been building with Backbone, and includes various pieces inspired by composite application architectures, such as Microsoft's "Prism" framework.

Backbone.js with sorting

Backbone example with sorting of todos using jQuery UI.

Backbone.js + LMD

LMD: Lazy Module Declaration - powerful yet simple loader/builder. LMD is not yet another RequireJS - it is different.

Backbone.js + Socket.IO + Express.js + MongoDB

Realtime implementation by Ishuah Kariuki.

Ember.js + Persistence.js

Ember.js + RequireJS

The Ember code behind this application is almost an exact duplicate of the example without RequireJS. The code has been split into multiple files, using RequireJS to load them on demand.

A great discussion took place discussing the simplicity of the TodoMVC demo application and the current complexity of marrying an Ember.js application with RequireJS. To learn more about the reasoning behind keeping this implementation separate, a link is provided below.

ExtJS using widgets

Harmony + jQuery BBQ

LibJS

LibJS is a project with a bunch of libraries:

  • MaskJS: brings syntax similar to zen coding and the fastest template engine
  • CompoJS: brings OOP(Component Oriented Markup) to mask templates
  • IncludeJS: resource loader/builder (script, views, styles, images ... @also from external resources)
  • ... others

Meteor with CoffeeScript

Clone this wiki locally