Question

Hi Everyone I am working on my first MVC 3 website built in C# in asp.net I am having some trouble with with the speed of the website as it takes over 45 seconds to expand or contract the tables that show the database.

I have included my code for the reportTemplate which has my jquery on it

I have been trying to figure out how to use cache but I am worried that the data will not be up to date when the managers need up to date data

@{
ViewBag.Title = "ReportTemplate";
}

<script language="javascript" type="text/javascript">
$(document).ready(function () {

    toggle = function (className) {
        $('.' + className).toggle('fast');
    }


});

</script>

<h2>ReportTemplate</h2>

<p>
@Html.ActionLink("Create New", "Create")    
</p>
<table>
<tr>
    <th>
        INVESTMENT AREA
    </th>
    <th>
        MAJOR PROGRAM
    </th>
    <th>
        MANAGER
    </th>
    <th>
        PROJECT
    </th> 
    <th>
        SPA
    </th>
    <th>
        PA
    </th>                                 
</tr>

@{
string investment_area = "";
string major_program = "";
string manager = "";
string project = "";
string spa = ""; 
string pa = "";
string iaClass = "";
string mpClass = "";
string manClass = "";
string pjClass = "";
string spaClass = "";
string paClass = "";
}
    @foreach (var item in Model)
{
iaClass = item.investment_area.Substring(0, 2);
mpClass = item.major_program;
manClass = item.manager;
pjClass = item.project;
spaClass = item.spa;
paClass = item.pa;

    if (investment_area != item.investment_area)
{

<tr>        
  <td class = "ndeTable ui-widget-header pointer border" onclick="toggle('@iaClass')" colspan="6">
        @item.investment_area
    </td>
</tr>

}
investment_area = item.investment_area;

if (major_program != item.major_program)
{

<tr class="@iaClass">
<td style = "width :200px"></td>
    <td class = "ndeTable pointer border" onclick="toggle('@mpClass')" colspan="5">

    @item.major_program

    </td>
</tr>    
}
major_program = item.major_program;

if (manager != item.manager)
{                
<tr class = "@iaClass @mpClass">
<td></td>
<td style = "width : 100px"></td>
    <td class = "ndeTable pointer border" onclick="toggle('@manClass')" colspan="4">    
    @item.manager
    </td>                
</tr>
}
manager = item.manager;

if (project != item.project)
{
<tr class = "@iaClass @mpClass @manClass">

<td></td>
<td></td>
<td style = "width : 200px"></td>

   <td class = "ndeTable pointer border" onclick = "toggle('@pjClass')" colspan="3">
   @item.project
   </td>
</tr>
}
project = item.project;

if (spa != item.spa)
{
<tr class = "@iaClass @mpClass @manClass @pjClass">

<td></td>
<td></td>
<td></td>
<td style = "width : 325px"></td>

    <td class = "ndeTable pointer border" onclick = "toggle('@spaClass')" colspan = "2">
    @item.spa
    </td>
</tr>
}
spa = item.spa;


<tr class = "@iaClass @mpClass @manClass @pjClass @spaClass">
<td></td>
<td></td>
<td></td>
<td></td>
<td style = "width: 200px"></td>
    <td class = "ndeTable pointer border" onclick = "toggle('@paClass')" colspan = "1">
    @item.pa
    </td>           
</tr>

pa = item.pa;
}
</table>

I am going to continue trying to optimize the code in the meantime but if anyone has any tips or tricks I can use I would be very thankful as this has been troubling me for the past couple days and 45 secs for a small database is ridiculous. Thank you for your time.
Cheers,
James

Answer 1

Fire up sql profiler/sql trace and check out how many queries you are doing during single http request that creates the page. Queries are often the one to blame for performance issues. It’s nearly impossible that solely rendering the view takes so much time.