ASP.NET MVC - Kendo Grid slow paging

Question

I'm using Kendo Grid to display my data, but when I load 500K records the paging is very slow. When changing a page, the Read function is called resulting a call to the database in which all the 500K records are retrieved each time.

VIEW

@Html.Kendo().Grid<MyViewModel>()
        .Name("grid")           
        .Columns(c=>
        {           
            c.Bound(model => model.UserId);
            c.Bound(model => model.UserName);
            c.Bound(model => model.Email);
        })
        .Filterable()
        .Sortable()           
        .DataSource(dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("ReadData", "Home").Data("filters"))
            .PageSize(30)            
        )

Controller

public ActionResult ReadData([DataSourceRequest] DataSourceRequest request, string searchText)
{
    var data = GetData(searchText).ToList();

    return Json(data.OrderBy(x=>x.UserId).ToList().ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

What could I be doing wrong?

score 1 · Answer 1 · answered Mar 01 '19 at 06:13

I would advise to first try doing the order by on the data side instead of code and see if that helps. But I don´t think that will solve the problem if you are retrieving 500k records and moving them through each time the user changes a page. That´s how client side paging works in kendo.

The second option would be to make the paging server side. You can look at this post to see how to implement that:

How to implement Server side paging in Client side Kendo UI grid in asp.net mvc

Source about kendo grid performance and paging: https://www.telerik.com/blogs/how-to-get-the-best-grid-performance

Hope it helps!

score 1 · Answer 2 · answered May 20 '19 at 17:04

Came across this researching a different problem, but your issue is clear: you are doing .ToList() which causes a fetch of all records before .ToDataSourceResult kicks in with the paging and sorting (it expects an IQueryable).

So your GetData needs to return an IQueryable and refactor action to:

public ActionResult ReadData([DataSourceRequest] DataSourceRequest request, string searchText)
{
    var data = GetData(searchText);

    // Add a default sort if none is selected, otherwise use the user selected sort
    if (request.Sorts.Count == 0)
    {
        request.Sorts.Add(new SortDescriptor("UserId", ListSortDirection.Ascending));
    }

    // Will add `Take`, `Skip`, `OrderBy`, etc. before sending to server
    return Json(data.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

It's amazing how much faster this made the read request once I removed ToList() — NiallMitch14, Oct 14 '20 at 11:01
Yeah, being able to see the database calls is key. When debugging, I will often enter a temporary "ToList" then remove it. — Steve Greene, Oct 14 '20 at 13:23

score 0 · Answer 3 · answered Mar 01 '19 at 16:00

0

Why can't you use Endless Scrolling, that will take bunch of records(you can take as you need) every time you scroll down ?

Reference Link: https://demos.telerik.com/aspnet-mvc/grid/endless-scrolling-remote

answered Mar 01 '19 at 16:00

siri

114
1

Every time you scroll down it will call the Read action and get the records, by not having all the bunch of records at a time 500k . Will increase your performance – siri Mar 01 '19 at 16:01

ASP.NET MVC - Kendo Grid slow paging

3 Answers3