In a current project the client asked for the possibility of answering a questionnaire in two ways: using a Wizard (one question at a time) and Listing (all questions at once) in a single form. Both ways are already implemented.
The questions are loaded from the database per Manual's chapter using AJAX (this is super fast). The biggest chapter at the moment has 230 questions (each with 4 HTML input fields - input/text, select, etc). If the user selects such Chapter to answer in the Listing format, the <form> will contain at about 920 fields to be posted to the server.
I'm doing an AJAX POST request passing the data with jQuery's serialize method:
data: $("#questions :input").serialize()
This serialization takes 207.143ms to complete. I got this value debugging with Firebug in Firefox:
console.profile();
$("#questions :input").serialize();
console.profileEnd();
Again this is super fast...
The problem comes when hydrating the data received on the following action method:
public async Task<ActionResult> ListSaveAsync(IEnumerable<AnswerViewModel> questions)
As you see, the posted data is data bound to an IEnumerable<AnswerViewModel> questions. AnswerViewModel has only 4 fields to store each answer.
The thing is that it takes a considerable amount of time (precisely 10 seconds) after clicking the Save button to hit a breakpoint on this action method, that is, those 10 seconds are being spent in the model binder presumably.
An important thing to mention is that I'm using Steve Sanderson's @Html.BeginCollectionItem helper to help when materializing the ViewModel collection properties from the HTTP POST. See how the data gets in the ViewModel (Keys):
Do you know what I can try to do to optimize this?
I thought about 4 workarounds:
Save back only the modified questions. To do this I'd need to store each answer value in a data-attribute when loading the listing and compare it with the actual value when submitting the
<form>as this guy suggests here.Create
AnswerViewModelJavaScript objects on the client side and pass them to the action method. Would this alleviate the Model Binder?Roll my own model binder... but I really don't know if it would be faster than the default one that comes with ASP.NET MVC. From what I've read the default model binder does a lot of reflection to set the values/hydrate the action's model parameter and this could be the bottleneck.
Use
FormCollectionand enumerate through the posted data getting each value by key and performing validation manually as shown here.
What else do you suggest?
Update 1
I went with option 3 and implemented a custom Model Binder: AnswerModelBinder : IModelBinder and used it in that specific action method:
public async Task<ActionResult> ListSaveAsync(
[ModelBinder(typeof(AnswerModelBinder))]List<AnswerViewModel> questions)
Now what took 10 seconds to complete takes only 2 seconds.
- Looks like the default model binder validation checks [
ModelState] has a big impact on performance.
Update 2
I just experienced it once again: having a List<Guid> as an action parameter and passing only 59 strings through a $.getJson call was taking ~3 seconds to hit a breakpoint in the 1st line of the action method. Changing the parameter type to List<string> made the whole thingy work in the blink of an eye.
An interesting fact is that inside the action method I did this:
List<Guid> userIds = resources.Select(Guid.Parse).ToList();
and it transforms the resources List<string> to a List<Guid> instantaneously.
For sure there's something buggy with ASP.NET model binder. I just would like to know what it is... :)
