Monday, July 4, 2011

jQuery tmpl page size vs. asp.net server control page size.

My previous post went over how to do a simple data bind using client side data binding with the jQuery tmpl plugin as opposed to data source objects and grid server controls that are often used with asp.net.  I think it's better way to go when possible.  One of the benefits of the tmpl plugin is that the page size is much smaller and you get to do away with all that view state.

I created a new project that does the same thing as the project from my previous post, only it uses asp.net UI server controls as well as the script manager and update panel controls.  You can download the new project here.

Figures 1,2 and 3 are screen shots of  web page properties from the new project along with a description of what you are looking at.  The main thing we care about is page size.


Figure 1

Have a look at figure 1.  This is just a plain asp.net page that has no ajax on it.  Just regular post backs.  Notice the page size is 4,766 bytes.















Figure 2

In figure 2 the same project, but we added a script manager tag which is required for a .net page that's going to use the ajax control tool kit or any of the ajax controls like the update panel.  Notice the size has jumped to 6,433 bytes and we haven't even added any update panels yet.













Figure 3

Here in figure three we have added the update panel, so that now our application mimics the jQuery application from the previous post.  Notice the size of the page is now 6,562 bytes.















Figure 4

Now in figure 4 I'm running the jQuery tmpl demo application from the previous post.  Notice the page size is 2,037 bytes.  That's less than 1/3 the size of the server control version using the script manager and the update panel.  No big deal you say?  In the world if 3G, it is a big deal.  On a network with lots of traffic, it is a big deal.   I think it's a more elegant solution.












Note: The property pages are from Internet Explorer 8, but the type is Chrome HTML Document because Chrome is my default browser.

No comments:

Post a Comment