修改单元格类时改进DataTable性能(Improve DataTable performance when modifying class of cell)

修改单元格类时改进DataTable性能(Improve DataTable performance when modifying class of cell)

我非常满意使用jQuery DataTables，但是我发现了一种需要提升性能的情况。 我正在根据数据更新单元格的类。 为此，我使用渲染功能并从设置创建api实例以通过api获取单元格。 有没有更好的方法来做到这一点？

{ "data": "statusText", "className": "status", "render": function (data, type, full, meta) { switch (type) { case "display": var api = new $.fn.dataTable.Api(meta.settings); var td = api.cell({ row: meta.row, column: meta.col }).node(); switch (full.status) { case Status.Saved: $(td).addClass("status-saved"); break; case Status.Sent: $(td).addClass("status-sent"); break; default: $(td).addClass("status-saved"); } return full.statusText; case "sort": return full.status; default: return full.statusText; } } }

I'm very satisified using jquery DataTables, but I have found one situation where I need to boost performance. I'm updating the class of a cell depending on the data. To do this I'm using the render function and creating an api instance from the settings to get hold of the cell via the api. Is there a better way for doing this?

{ "data": "statusText", "className": "status", "render": function (data, type, full, meta) { switch (type) { case "display": var api = new $.fn.dataTable.Api(meta.settings); var td = api.cell({ row: meta.row, column: meta.col }).node(); switch (full.status) { case Status.Saved: $(td).addClass("status-saved"); break; case Status.Sent: $(td).addClass("status-sent"); break; default: $(td).addClass("status-saved"); } return full.statusText; case "sort": return full.status; default: return full.statusText; } } }

最满意答案

我可以看到的一种可能性是，如果你以某种方式设法从渲染函数中获取api和td 。 因为这看起来像重型操作。

并像下面的td ，可能会工作。

var td = $(api.cell({ row: meta.row, column: meta.col }).node());

进一步你可以做的是使用vanillaJS而不是addClass

Found out that the rowCallback (documentation here) method is better than the render method. In rowCallback we have access to the DOM row and don’t have to new up api instance and lookup the cell. I still use jQuery and addClass to set the class. Will try plain vanilla instead of jQuery to try to improve performance even more. As suggested by @shyammakwana.me