Everyone know MVC, but not everyone agress with the seperation of the concerns.

Q: Is the view on the server or lived in browser? Q: Is the view reusable? Q: Should the view be annotated with application-specific tags or markup? Q: Where should the bulk of the business logic reside? (in the model? in the controller?) Q: How is the application state persisted or accessed?

Traditional MVC

            User Interfaction          
                   |              
              +----v---+          
         +----+  View  <-----+    
 pass on |    +--------+     |Fires events    
         |                   |    
    +----v----+         +----+---+
    |control  +---------> Model  |
    +---------+ update  +--------+

This model assume a long-lived and swappable controller. it don’t care how view is rendered(b/c events). backbone.js

Model2

          request|   ^full-renderd http response
                 |   |           
              +--v---+-+          
         +----+ control|-----+    
   update|    +--------+     |pass on/render
         |                   |    
    +----v----+         +----v---+
    | model   |         |  view  |
    +---------+         +--------+

view is on server side, and client browser is think. Java server & RoR using it. the good thing about this layout is “fat models and thin controller”, controller is more like a dispatcher. because HTTP is stateless, the decision is made on Session cookies.

MVP and MVVM

Model-View-Presenter and Model-View-ViewModel are similar to MVC, but

• View don’t have direct reference to the Model
• view is thin
• Presenter/ViewModel has a reference to the view and update it based on changes to model

            User Interfaction          
                   |              
              +----v---+          
       +------+  View  |    
pass on|   +->+--------+     
       |   |update
       |   |                  
    +--v---+--+ manipulate +----+---+
    |presenter+----------->| Model  |
    |         <------------|        |
    +---------+   events   +--------+

MVVM assume that changes in ViewModel will refelcted in the View by data-binding, both way Angular, Ember.

Events

• On HashedChanged or pushState events: occur when URL in the browser changes
• DOM events: for example: clicking a tag