0

I just included some logging into my application. For testing purpose, I filled the database with some test values (basically the same row over and over again, about 27k rows..).

Now I wanted to print the data on a view, doing this:

<table id="chatLogs">
    <thead>
        <tr>
            <th>ID</th>
            <th>Message ID</th>
            <th>User Agent</th>
            <th>IP:Port</th>
        </tr>
    </thead>
<tbody>
<?php
foreach($chatlogs as $log){ ?>

<tr>
    <td><?=$log['ID'];?></td>
    <td><?=$log['messageID'];?></td>
    <td><?=$log['userAgent'];?></td>
    <td><?=$log['IP'];?></td>
</tr>

<?php }
?>
</tbody>
</table>

$log is a variable I'm getting using the Database-Interface called Medoo.

Additionally, I included jQuery DataTables for better and sortable tables.

<script>
$(document).ready( function () {
    $('#chatLogs').DataTable({
        dom: 'Bfrtip',
        buttons: [
        'copy', 'excel', 'pdf'
    ]
    });
} );
</script>

Now, until everything is done and the page is fully loaded, it takes about 15 seconds (with the 27k test-rows). I just tested the same query directly on the database, and it takes 0.02 seconds, so its definetely about the PHP, not about the SQL.

And it seems like echoing everything in the table takes some time, as well as "loading it into DataTables"...

Now the question is: Is it possible to have it loading faster or instantly, and load the data, when its needed? I mean like only load the data into JSON and not echoing everything first (which is the longest part)? Because in the table, there are only 10 rows first anyway, and everytime I click on the next page, it could render it. Ofcourse though, all data would still need to be available for search.

Any ideas?

nameless
  • 1,483
  • 5
  • 32
  • 78
  • What I've done in the past is load everything into an array of java-script objects. Then page them/ only load additional data on drill-down/ etc depending on your interface. – Nathan Champion Jan 13 '19 at 14:20
  • @NathanChampion You mean like instead of getting the data directly in PHP send AJAX somewere to store it in a JSON-decoded variable? How would I then display the data via DataTables? – nameless Jan 13 '19 at 14:24
  • 1
    Sorry, didn't realize Datatables was a JQuery plugin. If it was a normal table you could page groups and only load the DOM with x amount of items at a time which reduces overhead for the browser. Looks like they offer server-side processing for that plugin which may help https://datatables.net/release-datatables/examples/data_sources/server_side.html – Nathan Champion Jan 13 '19 at 14:39
  • 1
    @NathanChampion Yep, found that in the same moment, seems like this helped a lot and decreased time from 15 seconds to 1.3 seconds :) Thanks for the hint – nameless Jan 13 '19 at 14:45

1 Answers1

1

You could improve the loading time by loading only a set of records at a time using limit $start $stop to improve performance using php and sql or you could use "iDisplayLength", property of DataTable to do so.

Hp_issei
  • 579
  • 6
  • 18