CODEWITHSUNDEEP
kendo-uikendo-grid
dpdragnev
dpdragnev

Reputation: 2111

Kendo UI DataSource remove item very slow

I have a kendo ui grid that is populated using a datasource that has less than 40 items in it. Each item has about 10 fields one of which is an array that contains no more than 3 items. The grid has a details template that also contains a grid that is populated by the array field from the main record.

When I call dataSource.remove(item), it takes about 10 seconds before the item is removed.

Here is the datasource:

var ds = new kendo.data.DataSource({
  transport: {
    read: function (options) {
      $.ajax({
        url: 'some service url',
        type: 'GET'
      }).success(function (data) {
        options.success(data);
      })
    },
  },
  sort: { field: 'Ordinal', dir: 'asc' },
  schema: {
    model: {
      id: 'ID',
      fields: {
        Name: { editable: false },
        Ordinal: { editable: false }
      }
    }
  }
})

Here is my grid:

<div id="grd" data-role="grid"
     data-auto-bind="true"
     data-editable="true"
     data-selectable="false"
     data-resizable="true"
     data-sortable="true"
     data-scrollable="true"
     data-detail-template="fTemplate"
     data-columns="[
                   { field: 'Name', title: 'Name' },
                   { template: kendo.template($('#tStatus').html()), title: 'Status', width: '150px' },
                   { template: kendo.template($('#tError').html()), title: 'Continue On Error', width: '150px' },
                   { field: 'Ordinal', title: 'Order', width: '75px' }
                   ]"
     data-bind="source: ds, events: { detailInit: initializeDetails }" style="height: 300px;">
</div>

I am struggling to understand why the slow performance. I have used the remove method before and never had a problem.

Any suggestions are highly appreciated.

Thanks.

Upvotes: 0

Views: 831

Answers (1)

dpdragnev
dpdragnev

Reputation: 2111

After several hours of playing around and testing, I found the reason for the slow performance.

The problem was that my grid has 2 template columns, one is a drop down, the other one a checkbox. If I remove those, everything works well. I guess the performance hit come from the fact that the grid has to render the 2 templates and initiate and bind the widgets for each row.

Is there way to improve performance in this scenario?

Upvotes: 1

Related Questions