Caching an ASP.Net page


The issue of "caching" keeps coming up in my seminars so I though it would be a good idea to write a post. I know it is a well documented feature and widely used but I really believe most people will be able to use this rather simple example and understand the concepts behind caching.

You can use any of the versions of Visual studio (VS 2005,VS2008,VS2010 express editions work fine).

I will use VS 2010 Ultimate edition and as the .Net language of choice.

1) Create an web site and name it as you want.

2) In the default.aspx page add a new paragraph or header with content of your choice.In my case i have added something like this

<h2>Caching is really useful!!!!</h2>

3) Let's think simple at first. We do want to cache the entire page (default.aspx)

Just below the Page directive ( top of the page ) you add the following bit of code:

<%@ OutputCache Duration="20" VaryByParam="none" %>

 We do cache the page for 20 seconds. That is determined by the Duration Attribute.

4) Save your work and run your application. The first time we see the output of the page, this is served directly from the engine.

If you hit refresh for a period for less than 20 seconds the page is served from the Cache.

5) Let's see a more complex scenario involving query strings and how we can make a decision on whether to cache the page or not based on the value of the query string. Add a new label control to the .aspx page

 <asp:Label ID="mylabel" runat="server"></asp:Label>

  In the Page_Load event handler routine add the code

If (Not Request("id"Is NothingThen
            mylabel.Text = " The query string value is " + Request("id").ToString()

        End If

6) Change the OutputCache directive to

 <%@ OutputCache Duration="20" VaryByParam="id" %>

7) Run your application and type in the url address bar http://localhost:6141/caching/Default.aspx?id=5. See the results. If you hit refresh right away the page is refreshed from the cache and it is not reloaded.

 If you type this http://localhost:6141/caching/Default.aspx?id=6 ( within the 20 seconds period ) it senses that the id has changed now and it re-renders the page. It also sets a new caching period of 20 seconds.

8) What is really interesting to bear in mind ( and not many people know ) is that you can have different caching settings depending on the client's browser.The first step is to change the OutputCache directive to this

 <%@ OutputCache Duration="20" VaryByParam="id" VaryByCustom="browser" %>

9) Basically we say "Continue to cache the page as long as the clients use the same browser". So if you have 3 people in a row that have IE8 hitting your page, will all get the same cached version of the page.

If someone hits our page with Firefox or Chrome, they will get a brand new rendered page. At this time it will create a 20 seconds cache window period specific for each browser.This functionality is built into the caching module, and will insert separate cached versions of the page for each browser name and major version.

10) Now if we need to apply the caching techniques we just learnt in all pages of our application we will have to make a few modifications in the web.config file.We will add something that is called "Cache Profiles"

Just below the <system.web> add this snippet

          <add name="basic" 

 So we have created a new profile that is called "basic". Now let's apply this cache profile to one or more pages in our website.

 So we switch back to our default.aspx page and in the OutputCache directive, type

 <%@ OutputCache CacheProfile="basic" %>

Run your application again and you will see that we do have the same caching effects.

Obviously you can create different cache profiles and apply them to various pages.

I will have more posts on caching shortly.

Hope it helps!!!


Comments have been disabled for this content.