Hey everyone!
With the Labour Day holidays coming up, we’d like to let you know about our upcoming working hours:
Thursday, May 1st: Our team will be off during Labour Day.
Friday, May 2nd: We'll also be off for an extended holiday break.
We’ll be back on Monday, May 5th, ready to respond to all messages received during this time.
In the meantime, if you need help, feel free to:
-
Use the support widget on the bottom right of our websites (Amelia and wpDataTables) — our AI-powered assistant is available 24/7 and can help with many common questions.
-
Visit our documentation, articles, or YouTube channels for quick answers and step-by-step guides.
https://www.youtube.com/@AmeliaWordPressBookingPlugin/videos
https://www.youtube.com/@wpDataTables/videos
Thank you for being so understanding, and we hope you enjoy the long weekend!
Hey there,
I am using 4 wpdatacharts on a very important page on my site. The charts are rendered using tables created using sql queries.
The sql queries take a while to process and the overall page load time is around 14 seconds. This is obviously not acceptable to the user.
That's why I was wondering if there is way to defer loading of wpdata charts (just like lazy loading) AFTER the base page has been loaded. This would require to delay fetching data using sql queries until after the base page load.
This was users could still see the page and in the meantime the system process the query on the side and perhaps shows "loading chart" until the chart loads.
FYI - I am using highcharts for rendering charts
My questions are:
1) Is there a native way to do this in wpdatatables?
2) If not, is this technically possible?
3) If it is possible, what needs to be done to make the charts load after the page load?
Regards,
Himanshu
Hello Himanshu
Sorry for the late response.
I'm not sure if this can be done, so I forwarded your question to one of our developers. As soon as I hear from him, I will let you know.
Sorry for the delay once again.
Kind Regards,
Aleksandar Vuković
aleksandar.vukovic@tmsproducts.io
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Hello again Himanshu
Unfortunately, with the built-in functions this can't be done. This has been requested a few times already, so let's try this:
Go to file wp-content/plugins/wpdatatables/templates/wpdatachart.inc.php and on line 6 you will find this:
<div id="wpDataChart_<?php echo $chart_id?>" class="<?php echo $this->_type?>" style="width: 100%"></div>
Below that, add this:
<div id="wpDataChart_<?php echo $chart_id?>_preloader" class="<?php echo $this->_type?>" style="width: auto; height: <?php echo $this->_height ?>px; margin: 0 auto; background: url(<?php echo WDT_ROOT_URL .'assets/img/spinner.gif' ?>) no-repeat center center"></div>
Then, in file wp-content/plugins/wpdatatables/assets/js/wpdatatables/wdt.highcharts.js on line 156 you will find this:
render: function(){
Below that, add this:
this.options.chart.events = { load: function () { document.getElementById(obj.getContainer().replace('#','') + '_preloader').style.display = 'none'; } }
You'll have a default loader before the chart is loaded. This is only for HighCharts, though, so if you need this for some other engine, please note that this is a custom solution, and is not included in the provided support for the plugin.
When you test this, please let us know if it works fine, and we'll see that it's added in our next release.
Kind Regards,
Aleksandar Vuković
aleksandar.vukovic@tmsproducts.io
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
I'm not sure what's going on Himanshu.
Regardless of the changes you've made you smile be able to save the file.
You can extract wpdatatables.zip finder; edit the files locally; zip it again and reinstall the plugin. That will cause it to load the modified files.
Just make sure to leave "Prevent deleting database tables" check box selected in wpDataTables settings, so you don't lose your tables and charts.
Kind Regards,
Aleksandar Vuković
aleksandar.vukovic@tmsproducts.io
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Alexander,
I am working on thing we just discussed but I think the issue is in calling SQL queries. The processing of the sql takes most of the time (8+ secs), not the javascript part (less than 2 sec).
So I was wondering if there is way to delay calling the server until the page load for a specific chart. It might require to send another request to the DB after a 'simple' version of the page load.
The attached image explains the main bottleneck.
Thanks, Himanshu
I forwarded the question to our developer again, and as soon as I hear from him I will let you know.
Sorry for the delay.
Kind Regards,
Aleksandar Vuković
aleksandar.vukovic@tmsproducts.io
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Hi again Himanshu
Our developer thinks that it could be the server. Can you try optimizing your queries? If they're complicated, you could please prepare a MySQL view, which will return the data that you need, call it e.g. “view1” and then build a wpDataTable based on a simple query like “SELECT * FROM view1″.
Also, you can try some other hosting with better performances. Our developer said that this is not caused by wpDataTables.
Kind Regards,
Aleksandar Vuković
aleksandar.vukovic@tmsproducts.io
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Thanks Aleksander
You're welcome Himanshu.
If you have any further questions or issues, please feel free to open a new ticket, and we'll gladly help.
Kind Regards,
Aleksandar Vuković
aleksandar.vukovic@tmsproducts.io
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables