Question

I am trying to understand if MVC (as it works in Java desktop applications, for example) is applicable to JavaScript web applications.

By MVC I mean the following :

• Model is data that represent the application state. It is not aware of the page DOM.
• View is the DOM tree and functions, which listen to the Model changes and update the DOM
• Controller listens to user gestures (e.g. “button pressed”), calls the server, and updates the Model rather than View.

I looked through few JavaScript applications and saw something different. They do not have clear distinction between Model and View. That is, the application state is scattered over the DOM tree and Controller (e.g. ajax callbacks) updates the View (DOM tree) directly.

Now I wonder if the MVC as described above is really applicable to JavaScript applications running in the browser. What do you think?

Answer 1

MVC with JavaScript exists and is already possible. There are tons of library out there. I give you some ressource to dig in:

• http://addyosmani.com/toolsforjqueryapparchitecture/
• http://codebrief.com/2012/01/the-top-10-javascript-mvc-frameworks-reviewed/
• https://gist.github.com/441889
• http://peter.michaux.ca/articles/mvc-architecture-for-javascript-applications
• http://addyosmani.com/blog/building-apps-spinejs/

Addy Osmani blog contains a lot of informations about JavaScript design patterns, and especifically about MVC, you should have a look there http://addyosmani.com/blog/. He also has written a book about design patterns in Javascript http://addyosmani.com/resources/essentialjsdesignpatterns/book/