Partial Page Caching in ASP.Net MVC 3 Razor With Entity Framework

Description: In this article I will describe how to do partial page caching in ASP.Net MVC3 Razor.

Content: First what is Partial page output caching?

Partial page output caching allows us to cache the rendering of a specific action on the view to enable the site to run faster. This can be a great technique to avoid unnecessary database calls to reduce server load and decrease client latency.

The ASP.Net Razor view engine allows us to encapsulate portions of your page in partial views that are similar to the classic ASP.Net ASCX user controls. The partial view needs to define a controller action similar to the controller actions of your normal page actions. For partial view output caching we have to write a PartialViewResult method instead of a generic ActionResult method.

Now we have to create the ASP.Net MVC3 application. I am not describing here how to create the application. Just go through the two links listed below. Now I will implement the partial view output caching in the existing application.

The two links are:

http://www.c-sharpcorner.com/UploadFile/b19d5a/7464/
http://www.c-sharpcorner.com/UploadFile/b19d5a/7472/

I assume you have gone through the above two articles. Now I will write the caching technique in the "Home" Controller.

[OutputCache(Duration = 10, VaryByParam = "ParamA;ParamB;")]
        public PartialViewResult CachableAction(string SomeParameter)
        {
            string returnValue = String.Format("Parameter:{0}<br>Time:{1}",
            SomeParameter,
            DateTime.Now.TimeOfDay.ToString());
            return PartialView("CachableAction", returnValue);
        }

See we have added caching to my "Home" controller actions by adding the [OutputCache] attribute methods. The OutputCache has some implied functionality that we need to be aware of. If your controller action has any parameters, like the "SomeParameter" in this example, and if the value varies between calls, it will cache a separate result for each parameter.

Here I am also displaying the current datetime so that when the partial view is generated it will show the time in the main page.

We must always define the Duration parameter when we use the OutputCache attribute. Duration is the amount of time in seconds that the cache took.

Now we have to create the partial view of the "PartialViewResult" Action.

Right click on the "PartialViewResult" then choose "Add View". In the dialog that appears, check the box next to "Create as a partial view". It will create a cshtml file which will be completely blank.


See here the View Name will create "CachableAction" similar to controller action. Now in the "CachableAction" View Page paste the following code:

@model string
<p><b > This is from my CachableAction</b></p>
@Html.Raw(Model)

Step 1:

Now it is time for integrating the newly created "CachableAction" partial view into the "index" view.

<div>
        <p>This is the page.</p>
        @Html.Action("CachableAction", "Home", new { SomeParameter="Yes" })
        @Html.Action("CachableAction", "Home", new { SomeParameter="No" })
    </div>

This preceding code integrates the partial view into the index view.



See here in the @html.action method we are passing the "action method, controller name, and the parameter.

Now run the application. It will look like the following figure.



Now see in the above result we are getting the text "this is from my Cacheable action" which I wrote into the partial view. And for rendering caching the view into the "index" page, see in the following we are getting the current time. All this I marked as red. The fact that the time is showing means that our partial page caching method is working.

Conclusion: So in this article we have learned how to do output caching of the partial page.