Lazy loading client-side

KarlDime

Hi y'all, i'm new here , so any tips and suggestions to help make this question better is appreciated.

I have a datatable that is client sided, i'm only doing this for the convenience of not having to deal with foreign keys shenanigans.
It has 3.500 rows and currently it takes up to 10 seconds to load... not good!
I need to optimize the speed:
- load the data into chunks, or
-
- have 10 items displayed first, before loading the rest of the db.

I didn't link to a live example because i don't think it would add much to the question.
have a good day and thank you for taking time to read this, and possibly helping me in my struggle.
-Karl.

kthorngren

Start with this faq. Sounds like you need to use ajax loading with deferRender.

Kevin

KarlDime

I will take a look at that right now!thanks

KarlDime

added these:
"orderClasses": false,
"deferRender": true,

still no improvements.

kthorngren

still no improvements.

Are you using ajax or Javascript loaded data?

Have you followed the path of your data to determine where the delay actually is at? Is the delay with the server query, sending the data to the client, rendering the table?

Kevin

KarlDime

I'm using ajax:
"serverSide": false,
"sAjaxSource": "/api/livros/?format=datatables",
{"data": "autor"},
{"data": "ano"}, etc...

now, i will debug and get where the delay actually is.

KarlDime

I tried but could't get the timer working, i'm quite new to javascript..Can you give me pointers @kthorgren?

KarlDime

the delay seems to be gettting the actual data

kthorngren

Looks like you had a follow up question in this thread.

Kevin

KarlDime

the console log on the initcomplete showed 15.8 seconds.

colin

This section of the FAQ should help, it discusses various techniques to improve performance,

Cheers,

Colin

kthorngren

the console log on the initcomplete showed 15.8 seconds.

The Ajax request took 15.5 seconds. That means that it takes 15.5 second for the server to fetch the data from the DB and to send the response. And it took Datatables 0.3 seconds to initialize.

You will need to debug the server script for performance or, as the FAQ Colin mentioned, you will need server side processing so the server only fetches a page worth of data at a time.

Kevin

KarlDime

I would like not to use server-side processing because of it's foreign key limitations. I was looking into pagination from the django-rest-framework and It may be possible with that, right?

kthorngren

Server side processing doesn't have foreign key limitations. It doesn't impose any restrictions except that the server script follows the protocol described here:
https://datatables.net/manual/server-side

I was looking into pagination from the django-rest-framework

You will need to implement something client side to perform the paging with django-rest-framework. Which you would need to do anyway without Datatables.

There are third party Django libraries meant to work with Datatables. This one supports server side processing:
https://pypi.org/project/django-serverside-datatable/

I've never used one of the third party libraries so not sure which to choose.

Kevin

KarlDime

thank you for your time, i improved times (from 10s to 1.5s) following this:
https://stackoverflow.com/questions/65054910/how-to-lazy-load-datatable-with-client-sided-processing