Reload/Refresh the page -more than 1000 data

Reload/Refresh the page -more than 1000 data

goktuginal41@gmail.comgoktuginal41@gmail.com Posts: 57Questions: 22Answers: 0

Hello everyone,

I have a problem. I am uploading the data to the datatable I created with JSON, but now I have 1500 rows of data and when I refresh(reload) the page with below code:

window.location.reload();

It takes 12 sec. to load the page and the data. How can I reduce this time? I have seen ajax.reload() **but don't know how to use it or **serverside-processing which is written in php. And, I wrote the code with Django framework. Thanks in advance.

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 21,303Questions: 26Answers: 4,947
    edited April 2023

    I am uploading the data to the datatable I created with JSON,

    Does this mean you are using the ajax option? If not it might help performance to convert to ajax loaded data.

    It takes 12 sec.

    I would start by finding out there the delay is coming from. It depends on how you are populating the table.

    I have seen ajax.reload() **but don't know how to use it

    It will only work if you are using the ajax option.

    or **serverside-processing

    Datatables doesn't provide any Python based server libraries. I haven't used but have seen this Django library which supports server side processing:
    https://pypi.org/project/django-serverside-datatable/

    Otherwise you will need to write your own library that supports the server side processing protocol.

    Can you provide a link to your page so we can get a better understanding of your solution to provide more specific suggestions?
    https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

    Kevin

  • goktuginal41@gmail.comgoktuginal41@gmail.com Posts: 57Questions: 22Answers: 0

    Hello,

    Thank you for the respond. Yes, I am using ajax option:

    var table = $('#example').DataTable({
    
              "ajax": {
                url: "/json",
                type: "GET"
              },
              columns: [
                {"data": null,
                  render: function ( data, type, row ) {
                    return '<a class="btn btn-outline-success text-center" id="edit" title="Edit row" data-bs-toggle="modal" data-bs-target="#editModal"><i class="fa-solid fa-pen-to-square" style="color:green !important;"></i></a>';
                  }
                },
                { data: 'p_id_s'},
    .............
    

    I'm not sure whether I share my page or not because there are many features from importing csv to CRUD operations.

    In my opinion, it is normal that it takes a certain time while importing csv (1000 rows or more), but I have a refresh button and when I press that button, it takes the same time to load the page. I mean, I don't do any update or deletion, I just want to refresh the page. I think, the reason of long time is that it takes all that data with JSON-AJAX and uploads it to the datatable.

  • allanallan Posts: 63,464Questions: 1Answers: 10,466 Site admin

    You could PM me with the page link if you like, rather than making it public.

    Allan

  • kthorngrenkthorngren Posts: 21,303Questions: 26Answers: 4,947

    If you just want to refresh the table data then use ajax.reload() in your event handler for the refresh button.

    You could try deferRender, as described in this FAQ.

    Otherwise if the problem is with the delay of getting the table data then you will need to use server side processing. However, you should find the bottleneck in you page refresh to determine where the problem is to decide how to fix it. Trying deferRender is easy but moving to server side processing might take time but might not fix the problem - depending on what the problem is.

    Kevin

  • goktuginal41@gmail.comgoktuginal41@gmail.com Posts: 57Questions: 22Answers: 0
    edited April 2023

    Hi Allan,

    I'm working on local host. But I found something which shows time consumption. It says waiting for server response: 10.39sec. It is because of json data size, I guess:

    Edit: With deferRender, I reduced it to 8sec. Thank you for that.

  • allanallan Posts: 63,464Questions: 1Answers: 10,466 Site admin

    deferRender won't effect the transfer of the data. Only the amount of time it takes to paint on screen.

    Do you have gzip enabled on your server? If not, that would make a significant difference to the amount of data to send over the wire.

    Allan

  • goktuginal41@gmail.comgoktuginal41@gmail.com Posts: 57Questions: 22Answers: 0

    Hi Allan,

    No, I do not have gzip enabled on my server. Honestly, this is the first time I've heard of what it is. Can you help, how do I enable it? Thank you.

  • allanallan Posts: 63,464Questions: 1Answers: 10,466 Site admin
    Answer ✓

    It will depend on what HTTP server you are using. You'd need to refer to the documentation for nginx, caddy, lightspeed, Apache, IIS, or whatever you are using.

    Most will have it enabled by default, but not all. For this sort of data it is quite important that it is enabled.

    This SO thread shows how you can check if it is enabled on your http server.

    Allan

  • goktuginal41@gmail.comgoktuginal41@gmail.com Posts: 57Questions: 22Answers: 0

    I am using Apache server. Thanks for the thread. I ll be checking it. Hope I can find a way to fix the issue.

Sign In or Register to comment.