Datatable rendering slow
Datatable rendering slow
Hello, DataTables community!
I have a problem with rendering a DataTable for 2500 rows. It takes about 5 seconds to render it all. Also, when I am searching something with a Search... box it is kind of unresponsive. It takes about a second to really to see letter/number that I pressed on my keyborard.
What I am doing is fill table with data with a for loop in html. It looks something like this:
<table id="something" class="display">
<thead>
<tr>
<th scope="col">Datum</th>
//here goes more columns
</tr>
</thead>
<tbody>
{% for values in data%}
<tr>
{% for value in values %}
<td>{{value}}</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
After that, i initialize DataTable in javascript with paging disabled and searchPanes. I also use rowGroup.endRender() to create subtotals in my table. I looked at server side processing discussions but before I begin implementing that I would like to know if I have missed something.
Also, if someone knows a good way to implement server side processing in datatables when I get data from DataFrame in Python (Django view).
Thanks in advance, I hope I explained it as I should.
P.S. I would just like to say great job and keep going! I love DataTables!
Replies
This section of the FAQ should help, it discusses various techniques to improve performance,
If that doesn't help, we're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Cheers,
Colin
Thank you, @colin.
I would really like to give you a test case, but it is really sensitive information and it would take me a whole lot of time to simulate something similar here.
What I did was enabled paging and disabled scrolling. Now it is working pretty fast and it looks like it solved all of my problems but now I have a new problem - my subtotals are calculated for only current page.
Let's say that I have 50 rows for one date(5/7/2020) and my datatable pagelength is set on 25. It shows subtotal for 25 rows on page 1 and for 25 rows on page 2. What I would like to is to get the subtotal only once. Is there any way to do that?
Code for subtotal:
rowGroup: {
startRender: null,
endRender: function (rows, group) {
totals[group] = [];
var counter = 0;
var brojac = 0;
var zbroj = 0;
var soll = {};
var nettoSum = rows
.data()
.pluck(7)
.reduce(function (a, b) {
return a + b * 1;
}, 0);
Thanks in advance!
This thread should help with that - it's showing how to total over the current page and the entire group,
Colin
Thank you for quick response, @colin! This solved my problem!
@colin, I can't seem to mark your post as answer here.
I think that's because it was started as a discussion, rather than a question. But is fine, glad to have helped!
Colin