1.10 performance vs 1.9 issue?

rfitzwater

Finally got around to updating a DataTables project of mine. The current project is running version 1.9 and styled with Bootstrap 2. Link to the current version: https://comm.rider.edu/registrar/main.php?term=202010

I have a beta of the new version I'm working on. I do have some performance concerns though. The new version running DataTables 1.10.19 w/Bootstrap 4. The current version loads for me in about 3 seconds while the new version loads in about 12 seconds. Link to beta: https://comm.rider.edu/registrar/beta/index.php?term=202010

If anyone has any input on how to speed things up, it would be appreciated.

Thanks in advance!

colin

Hi @rfitzwater ,

I took a look and can see the speed slowdown as you say. It would be worth profiling it to see where the speed issue lies. For example, "X column(s) are hidden" is shown a dozen or so times during the initialisation, which suggests the window is being resized when it isn't (it occurs on line 584 of courseRoster.js inside the event responsive-resize). I'd suggest taking out those kind of things, and see if the table initialises quickly, but these kind of things are then delaying the display afterwards.

This section of the FAQ may also help, it discusses various techniques to improve general performance,

Cheers,

Colin

rfitzwater

Colin,

Thanks for the response. I added that section of code to see how responsive plugin was working on load. I suspected it was the cause of some of the performance issues. Removing the section of code you mentioned did not speed things up, but disabling responsive plugin did. It went from 12 seconds down to about 3 to load.

Any ideas on how to resolve the responsive option from causing such a delay? Why does it need to calculate more than once after loading data?

Thanks!

colin

Hi @rfitzwater ,

That's odd - I'm not aware of Responsive affecting performance.

In initComplete, you're reordering the columns with colReorder.order() - this would cause another draw. It would be interesting to see how that affects performance if you commented that out.

Cheers,

Colin

rfitzwater

Colin,

Commenting out the colReorder code did significantly lower the time. With that line commented out it loads in about 6 seconds. Disabled responsive on top of commenting that line out lowers load time to ~2 seconds. While the colReorder code does seem to slow things down, it seems the responsive option enabled is the bottleneck. Suggestions?

Thanks!

allan

By far the biggest increase in speed you'll get is from enabling paging. As an experiment, try it to see if it does make a difference (it should since there are way less calculations to do with it enabled).

If that does work for you but you still want the full screen styling, consider using the software from this blog post.

Nice styling btw.

Allan