Question

I have recently started using the MVVM pattern. I’m beginning to see that my View-Model’s might quickly get very large and unmanageable. Is there some way to counter this?

Answer 1

There are a few approaches to this. I’ve yet to find a single universal “fix”, but I’ll share a few things I’ve picked up along the way. You’ve tagged this as c#, but not specified what platform you’re using (is this a desktop app, ASP.NET website, or what?) so I’ll try to keep it generic. Most of my experience of MVVM is in web development though, so bits of that may creep in.

First, recognise that massive viewmodels can be a symptom of a design that needs rethinking. It might be that one page is trying to do too much. Breaking this page up into several pages will not only reduce the size of your viewmodel, it will also let you move logic into other methods and make your backend or server-side code easier to navigate, and may well make the page less cluttered and easier for the end user to actually use.

Second, look closely to see if your viewmodels are overstepping their bounds a little. They might be doing logic that should be handled elsewhere. For example, if you’re using repositories (or something like them) to access a data source, let those classes handle logic relating to constructing queries or preparing data for saving, rather than making your viewmodels do it. If you don’t use repositories, consider adding some in and shifting your datasource-access code to them.

Similarly, see if your viewmodels share logic. If so, shift it to a base class and inherit from that one whenever you need that shared logic. You can inherit from multiple base viewmodels to combine functionality and reduce code repetition.

This last point is a little more web-specific, but: make use of partial views. If the viewmodel for your page is getting large because that page has a lot of stuff on it, consider splitting the page into areas or panes (at least conceptually, if not visually) and making each area a partial view. This means that your view code is easier to read, because what was an enormous page is now more or less just a template with partial view calls. It makes your server-side code easier to read, because what was one big method to construct and populate this huge page is now several smaller ones. Best of all, it may even allow you to do clever things with those panes, like using AJAX to reload them (periodically or based on interactions or events) without having to reload the whole page.