Question

这是场景。我用min建了一个网格。 1到最大132列，行数超过10k。我正在使用knockout进行数据绑定。数据由$.ajax jquery函数提取。在第一次调用时，它在每个滚动上获取100行和100行。如果小于100，则返回所有行。

调用ajax时浏览器不会冻结，但是ajax调用后浏览器会冻结。因此，一旦我们在客户端获得数据，它就会绑定到table。浏览器冻结一两秒，同时将包含数据的行附加到表中。

    function demoData(args){
    var self = this;
    self.dataList = ko.observableArray();
    self.fillData = function () {
    self.tableListPager = new ScrollPagerForAccordian($("#tblGrid"), 40, self.fillDetailData);
    $.ajax({ //api call });
    self.loadDetailData(data);
    }

    self.fillDetailData = function (pageNo) {
    $.ajax({ //api call });
    }

self.loadDetailData = function (res) {
self.dataList.push();
}

    function ScrollPagerForAccordian(el, recHeight, callback) {
    }

即使我尝试将self.loadDetailData(data)放入网络工作者，但浏览器仍会冻结。

更新有没有办法在后台加载下一行100并在没有冻结滚动浏览器的情况下附加它？

更新-2

请在下面找到<tbody>结构：

 <tbody data-bind="foreach: dataList">
    <tr data-bind="foreach: rowValues()">
        <td data-bind="style :{ width :colwidth + 'em' , 'min-width' :colwidth + 'em' , 'max-width' :colwidth + 'em'  }">
            <!-- ko if: displayFlag == true -->
                <!-- ko if: flagData  == false -->
                        rendering div
                <!-- /ko -->
                <!-- ko if: flagData  == true -->
                        rendering another div
                <!-- /ko -->
            <!-- /ko -->
            <!-- ko if: displayFlag == false -->
                        rendering another div
            <!-- /ko -->
                    </td>
                </tr>
            </tbody>

在这种情况下如何防止浏览器冻结？

我正在使用Chrome Version 38.0.2125.111 m并且必须仅为chrome解决此问题，因为该视图将显示在awsomium控件中。

浏览器冻结，同时将数据附加到DOM

0 个答案: