MVC in JS (ExtJS)

Coding Critique is the place to post source code for peer review by other members of DevNetwork. Any kind of code can be posted. Code posted does not have to be limited to PHP. All members are invited to contribute constructive criticism with the goal of improving the code. Posted code should include some background information about it and what areas you specifically would like help with.

Popular code excerpts may be moved to "Code Snippets" by the moderators.

Moderator: General Moderators

User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: MVC in JS (ExtJS)

Post by Christopher »

josh wrote:Let's just humor my question? Let's say you write to your models in the view. What is the purpose of a controller anymore? How do you define what goes in a controller vs what does not anymore?
Ok ... I'll humor you this once! ;)

The purpose of the Controller is still Request processing and program flow. There are things like forwards that seem to be specific to the Controller. Remember the "the Controller" includes both the Front and Action Controllers in modern frameworks. There is still plenty for the Controller to do.

But there are also things like Access Control that are often done by both -- course grained control by the Controller (access to controller/action) and fine grained control by the View (displaying page item only for certain roles). So there is obviously functionality that both Controller and View both do.
josh wrote:I don't think MVC can be defined by a dependency diagram, like I said I could put my business logic in all 3 layers to intentionally make bad code, but if my dependencies are like that diagram it doesn't make it MVC, in my opinion. If I put all my view code in the controller, all my business logic in the view, and all my presentation logic in the "model" layer.... at some point you're going to call that "not MVC", lol. The question is how much code until it becomes not MVC? 1 line in the wrong place? 100 lines?
Well talking about Model layer / Presentation layer separation is not something we disagree about. I think the separation between Controller and View is not as clear cut as the Model/Presentation layer separation. Even Fowler says the distinction between Controller and View is not a clear cut.

Which gets back to my question: Why should the View never be able to "write" to the Model?
(#10850)
User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: MVC in JS (ExtJS)

Post by Christopher »

VladSun wrote:Great topic, but ...
VladSun wrote:Except these things, what's your opinion about this code?
:P
Oh ... there was a question by the OP? ;)

I looked at the code and like the general idea. I don't know Ext well enough and it seems like Ext is doing some important parts or the process. It seems like they are on the right track though...
(#10850)
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: MVC in JS (ExtJS)

Post by josh »

Christopher wrote:Which gets back to my question: Why should the View never be able to "write" to the Model?
Because they called it a view and not a write :twisted: So what's the difference between a controller that outputs some JSON, and a view that handles it's own "application flow"? lol Just the name? Personally I prefer my stricter interpretation of MVC. I agree with VladSun's original post that writing to the model in the view is a "smell", it just violates command & query separation to me.. Rendering a view just "feels" like it should have no side effects. For example maybe the view is recording a "hit" to a page (in terms of web traffic). Well what if programmer #2 wants to write a pro-active caching to render the view & cache it every 20 minutes, every time his cron job runs you're logging a "hit" (I guess there's ways around that, but its just a smell to me)
User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: MVC in JS (ExtJS)

Post by Christopher »

josh wrote:Because they called it a view and not a write :twisted:
Well ... it's called a controller not a write. That is not really a reason.
josh wrote:So what's the difference between a controller that outputs some JSON, and a view that handles it's own "application flow"? lol Just the name?
So what about controllers that provide error messages, or do redirects (is that HTTP output or program flow?) And you are saying that Views cannot have ifs and loops in them? If they can, is that program flow?
josh wrote:Personally I prefer my stricter interpretation of MVC. I agree with VladSun's original post that writing to the model in the view is a "smell", it just violates command & query separation to me.. Rendering a view just "feels" like it should have no side effects.
You "prefer" and it "feels"? It think command & query separation is probably a better reason. How exactly does it violate it for you?
josh wrote:For example maybe the view is recording a "hit" to a page (in terms of web traffic). Well what if programmer #2 wants to write a pro-active caching to render the view & cache it every 20 minutes, every time his cron job runs you're logging a "hit" (I guess there's ways around that, but its just a smell to me)
You could have the same problem if you cache requests before the controller is called. Yes that's a problem. We agree that if you are going to separate the Controller and View that it makes sense to keep them in their input and output roles. I think my problem is that you want to eliminate a choice for what I consider to be vague or general reasons.

I am not just playing Devil's Advocate here. As I said above, when I read non-Java influenced (i.e., Controller=Bean, View=JSP) sources about MVC there is usually much less strictness about Controller/View separation. Every framework seems to take their own position. I just don't see the technical reason for strictness...
(#10850)
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: MVC in JS (ExtJS)

Post by josh »

It violates command & query separation because you're calling a method (view render) which has a return value (the rendered view) & if also writes to the model it changes program state. Its non repeatable.
Christopher wrote:So what about controllers that provide error messages, or do redirects (is that HTTP output or program flow?) And you are saying that Views cannot have ifs and loops in them? If they can, is that program flow?
I agree that there is cross-over, for example a controller & view can both choose another view to render. But for the most part I'd disagree that a controller should "provide" any kind of message, that should be in the view, or language file IMO. Every definition of MVC I read says "the controller performs actions on the model", and under view it implies read-only. Take for example wikipedia (not that its the best source)
1. The user interacts with the user interface in some way. (for example, presses a mouse button).
2. The controller handles the input event from the user interface, often via a registered handler or callback and converts the event into appropriate user action, understandable for the model.
3. The controller notifies the model of the user action, possibly resulting in a change in the model's state. (For example, the controller updates the user's shopping cart.)[4]
4. A view queries the model in order to generate an appropriate user interface (for example, the view lists the shopping cart's contents). The view gets its own data from the model. In some implementations, the controller may issue a general instruction to the view to render itself. In others, the view is automatically notified by the model of changes in state (Observer) which require a screen update.
5. The user interface waits for further user interactions, which restarts the cycle.
It does point out that the view can sometimesupdate itself, or the controller can update the view (as you basically point out). But for the "view" it specifically says 'query' (read-only). If that's not clear enough in the next sentence it says its "getting data", (not getting and sometimes putting). Under controller one of it's primary responsibilities is always updating the model.

I guess we agree, I'm not saying "never do this", but for the most part if you do "that" consistently, you're doing it wrong. At some point it becomes not MVC, and since its subjective I find it easiest to just never do "that". For example we both agree there is "logic" in the view, but at some point it becomes "business logic", which is simply not MVC (or at the very least very poor MVC)

Also re: to "its called a controller not a write". This makes sense to say "this code controls the write operation", this does not make sense however "this code views the write operation"

Also here's what MSDN says
View. The view manages the display of information.

Controller. The controller interprets the mouse and keyboard inputs from the user, informing the model and/or the view to change as appropriate.
http://msdn.microsoft.com/en-us/library/ff649643.aspx

I don't know, just pretty clear cut to me. They also disagree that the separation is not clear (disagree with Fowler on that one sentence)
In Web applications, on the other hand, the separation between view (the browser) and controller (the server-side components handling the HTTP request) is very well defined.
They even made a UML diagram in case its not clear enough

Image
( i guess "service" means read and/or write?)
User avatar
VladSun
DevNet Master
Posts: 4313
Joined: Wed Jun 27, 2007 9:44 am
Location: Sofia, Bulgaria

Re: MVC in JS (ExtJS)

Post by VladSun »

Christopher wrote:I looked at the code and like the general idea. I don't know Ext well enough and it seems like Ext is doing some important parts or the process. It seems like they are on the right track though...
So, you find the patterns mentioned and used as such, properly implemented and their usage makes sense?
There are 10 types of people in this world, those who understand binary and those who don't
User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: MVC in JS (ExtJS)

Post by Christopher »

VladSun wrote:So, you find the patterns mentioned and used as such, properly implemented and their usage makes sense?
In general, except I don't exactly know the role that Ext is doing. It seems to be performing much of the Controller functionality. That seems to muddy things for me.
(#10850)
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: MVC in JS (ExtJS)

Post by josh »

Yeah, if the line between server side view and server side controller is something blurry, the line between "client side controller" and server side controller is even more blurry to me. Vlad you said your server side code is just database wrappers, so do you do validations server side and use code generation to spit out client side validations? Or do you validate with an ajax call? I'm interested in where you are duplicating code server & client side, vs not duplicating code. I take it this doesn't "Gracefully degrade" either? Do you just do this mainly on the admin panel (I'd think most clients have a "template" they want to use on the front end, rather than have it look like an operating system)
User avatar
VladSun
DevNet Master
Posts: 4313
Joined: Wed Jun 27, 2007 9:44 am
Location: Sofia, Bulgaria

Re: MVC in JS (ExtJS)

Post by VladSun »

josh wrote:Vlad you said your server side code is just database wrappers, so do you do validations server side and use code generation to spit out client side validations? Or do you validate with an ajax call? I'm interested in where you are duplicating code server & client side, vs not duplicating code. I take it this doesn't "Gracefully degrade" either?
Yes, there is some code duplication - most validations and some business logic. Some of the server side validation are taken care by the ORM (Doctrine in my case) and some I have to write myself.

I am almost done with my "CryoGen" project - it takes an MySQLWorkbench schema model file and generates the appropriate PHP and JS classes. It can even handle 1:1, 1:n and n:m relationships by building a "grid - master grid" components or a checkbox select component. There is a Tree component for hierarchical tables. Etc.

There are some ExtJS components that are configured by data returned from AJAX query, which avoids a lot of code duplication.
josh wrote:Do you just do this mainly on the admin panel (I'd think most clients have a "template" they want to use on the front end, rather than have it look like an operating system)
As I have mentioned here, in this frorum, my projects are web applications, not web sites, so it's always the "admin panel".
There are 10 types of people in this world, those who understand binary and those who don't
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: MVC in JS (ExtJS)

Post by josh »

So if someone asks you to make a web site you just always turn down the project? I thought I remember you sending me a website by private message a few months ago...

So with your validations you post an invalid value (sometimes), and Doctrine throws an exception which you catch, and if the exception is caught that is the way you know to tell the client the field was invalid?
User avatar
VladSun
DevNet Master
Posts: 4313
Joined: Wed Jun 27, 2007 9:44 am
Location: Sofia, Bulgaria

Re: MVC in JS (ExtJS)

Post by VladSun »

josh wrote:I thought I remember you sending me a website by private message a few months ago...
Yep, but it's still a "project". I have a designer and a "web-site-guy" who will get involved once the project passes the "pre-project" phase :)
josh wrote:So with your validations you post an invalid value (sometimes), and Doctrine throws an exception which you catch, and if the exception is caught that is the way you know to tell the client the field was invalid?
Yes, something like this :)
There are 10 types of people in this world, those who understand binary and those who don't
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: MVC in JS (ExtJS)

Post by josh »

What do you mean by project/pre-project? I remember seeing a "website" front-end, you didn't work on that?
User avatar
VladSun
DevNet Master
Posts: 4313
Joined: Wed Jun 27, 2007 9:44 am
Location: Sofia, Bulgaria

Re: MVC in JS (ExtJS)

Post by VladSun »

Well, I still can't (or at least too bad) parse the imports. And this is critical for this project. So .... I have only the Importer GUI. It's a "pre-project issue" :)
There are 10 types of people in this world, those who understand binary and those who don't
User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: MVC in JS (ExtJS)

Post by Christopher »

As a sidenote, Jonah and I have been looking into Javascript MVC frameworks -- with a jQuery bias. There is a large and active project called JavascriptMVC. We also found a much smaller one that is interesting called CorMVC.
(#10850)
User avatar
VladSun
DevNet Master
Posts: 4313
Joined: Wed Jun 27, 2007 9:44 am
Location: Sofia, Bulgaria

Re: MVC in JS (ExtJS)

Post by VladSun »

Sencha has provided some guides along with API docs:

http://dev.sencha.com/deploy/ext-4.0.0/ ... cture.html
There are 10 types of people in this world, those who understand binary and those who don't
Post Reply