JSF and MVC 1.0, a comparison in code
A lot has been written about this. Discussions have mostly been about the why, whether it isn't introduced too late in the game, and what the advantages (if any) above JSF exactly are. Among the advantages that were initially mentioned were the ability to have different templating engines, have better performance and the ability to be stateless. Discussions have furthermore also been about the name of this new framework.
This name can be somewhat confusing. Namely, the term MVC to contrast with JSF is perhaps technically not entirely accurate, as both are MVC frameworks. The flavor of MVC intended to be implemented by MVC 1.0 is actually "action-based MVC", most well known among Java developers as "MVC the way Spring MVC implements it". The flavor of MVC that JSF implements is "Component-based MVC". Alternative terms for this are MVC-push and MVC-pull.
One can argue that JSF since 2.0 has been moving to a more hybrid model; view parameters, the PreRenderView event and view actions have been key elements of this, but the best practice of having a single backing bean back a single view and things like injectable request parameters and eager request scoped beans have been contributing to this as well. The discussion of component-based MVC vs action-based MVC is therefore a little less black and white than it may initially seem, but of course in it's core JSF clearly remains a component-based MVC framework.
When people took a closer look at the advantages mentioned above it became quickly clear they weren't quite specific to action-based MVC. JSF most definitely supports additional templating engines, there's a specific plug-in mechanism for that called the VDL (View Declaration Language). Stacked up against an MVC framework, JSF actually performs rather well, and of course JSF can be used stateless.
So the official motivation for introducing a second MVC framework in Java EE is largely not about a specific advantage that MVC 1.0 will bring to the table, but first and foremost about having a "different" approach. Depending on one's use case, either one of the approaches can be better, or suit one's mental model (perhaps based on experience) better, but very few claims are made about which approach is actually better.
Here we're also not going to investigate which approach is better, but will take a closer look at two actual code examples where the same functionality is implemented by both MVC 1.0 and JSF. Since MVC 1.0 is still in its early stages I took code examples from Spring MVC instead. It's expected that MVC 1.0 will be rather close to Spring MVC, not as to the actual APIs and plumbing used, but with regard to the overall approach and idea.
As I'm not a Spring MVC user myself, I took the examples from a Reddit discussion about this very topic. They are shown and discussed below:
CRUD
The first example is about a typical CRUD use case. The Spring controller is given first, followed by a backing bean in JSF.
Spring MVC
@Named @RequestMapping("/appointments") public class AppointmentsController { @Inject private AppointmentBook appointmentBook; @RequestMapping(value="/new", method = RequestMethod.GET) public String getNewForm(Model model) { model.addAttribute("appointment", new Appointment(); return "appointment-edit"; } @RequestMapping(value="/new", method = RequestMethod.POST) public String add(@Valid Appointment appointment, BindingResult result, RedirectAttributes redirectAttributes) { if (result.hasErrors()) { return "appointments/new"; } appointmentBook.addAppointment(appointment); redirectAttributes.addFlashAttribute("message", "Successfully added"+appointment.getTitle(); return "redirect:/appointments"; } }
JSF
@Named @ViewScoped public class NewAppointmentsBacking { @Inject private AppointmentBook appointmentBook; private Appointment appointment = new Appointment(); public Appointment getAppointment() { return appointment; } public String add() { appointmentBook.addAppointment(appointment); addFlashMessage("Successfully added " + appointment.getTitle()); return "/appointments?faces-redirect=true"; } }
As can be seen from the two code examples, there are at a first glance quite a number of similarities. However there are also a number of fundamental differences that are perhaps not immediately obvious.
Starting with the similarities, both versions are @Named and have the same service injected via the same @Inject annotation. When a URL is requested (via a GET) then in both versions there's a new Appointment instantiated. In the Spring version this happens in getNewForm(), in the JSF version this happens via the instance field initializer. Both versions subsequently make this instance available to the view. In the Spring MVC version this happens by setting it as an attribute of the model object that's passed in, while in the JSF version this happens via a getter.
The view typically contains a form where a user is supposed to edit various properties of the Appointment shown above. When this form is posted back to the server, in both versions an add() method is called where the (edited) Appointment instance is saved via the service that was previously injected and a flash message is set.
Finally both versions return an outcome that redirects the user to a new page (PRG pattern). Spring MVC uses the syntax "redirect:/appointments" for this, while JSF uses "/appointments?faces-redirect=true" to express the same thing.
Despite the large number of similarities as observed above, there is a big fundamental difference between the two; the class shown for Spring MVC represents a controller. It's mapped directly to a URL and it's pretty much the first thing that is invoked. All of the above runs without having determined what the view will be. Values computed here will be stored in a contextual object and a view is selected. We can think of this store as pushing values (the view didn't ask for it, since it's not even selected at this point). Hence the alternative name "MVC push" for this approach.
The class shown for the JSF example is NOT a controller. In JSF the controller is provided by the framework. It selects a view based on the incoming URL and the outcome of a ResourceHandler. This will cause a view to execute, and as part of that execution a (backing) bean at some point will be pulled in. Only after this pull has been done will the logic of the class in question start executing. Because of this the alternative name for this approach is "MVC pull".
Over to the concrete differences; in the Spring MVC sample instantiating the Appointment had to be explicitly mapped to a URL and the view to be rendered afterwards is explicitly defined. In the JSF version, both URL and view are defaulted; it's the view from which the bean is pulled. A backing bean can override the default view to be rendered by using the aforementioned view action. This gives it some of the "feel" of a controller, but doesn't change the fundamental fact that the backing bean had to be pulled into scope by the initial view first (things like @Eager in OmniFaces do blur the lines further by instantiating beans before a view pulls them in).
The post back case shows something similar. In the Spring version the add() method is explicitly mapped to a URL, while in the JSF version it corresponds to an action method of the view that pulled the bean in.
There's another difference with respect to validation. In the Spring MVC example there's an explicit check to see if validation has failed and an explicit selection of a view to display errors. In this case that view is the same one again ("appointments/new"), but it's still provided explicitly. In the JSF example there's no explicit check. Instead, the code relies on the default of staying on the same view and not invoking the action method. In effect, the exact same thing happens in both cases but the mindset to get there is different.
Dynamically loading images
The second example is about a case where a list of images is rendered first and where subsequently the content of those images is dynamically provided by the beans in question. The Spring code is again given first, followed by the JSF code.
Spring MVC
<c:forEach value="${thumbnails}" var="thumbnail"> <div> <div class="thumbnail"> <img src="/thumbnails/${thumbnail.id}" /> </div> <c:out value="${thumbnail.caption}" /> </div> </c:forEach>
@Controller public ThumbnailsController { @Inject private ThumbnailsDAO thumbnails; @RequestMapping(value = "/", method = RequestMethod.GET) public ModelAndView images() { ModelAndView mv = new ModelAndView("images"); mv.addObject("thumbnails", thumbnailsDAO.getThumbnails()); return mv; } @RequestMapping(value = "/thumbnails/{id}", method = RequestMethod.GET, produces = "image/jpeg") public @ResponseBody byte[] thumbnail(@PathParam long id) { return thumbnailsDAO.getThumbnail(id); } }
JSF
<ui:repeat value="#{thumbnails}" var="thumbnail"> <div> <div class="thumbnail"> <o:graphicImage value="#{thumbnailsBacking.thumbnail(thumbnail.id)}" /> </div> #{thumbnail.caption} </div> </ui:repeat>
@Model public class ThumbnailsBacking { @Inject private ThumbnailsDAO thumbnailsDAO; @Produces @RequestScoped @Named("thumbnails") public List<Thumbnail> getThumbnails() { return thumbnailsDAO.getThumbnails(); } public byte[] thumbnail(Long id) { return thumbnailsDAO.getThumbnail(id); } }
Starting with the similarities again, we see that the markup for both views is fairly similar in structure. Both have an iteration tag that takes values from an input list called thumbnails and during each round of the iteration the ID of each individual thumbnail is used to render an image link.
Both the classes for Spring MVC and JSF call getThumbnails() on the injected DAO for the initial GET request, and both have a nearly identical thumbnail() method where getThumbnail(id) is called on the DAO in response to each request for a dynamic image that was rendered before.
Both versions also show that each framework has an alternative way to do what they do. In the Spring MVC example we see that instead of having a Model passed-in and returning a String based outcome, there's an alternative version that uses a ModelAndView instance, where the outcome is set on this object.
In the JSF version we see that instead of having an instance field + getter, there's an alternative version based an a producer. In that variant the data is made available under the EL name "thumbnails", just as in the Spring MVC version.
On to the differences, we see that the Spring MVC version is again using explicit URLs. The otherwise identical thumbnail() method has an extra annotation for specifying the URL to which it's mapped. This very URL is the one that's used in the img tag in the view. JSF on the other hand doesn't ask to map the method to a URL. Instead, there's an EL expression used to point directly to the method that delivers the image content. The component (o:graphicImage here) then generates the URL.
While the producer method that we showed in the JSF example (getThumbnails()) looked like JSF was declarative pushing a value, it's in fact still about a push. The method will not be called, and therefor a value not produced, until the EL variable "thumbnails" is resolved for the first time.
Another difference is that the view in the JSF example contains two components (ui:repeat and o:graphicImage) that adhere to JSF's component model, and that the view uses a templating language (Facelets) that is part of the JSF spec itself. Spring MVC (of course) doesn't specify a component model, and while it could theoretically come with its own templating language it doesn't have that one either. Instead, Spring MVC relies on external templating systems, e.g. JSP or Thymeleaf.
Finally, a remarkable difference is that the two very similar classes ThumbnailsController and ThumbnailsBacking are annotated by @Controller respectively @Model, two completely opposite responsibilities of the MVC pattern. Indeed, in JSF everything that's referenced by the view (via EL expressions) if officially called the model. ThumbnailsBacking is from JSF's point of the view the model. In practice the lines are bit more blurred, and the backing bean is more akin to a plumbing component that sits between the model, view and controller.
Conclusion
We haven't gone in-depth to what it means to have a component model and what advantages that has, nor have we discussed in any detail what a RESTful architecture brings to the table. In passing we mentioned the concept of state, but did not look at that either. Instead, we mainly focussed on code examples for two different use cases and compared and contrasted these. In that comparison we tried as much as possible to refrain from any judgement about which approach is better, component based MVC or action-oriented MVC (as I'm one of the authors of the JSF utility library OmniFaces and a member of the JSF EG such a judgement would always be biased of course).
We saw that while the code examples at first glance have remarkable similarities there are in fact deep fundamental differences between the two approaches. It's an open question whether the future is with either one of those two, with a hybrid approach of them, or with both living next to each other. Java EE 8 at least will opt for that last option and will have both a component based MVC framework and an action-oriented one.
Arjan Tijms
JSF is not a pure MVC framework because it has view and controller mixed together. JSF does not give fine grained control over the HTML, Javascript and CSS. MVC 1.0 is a pure MVC framework and give fine grained control.
ReplyDeleteOn the other hand, JSF is a kind of rapid application development framework.
> JSF is not a pure MVC framework because it has view and controller mixed together.
DeleteWell, that's not entirely the case. In JSF the view is whatever the VDL loads and which contains the components. In practice this is the .xhtml Facelet file.
The controller is the FacesServlet.
See also this section on Wikipedia: http://en.wikipedia.org/wiki/Web_application_framework#Push-based_vs._pull-based
About being "pure" MVC, in reality none of the MVC web frameworks is that. In "pure" MVC (as introduced by Smalltalk) a model can for instance update the view on its own. To quote myself:
> Part of the reason why it's often not entirely clear in JSF and many other web frameworks which parts of it correspond to which part of MVC, is that the MVC pattern was originally devised for desktop applications.
In a desktop application, the nodes M, V and C are a maximum connected graph, meaning each part can communicate with every other part. E.g. if the model changes, it can push this change to the view. This is particularly visible in case there are multiple representations of the view in a desktop application. Change one, and see the other update in real-time.
Due to the client/server and request/response nature of web applications, classic MVC doesn't map 1:1 to most web frameworks.
About the following:
> JSF does not give fine grained control over the HTML, Javascript and CSS.
Well, having fine grained control over HTML, Javascript and CSS is not exactly in the description of the MVC pattern itself.
What you may think of as "pure" MVC is perhaps just "the way that Spring MVC does MVC", which is only one of the many ways, and as mentioned is not the original MVC way either. In fact, with its events and setup it has been said that JSF is actually closer to Smalltalk's original MVC pattern than Spring MVC.
Whether that's actually the case, and whether JSF has or does not has fined grained control over HTML, Javascript and CSS are both interesting discussion points, but not something I wanted to highlight in this particular article. May be a topic for a future article though.
Thanks for your reply ;)
One single big problem with JSF is unstable JSF component libraries such as Primefaces, which damage the image of JSF.
ReplyDeleteSounds like a comment from someone who is not good with JSF. I will develop quickly with the amazing Primefaces while you can stick to your granual mvc to build out your ui in 2 years.
DeleteThis comment has been removed by the author.
ReplyDeleteI kind of see Spring MVC as following the identical pattern as Servlet MVC. The spring servlet just forwards control to the Spring Controllers, which may have many request mappings, which unfortunately leads to large controller classes doing much more than they should.
ReplyDeleteHowever just having many Servlets, each servlet handling a single request mapping, leads to in my opinion, a much cleaner application with simpler Servlet based Controllers. JEE CDI dependency injection can be used in this environment. The two things missing are the automatic mapping between request parameters and variables, and handling of path parameters.
Do we *really* need automatic mapping?
@requestMapping("/doit")
public String doIt(@RequestParam(value = "memberId", required = false) Integer memberId){
}
is not that much easier than:
public void doGet(HttpServletRequest arg0, HttpServletResponse arg1){
Integer memberId = arg0.getParameter("memberId")==null?
null:Integer.valueOf(arg0.getParameter("memberId"));
}
And, adding a few utility methods can hide this 'hair', without resorting to a framework to do this.
So.... Really, all that I would want for MVC 1.0, would just be adding of path parameter support to servlet mappings. So, there might be
@WebServlet("/customers/{customerId}/address")
and an additional getPathParameter() method added to httpServletRequest.
Is this too much to ask without adding a framework that mimics Spring MVC, along with its disadvantages ?