Avoid viewstate to display on website source code

Question

I have performance issue on website, because of too long viewstate in source code. on some pages it's size is more than 15-20kb. Which is increasing the load time on browser.

Is there any way to disable viewstate partially or fully without any harm on other module of website. FYI there is one listview and one form on these example pages. where viewstate is very long.

More Example pages

http://www.pricingindia.in/coupons/ebay-in-coupon-codes-20

http://www.pricingindia.in/coupons/flipkart-coupon-codes-32

Answer 1

You probably want to disable for ViewState for your Page in general, and then only enable ViewState for the controls that need / use it.

See this MSDN page on the Control.ViewStateMode property, it describes how to set that up:

To disable view state for a page and to enable it for a specific control on the page, set the EnableViewState property of the page and the control to true, set the ViewStateMode property of the page to Disabled, and set the ViewStateMode property of the control to Enabled.

You will need to do some testing to see which controls need / use the ViewState in your specific app. But, basically,

• anything that's static, you can disable the ViewState (Buttons, LinkButtons, etc).
• Any controls whose state doesn't need to be restored between PostBacks, you can disable ViewState (such as a TextBox in a form that is submitted to the server, and then cleared).
• Any controls that need to keep their state between PostBacks, you want to enable Viewstate (this would often be databound controls like GridViews / etc).

Doing this should definitely reduce the load that ViewState is putting on your pages.

Answer 2

Okay, I couldn't leave well enough alone:

Firebug said the following bit of code blocked the site from rendering for about 6 seconds. I thought it was the jsapi (based on info from chrome's tools) but the following returned a "502 Bad Gateway" message meaning that it sat there spinning it's wheels unable to process while preventing your web page from displaying.

I would move the <script .. call to the header, where it belongs. Then I'd move the google.load and google.setOnLoadCallback to the bottom of the web page so it runs last.

Finally I'd figure out exactly why it's failing to work right.

Homework for you: get Firebug loaded into firefox and learn how to use it's Net tools to see where site loading issues are.

<div class="sr_bx1 FL clearfix">
 <div class="FL searchbg">
         <div id='cse' style='width: 100%;'>Loading</div>
        <script src='http://www.google.com/jsapi' type='text/javascript'></script>  
        <script type='text/javascript'>
            google.load('search', '1', { language: 'en', style: google.loader.themes.V2_DEFAULT });
            google.setOnLoadCallback(function () {
                var customSearchOptions = {};
                var orderByOptions = {};
                orderByOptions['keys'] = [{ label: 'Relevance', key: '' }, { label: 'Date', key: 'date'}];
                customSearchOptions['enableOrderBy'] = true;
                customSearchOptions['orderByOptions'] = orderByOptions;
                var imageSearchOptions = {};
                imageSearchOptions['layout'] = 'google.search.ImageSearch.LAYOUT_POPUP';
                customSearchOptions['enableImageSearch'] = true;
                customSearchOptions['overlayResults'] = true;
                var customSearchControl = new google.search.CustomSearchControl('010882286766777081969:xkox132izzk', customSearchOptions);
                customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
                var options = new google.search.DrawOptions();
                options.setAutoComplete(true);
                customSearchControl.draw('cse', options);
            }, true);
        </script>

</div>               

Answer 3

Using Page Adapter Class, you can solve this problem. I found following solution helpful for ASP.NET Web Application:

view state serialization is handled by an object of type PageStatePersister. (The PageStatePersister class is an abstract class that defines the base-level functionality for serializing view state to some persistent medium.)

Steps: 1) In Your Web Application, Add Folder: App_Browsers 2) In this folder, Add new BrowserFile: ViewStateAdapter.browser 3) Write following code in it:

<browsers>
    <browser refID="Default">
      <controlAdapters>
        <adapter controlType="System.Web.UI.Page" adapterType="ServerSideViewStateAdapter" />
      </controlAdapters>
    </browser>
</browsers>

4) In Your WebApplication, Add Folder: App_Code 5) In this folder, Add new ClassFile: ServerSideViewStateAdapter.cs 6) Write following code in it:

using System;
using System.Web.UI;
using System.Web.UI.Adapters;
public class ServerSideViewStateAdapter : PageAdapter
{
    public override System.Web.UI.PageStatePersister GetStatePersister()
    {
        return new SessionPageStatePersister(this.Page);
    }
}

You can refer this video, it can help you:

https://www.youtube.com/watch?v=36pmFySbXZA