文章/答案/技术大牛

发布

社区首页 >问答首页 >加载datatable并阻塞主线程

问加载datatable并阻塞主线程
EN

Stack Overflow用户

提问于 2018-07-10 14:20:59

回答 1查看 763关注 0票数 0

我目前正在构建一个小的网页，其中包括一个数据表，目前大约有10.000条条目。我的问题是填充datatable会阻塞主线程几秒钟，这会导致网页在相当长一段时间内没有响应。是否有任何方法通过异步填充datatable来修复此行为？

初始化工作如下：

$(document).ready(function () {
    // load all kinds of other charts/data
    // ...        
    loadDataTable();
});  

function loadDataTable(){
    $.ajax({
      type: "GET",
      url: /* url to make an API call to the node backend */,
      dataType: "json",
      success: function(response) {
        initDataTable(response)
      }
    });
}


function initDataTable(data){
    $(/*id of the data table*/). DataTable({
        sScrollX: "100%",
        data: data.data,
        columns: [
            { data: /* data selection */ },
            { data: /* data selection */ },
            { data: /* data selection */ },
            { data: /* data selection */ },
            { data: /* data selection */ }
        ]
    });
}

完整源代码：https://github.com/fbaierl/bundeszirkus-server/blob/master/public/index.html

编辑：这个链接为我提供了正确的解决方案：side/simple.html (谢谢Valentin )

javascript

node.js

datatables

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-07-10 14:29:17

这链接说，10k数据不是什么可加载的，它可能来自于您的API调用或一个糟糕的代码。

文档中的这页面给出了用AJAX填充数据库的其他指示。我想这能解决你的问题。

$(document).ready(function() {
    $('#example').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": "../server_side/scripts/server_processing.php"
    } );
} );

此表通过Ajax加载数据。已加载的最新数据如下所示。当加载任何其他数据时，此数据将自动更新。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/51267678

复制

相似问题

问加载datatable并阻塞主线程
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问加载datatable并阻塞主线程EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问加载datatable并阻塞主线程
EN