Javascript 在不阻塞主线程的情况下加载数据表

我目前正在建立一个小网页，其中包括一个网站，目前约有10000条条目。我的问题是填充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 */ }
        ]
    });
}

完整源代码：

编辑：此链接为我提供了正确的解决方案：（感谢Valentin Silvestre）

链接说10k数据加载不多，可能是来自API调用或错误代码

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

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

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

---

是的，你可以使用

webworkers

在一个单独的线程上工作，看看这篇漂亮的（旧的）文章，这篇文章也很有用。你最终提供的链接就是我想要的解决方案。还必须调整AJAX和API调用，以便只发送数据片段。