ViewState Compression and AJAX, ASP.NET

I have found many articles and blog posts out there that talk about ViewState and how to handle it when it becomes too large. A large ViewState slows down your user’s browsing experience due to larger page sizes. There are many ways to address this issue: decreasing your use of ViewState, storing the ViewState in Session or elsewhere, HTTP compression, and the topic of my post, compressing the ViewState hidden field value.

At my last project we had been using ViewState compression, and it had worked just fine for them for a couple of years. The client was using the same solution that I’m sure 90% of the community was, where you override the two Page methods:

LoadPageStateFromPersistenceMedium
SavePageStateToPersistenceMedium

and store the compressed ViewState in a hidden form field. Here’s an example from one such article:

public partial class MyPage : System.Web.UI.Page
{
protected override object LoadPageStateFromPersistenceMedium()
{
string viewState = Request.Form["__VSTATE"];
byte[] bytes = Convert.FromBase64String(viewState);
bytes = Compressor.Decompress(bytes);
LosFormatter formatter = new LosFormatter();
return formatter.Deserialize(Convert.ToBase64String(bytes));
}
protected override void SavePageStateToPersistenceMedium(object viewState)
{
LosFormatter formatter = new LosFormatter();
StringWriter writer = new StringWriter();
formatter.Serialize(writer, viewState);
string viewStateString = writer.ToString();
byte[] bytes = Convert.FromBase64String(viewStateString);
bytes = Compressor.Compress(bytes);
ClientScript.RegisterHiddenField("__VSTATE", Convert.ToBase64String(bytes));
}
}

Note that Compressor is a custom class that you would write to do the compression/decompression. See the article above for sample code using Microsoft’s built-in compression libraries.

On our new endeavor of using third-party controls that used AJAX we noticed a problem. It seems these controls do not like the ViewState being ‘moved’ to a different form field (here it was moved to __VSTATE instead of the standard __VIEWSTATE). There must be some hard-coded references to this field name, and they cannot properly track their own state. The controls loaded fine but most of the AJAX calls would not run all of the correct events on the server.

After some searching I came across a solution that still compresses the ViewState but does so in an AJAX-friendly manner by leaving it in the __VIEWSTATE field. Since it was a hard-to-find forum post I thought it warranted a little more visibility and discussion.

In ASP.NET 2.0, Microsoft added a class called PageStatePersister, which is also exposed a property on the Page class itself. The page events mentioned above are still there and used, but now they hand off the dirty work to the PageStatePersister. The PageStatePersister is responsible for loading and saving ViewState.

There are a couple of ways you can implement ViewState compression using these events and/or PageStatePersister. One way is that you could you write your own persister and override the PageStatePersister property on the Page to use your class instead.

In my case I decided to override the two Page events above and now work with the PageStatePersister within the events. First, let’s look at the LoadPageStateFromPersistenceMedium event:


protected override object LoadPageStateFromPersistenceMedium()
{
String alteredViewState;
byte[] bytes;
Object rawViewState;
LosFormatter fomatter = new LosFormatter();
this.PageStatePersister.Load();
alteredViewState = this.PageStatePersister.ViewState.ToString();
bytes = Convert.FromBase64String(alteredViewState);
bytes = Compressor.Decompress(bytes);
rawViewState = fomatter.Deserialize(Convert.ToBase64String(bytes));
return new Pair(this.PageStatePersister.ControlState, rawViewState);
}

You see we first tell the PageStatePersister to Load itself with the ViewState. We then decode it as a base64 string and decompress. It is then deserialized and placed into a Pair object with current control state. The Pair is what is returned.

And now for the SavePageStateToPersistenceMedium event:

protected override void SavePageStateToPersistenceMedium(object viewStateIn)
{
LosFormatter fomatter = new LosFormatter();
StringWriter writer = new StringWriter();
Pair rawPair;
Object rawViewState;
String rawViewStateStr;
String alteredViewState;
byte[] bytes;
if (viewStateIn is Pair)
{
rawPair = ((Pair)viewStateIn);
this.PageStatePersister.ControlState = rawPair.First;
rawViewState = rawPair.Second;
}
else
{
rawViewState = viewStateIn;
}
fomatter.Serialize(writer, rawViewState);
rawViewStateStr = writer.ToString();
bytes = Convert.FromBase64String(rawViewStateStr);
bytes = Compressor.Compress(bytes);
alteredViewState = Convert.ToBase64String(bytes);
this.PageStatePersister.ViewState = alteredViewState;
this.PageStatePersister.Save();
}

Here we take the viewStateIn, which is the normal ViewState and instead compress it before saving to the PageStatePersister.

Now our ViewState is compressed and stored in the standard __VIEWSTATE field and our AJAX-enabled controls should be happy!