When should I use an MVC framework in JavaScript?

Question

I know this topic is likely to become subjective, therefore it is not about my particular web application I am working on.

For JavaScript, I haven't worked with MVC libraries like Backbone.js but I see the advantage in decoupling logic and views. On the other hand, it may just not be worth the time to learn the framework and adapt the application to make use of it. Moreover, handling all views in JavaScript makes SEO much harder, I guess.

So how should I decide whether it makes sense to use Backbone.js or a similar framework given the concept of a web application? On what depends the decision?

Any help to make the question more objective is welcome.

Answer 1

There are many client side javascript MVC (or MV*) frameworks out there. Most seem to have a different idea of what MVC is and how it should work together with your web application.

You should consider an MV* framework if the complexity in your client side javascript is becoming difficult to manage. If you have a team building a highly dynamic single page application (SPA) that does a lot of asynchronous communication with the backend then you will want to consider it. It's easy to end up with very messy javascript code otherwise.

An MV* framework will help you in one or more of the following ways:

• by defining how the code should be structured. This is done to various degrees depending on how opinionated the framework is. Backbone for instance considers itself a library rather than a framework and thus leaves more of the decision making up to the user
• by binding html to model. So if your data changes the page will be automatically updated (and vice versa)
• by providing useful features such as URL history (for single page apps) and validation

Answer 2

I think it depends on your project. Here is a checklist which can help you in deciding whether you should use frontend MV* framework or not.

• Lots of ajax request to backend
• Many of your functionality doesn't require full page reload. Like adding a comment, pagination or infinite scroll.
• You have models/REST API at backend. You can just replicate/use same structure at front end.
• You are sharing logic/dom manipulation functions across different pages.

I will add more if I find any more points. This is what I can think right now and this is not a complete list. Any suggestions are welcome.

Answer 3

As You Know MVC structure can be included in javascript by using backbone.js with underscore.js and other similar libraries mainly focusing on each form field as property in an entity such that entities can be used different purposes MVC structure is maintained for easy manipulation in javascript These structure good for event binding,dom manipulation ,serialization,etc

It depends on application's purpose for choosing which structure suitable whether its mvc or mvvm structure for javascript. MVVM structure can be included in the javascript through angular.js or knockoutjs or other libraries for dynamic binding to view component Javascript can be used
MVVM architecture will be usefull for maintaining form field binding without reloading or ajax There are a lot of application by maintaining the architecture in js and i have pointed out only a few .

for eg : Serialize form inputs to JSON using Backbone.js

In this example the form values are retrieved as model and then it can be manipulated and can add business logic and can be serialized or event binding and can do print or any thing