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?
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.
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.
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.
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ć
[email protected]
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:
Below that, add this:
Then, in file wp-content/plugins/wpdatatables/assets/js/wpdatatables/wdt.highcharts.js on line 156 you will find this:
Below that, add this:
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ć
[email protected]
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ć
[email protected]
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ć
[email protected]
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ć
[email protected]
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ć
[email protected]
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