为什么DataTables渲染功能被称为3次？

我正在使用DataTables 1.10.9和客户端处理。为什么DataTables渲染功能被称为3次？

我正在使用'ajax'选项来检索DataTable的数据。

我在'render'函数中放了一个小的console.log（renderCount）。

表中有4,921行。

但是，控制台显示渲染函数总共被调用了14,772次！

（14772 =行×3 + 11的数），我相信这将被减慢渲染过程。

更重要的是 - 我有“deferRender”选项 - 所以我本来以为渲染函数应该只能被称为10倍，这是默认的页面大小。

怎么回事？

除了服务器端处理 - 我该如何改善此表的初始渲染性能？

这里是一个行的数据的一个例子：

{ 
    Id: 1, 
    Type: "Purchases", 
    LifecycleStatus: "Manual", 
    ReceivedAtLocal: "04/02/2016 20:45:16", 
    ModifiedAtLocal: "04/02/2016 21:45:16", 
    Operator: "a-mjohn", 
    PartNumber: "IXAWGCAUNVJHONP" 
}

下面是表的定义代码：由render选项定义

var renderCount = 0; 
    transactionTable = $("#tblTransactions").DataTable({ 
     "searchDelay" : 500, 
     "bDestroy": true, 
     "ajax": window.getTransactionDataUrl, 
     "processing": false, 
     "deferRender" : true, 
     "columns": [ 
      { 
       'render': function (data, type, full, meta){       
        // Other code omitted for brevity 
        renderCount++; 
        console.log(renderCount); 
        return ""; 
       }, 
       "bSortable": false 
      }, 
      { 
      'render': function (data, type, full, meta) { 
       return '<input type="checkbox">'; 
      }, 
      "bSortable": false 
     }, 
     { "data": "Id" }, 
     { "data": "Type" }, 
     { "data": "LifecycleStatus" }, 
     { "data": "Operator" }, 
     { "data": "PartNumber" }, 
     { "data": "ReceivedAtLocal" }, 
     { "data": "ModifiedAtLocal" }, 
     { "defaultContent": "<button class='btn btn-primary btn-xs' data-toggle='modal' data-target='#detailsModal'>Details</button>", "bSortable": false }, 
     { "defaultContent": "<button class='btn btn-primary btn-xs' data-toggle='modal' data-target='#auditModal'>Audit</button>", "bSortable": false }, 
     { "defaultContent": "<button class='btn btn-primary btn-xs' data-toggle='modal' data-target='#commentModal'>Comments</button>", "bSortable": false } 
    ], 
    "rowId": "Id", 
    'order': [[7, "asc"]], 
    'rowCallback': function (row, data, dataIndex) { 
     // Get row ID 
     var rowId = data["Id"]; 

     if ($.inArray(rowId, window.transIndexPage.rows_selected) !== -1) { 
      $(row).find('input[type="checkbox"]').prop("checked", true); 
      $(row).addClass("selected"); 
     } 
    } 
});

来源

2016-02-04 JTech

功能确实被多次调用，由于采用返回jQuery的数据表价值为多重目的。

从manual：

注意，此函数可能被多次调用，如数据表会调用它，它需要不同的数据类型 - 排序，筛选和显示。

您可以根据提供的type参数为不同的操作返回不同的值。如果您希望显示一个值并将另一个值用于排序，则可能需要这样做。例如，这对包含日期的字段很有帮助。

您可以通过在客户端处理模式下使用deferRender或切换到server-side processing mode来提高性能。请注意，在server-side processing mode中，您需要在服务器上自行执行排序，分页和过滤。

来源

2016-02-05 00:46:36

感谢您的解释重新：**渲染**功能。手册中引用的“数据类型”究竟是什么意思？我想这不是'int'vs'string'，而是更像'数据使用率'=>，如'使用列值的这种表示来排序'和'使用这个其他值来显示'？ – JTech

在我的问题 - 我说我已经使用'deferRender'选项。任何其他建议（除了服务器端处理）都可以提高性能？ – JTech

@JTech，jQuery DataTables请求将用于排序，搜索和显示的不同值。你可以选择使用三个不同的值，这就解释了为什么'render'被多次调用。 –

为什么DataTables渲染功能被称为3次？

回答

相关问题