binding or component based

Javascript is hot .and there are many Javascript MV frameworks getting popular (ReactJs and angularJs is the big player). they could be categorized into below 3 types:

One way binding
Simple.Ajax get data from server then bind with view template .this can also be done on server side (most web framework could do this like asp.net mvc and python flask)
Pros: Development fast .generally , any one way data flow page could consider use it .
Cons: view and model is 1 to 1 and hard to make it 1 to many or many to many. re-usability is low .
one-way-binding.jpg

Two way binding
One major difference from one way binding is that view not only be filled data by model ,also take the responsibility to notify the UI changes .
Pros: we can rush .
Cons: Same as one way, binding lower down code re-usability .every two way will need a observer pattern running behind , there is potential performance issue .
two-way-binding.jpg

 

Component-based Design
ReactJs is the leader here .the idea is to build component to improve the cohesion of each component so that could reduce the dependency of the entire system .
Pros: Maintainence and reusiblity.
Cons: Development may slow in the beginning (compare with binding approach).too many component on same page may get performance issue .
component-based.jpg

Conclusion
data flow is only from server to client, consider one way binding approach at the beginning. as pages and pages being built ,consider introduce React into project extract some reusable components .
Two way binding scenario consider replace by reactJs.
the approach is one way binding + component . JQuery could also come to picture as long as the cohesion (of each component) is kept high.

Author: lanliang

Programmer.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s