angular-datatables the deferRender not working

Question

I am using angular datatables with fnPromise and my data is about 10,000 rows also i use scrollY and i want to render only the visible rows for performence My code:

vm.dtOptions = DTOptionsBuilder.fromFnPromise(function() {
            var defer = $q.defer();
            var dataPageParams = {
                columnFilters: [],
                endIdx: -1,
                startIdx: -1,
                filterParams: parentVM.filterParams,
                sortDescending: false,
                instanceID: parseData.instanceId
            };

            if (parentVM.filterId !== '') {
                dataPageParams.filterID = parentVM.filterId;
            }

            DataService.GetDataPage(dataPageParams, dataPageParams.instanceID).then(function (pageDataResult) {
                var data = pageDataResult.data.Data;
                defer.resolve(data);
            });

            return defer.promise;
        }).withLanguage(tableText)
            .withScroller()
            .withOption('scrollY', 410)
            .withOption('scrollCollapse', true)
            .withOption('deferRender', true)
            .withPaginationType('full_numbers')
            .withOption('rowCallback', rowCallback)
            .withOption('lengthMenu', [[-1, 10, 50, 100, 500], [$translate.instant("ALL"), 10, 50, 100, 500]])
            .withOption('createdRow', createdRow);

As long you are rendering the "dataTables way" i.e datatable="" then only visible rows will be rendered. — davidkonrad
– davidkonrad, Commented Sep 21, 2016 at 10:53
Yes, figured that out :) And that is your problem. None of dataTables optimisation features works when the whole drawing/rendering job is beeing "outsourced" to angular. — davidkonrad
– davidkonrad, Commented Sep 21, 2016 at 11:23
Nothing. Angular is an extreme bottleneck regarding performance, and you cannot optimise ng-repeat in conjunction with dataTables. You must render with dataTables if you want to boost performance. — davidkonrad
– davidkonrad, Commented Sep 21, 2016 at 11:36

Manuel Gs · Accepted Answer · 2016-10-05 17:54:20Z

0

As i am seeing, you are using the scroller plugin, this plugin in particularly, it will render the datatatable in a different way, it will render the rows in blocks larger than the value of the scrollY, when you scroll the content, and you are close to view the end of the first block, it will render a 2nd block, so, if you want to use the deferRender you will need to remove this plugin.

answered Oct 5, 2016 at 17:54

Manuel Gs

234 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

angular-datatables the deferRender not working

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related