MVC FormCollection Performance Speed

Question

I am working on a page that has a dynamically generated markup. And as such, I have no idea what fields are available on the form. So instead of creating a view model, the POST method uses the FormCollection. Once the POST is received, the program runs quickly.

My problem: Clicking SUBMIT on the form will take about 10 - 15 seconds to hit a breakpoint on the first line of the POST action in the controller. In my scenario, there are 800 input fields on the form. Does it really take this long to create the FormCollection for only 800 fields? Are there any ways to streamline the process or improve the response time?

EDIT:

The IE profiler indicates the majority of time is spent in the JQuery CSS selector. If I remove all CSS, the page works very quickly. Why is the CSS selector running prior to posting back to the server? Can I disable it?

EDIT 2: The profiler is now showing time spend in JQuery 1.6.4.min.js, the function is 'k'. I think that is just an internal varialble lookup. I have also found that removing the 'size' and 'maxlength' attributes from the input fields makes the page respond quickly (hooray)... except... I need those for client side validation. I'm still trying to find a way to improve the speed, or remove the attributes and retain some way to limit the input length of the fields on the client side.

Edit 3: I've dug into the jquery-1.6.4.min.js and found function k. Per Edit 2, adding/removing the 'maxlength' and 'size' attributes makes all the difference (33K ms instead of 3k ms). However, function K should not do much... as those are not nodetype===1 and the first IF should fail, returning out of the function on the next line.

function k(a,c,d)
    {
        if(d===b&&a.nodeType===1)
        {
            var e="data-"+c.replace(j,"-$1").toLowerCase();
            d=a.getAttribute(e);
            if(typeof d=="string")
            {
                try
                {
                    d=d==="true"?!0:d==="false"?!1:d==="null"?null:f.isNaN(d)?i.test(d)?f.parseJSON(d):d:parseFloat(d)
                }
                catch(g){}
                f.data(a,c,d)
            }
            else 
                d=b
        }
        return d
    }

800 input fields you are saying? May God have mercy on the poor soul that will have to fill this form :-) — Darin Dimitrov, Jul 14 '12 at 11:31
Take a look on implementing a custom model binder. I had to do that since I also had dynamic markup. Probably won't make it perform better but your code will look much cleaner after that. — turtlepick, Jul 15 '12 at 17:00
They don't have to enter 800 values, just some, and really it is a business requirement over which I have no control. The real question is how to make MVC perform in a reasonable time frame. — Paul, Jul 16 '12 at 19:59
Your problem has nothing to do with MVC, it's entirely client side. You may try disabling client-side validation (it's in web.config) — Erik Funkenbusch, Jul 16 '12 at 20:19
Are you doing any client-side validation manually? Are you using any jquery plug-ins? — Erik Funkenbusch, Jul 16 '12 at 22:36
@MystereMan Yes, there are some other jquery items in the master page. So I checked with one of the leads to see if there is anything that could be validating these items... He has no idea either. — Paul, Jul 17 '12 at 13:36
@MystereMan it appears to be client validation after all... but not due to the webConfig. — Paul, Jul 17 '12 at 15:07

score 1 · Answer 1 · edited Oct 31 '19 at 10:32

I just created a form with 1000 fields and the controller can access each field in less than a second from when I submit.

This is how I create the fields:

<script language="javascript" type="text/javascript">
$(document).ready(function () {
    for (var i = 0; i < 1000; i++) {
    $('<input/>').attr({ type: 'text', id: 'test'+i, name: 'test'+i,value:'test '+i }).appendTo('#fields');
    }
    });
</script>

and this is the action:

    public ActionResult TestFields()
    {
        for (int i = 0; i < 1000; i++)
        {
            if (Request.Form[i] != string.Format("test{0}", i))
            {
                throw new Exception("bad value received");
            }
        }
            return View();
    }

Populating the FormCollection with form values doesn't seem to be the problem. I have short values and testing on local network. If you have longer values and a slow network, that could be the problem. If each of your values is 1KB, you need to send 800KB.

When I reproduce your code... (and adding the FormCollection parameter to the POST) the FormCollection is empty. It responds immediately for me as well... there is just no data... I'm not sure why it is empty, the name attribute is assigned. — Paul, Jul 16 '12 at 12:55

score 0 · Accepted Answer · edited May 23 '17 at 11:56

From comments with Mystere Man, it turns out somehow the client side was validating, this link solved the issue: http://forums.asp.net/t/1523883.aspx/1/10?Disabling+client+side+validation+on+submit+button+

Basically, I disabled the validation on the submit button. This allows the 'maxlength' and 'size' attributes to work when the user types, but prevents any client side validation on the POST. This behavior seems fine, as the server will validate again as the input is processed. The average time for the POST changed from 33 seconds to 2 seconds.

Also here: Disable client-side validation in MVC 3 "cancel" submit button

MVC FormCollection Performance Speed

2 Answers2