Performance Issue

[Rohit]

Hi All,

I have simple ASP.NET MVC web application to fetch data from SQL DB from controller and render it to a web application using Kendo grid.
Performance before we started to use Kendo controls was fine and renders the page quickly. The issue of slow performance started only after we decided to use Kendo grid for sorting and filtering. Even the page without any kendo controls takes more time to load.

Following is the code in our CSHTML page. Any quick help will be greatly appreciated.

    @using (Html.BeginForm("ReplaySelectedInboundMessages", "Home"))
   {
    <div id="gridContent1">
        <h1>All Messages</h1>  
    @(Html.Kendo().Grid<VPath.MessageReplay.MvcApp.Models.LogModel>(Model)
    .Name("grid")  
    .HtmlAttributes(new { style = "height:430px;" })  
    .Columns(columns => 
        {
            columns.Template(@<text><input class="box"  id="assignChkBx"name="assignChkBx" type="checkbox" value="@item.LogID"/></text>).HeaderTemplate(@<text><input type='checkbox' id='allBox' onclick='toggleSelection()'</text>).Width(20);
            columns.Bound(p => p.LogID).Template(p=> Html.ActionLink(((string)p.LogID), "MessageDetails", new { logid = p.LogID})).Width(200);
            columns.Bound(p => p.ReceivePortName).Width(100);
            columns.Bound(p => p.SendPortName).Width(100);
            columns.Bound(p => p.loggedDate).Width(100);
            columns.Bound(p => p.ControlID).Width(100);
            columns.Bound(p => p.SenderID).Width(100);
            columns.Bound(p => p.ReceiverID).Width(100);
            columns.Bound(p => p.InterchangeID).Width(100);
            columns.Bound(p => p.ReplayedCount).Width(100);
            columns.Bound(p => p.RetryCount).Width(100);
            columns.Bound(p => p.AckCode).Width(20);
        })        
        .Filterable()   
        .Pageable()
        .Sortable()
        .Scrollable(src => src.Height(430))        
        .Resizable(resize => resize.Columns(true))
        
        )
         <br />
        <br />
        <input type="Submit" name="btnReplayMessage" value="Replay" title="Replay Message" \>
</div>  
    }

[Georgi Krustev]

Hello Rohit,

Could you share more details about your current implementation? What is the amount of the data that you would like to render? Have you been used a regular Html table before Kendo UI Grid? A runnable test project will be of a great help to observe the issue locally and follow you up with more details.

Regards,
Georgi Krustev
Telerik

 

 

[Rohit]

Solved the problem.

The issue was due to the internet reference of stylesheets and javascript was done in common .cshtml file.

<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1314.440/styles/kendo.common.min.css" />
        <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1314.440/styles/kendo.default.min.css" />
       <script src="http://cdn.kendostatic.com/2014.3.1314.440/js/kendo.all.min.js"></script>
        <script src="http://cdn.kendostatic.com/2014.3.1314.440/js/kendo.aspnetmvc.min.js"></script>

I replaced the above code to following code below. This solved the performance issue.

 <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/kendo.common.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/kendo.default.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/kendo.dataviz.default.min.css")" rel="stylesheet" type="text/css" />

    <script src="@Url.Content("~/Scripts/kendo/jquery.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo/kendo.all.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo/kendo.aspnetmvc.min.js")"></script>