Improve graphed data

This should make the graph more useful by adding per-page queries / time metrics. One caveat is that although the table structure hasn't changed, the data stored has. Data from older versions will show incorrect results.
MariaDB · Jun 8, 2023 · 98eb318 · 98eb318
1 parent 508dba2
commit 98eb318
Show file tree

Hide file tree

Showing 6 changed files with 49 additions and 14 deletions.
diff --git a/inc/App/ExecutionTime.php b/inc/App/ExecutionTime.php
@@ -13,12 +13,10 @@ public static function save_average_query_execution_time() {
 
 		if( !empty( $wpdb->total_query_time ) && !empty( $wpdb->num_queries ) && $wpdb->num_queries > 0 ) {
 
-			$average = $wpdb->total_query_time / $wpdb->num_queries;
-
 			$wpdb->insert(
 				$wpdb->prefix . self::TABLE_NAME,
 				[
-					'seconds'     => $average,
+					'seconds'     => $wpdb->total_query_time,
 					'queries_num' => $wpdb->num_queries
 				]
 			);
@@ -28,7 +26,7 @@ public static function save_average_query_execution_time() {
 
 	public function get() {
 		global $wpdb;
-		$query     = "select timestampdiff(HOUR, ts, now()) as 'hours-ago', avg(seconds) as 'avg-seconds', sum(queries_num) as 'queries-num' from " . $wpdb->prefix . "mariadb_execution_time where date(ts) >= now() - interval 7 day group by timestampdiff(HOUR, ts, now()) order by ts;";
+		$query     = "select timestampdiff(HOUR, ts, now()) as 'hours-ago', sum(seconds) / sum(queries_num) as 'avg-seconds', sum(queries_num) as 'queries-num', avg(seconds) as 'avg-seconds-per-page', avg(queries_num) as 'avg-queries-per-page' from " . $wpdb->prefix . "mariadb_execution_time where date(ts) >= now() - interval 7 day group by timestampdiff(HOUR, ts, now()) order by ts;";
 		$resultsDb = $wpdb->get_results($query, ARRAY_A);
 		$results   = [];
 		foreach ($resultsDb as $k => $r) {
@@ -37,6 +35,8 @@ public function get() {
 			$results[$k]['date'] = $date;
 			$results[$k]['microseconds'] = $r['avg-seconds'] * 1000000;
 			$results[$k]['queries-num']  = $r['queries-num'];
+			$results[$k]['queries-per-page']  = $r['avg-queries-per-page'];
+			$results[$k]['time-per-page']  = $r['avg-seconds-per-page'] * 1000;
 		}
 
 		return $results;
@@ -45,7 +45,7 @@ public function get() {
 	public function get_raw()
 	{
 		global $wpdb;
-		$query     = "select timestampdiff(HOUR, ts, now()) as 'hours-ago', avg(seconds) as 'avg-seconds', sum(queries_num) as 'queries-num' from " . $wpdb->prefix . "mariadb_execution_time where date(ts) >= now() - interval 7 day group by timestampdiff(HOUR, ts, now()) order by ts;";
+		$query     = "select timestampdiff(HOUR, ts, now()) as 'hours-ago', sum(seconds) / sum(queries_num) as 'avg-seconds', sum(queries_num) as 'queries-num', avg(seconds) as 'avg-seconds-per-page', avg(queries_num) as 'avg-queries-per-page' from " . $wpdb->prefix . "mariadb_execution_time where date(ts) >= now() - interval 7 day group by timestampdiff(HOUR, ts, now()) order by ts;";
 		return $wpdb->get_results( $query, ARRAY_A );
 	}
 

diff --git a/inc/App/GeneralData.php b/inc/App/GeneralData.php
@@ -1,7 +1,7 @@
 <?php
 /**
  * @package MariaDB_Health_Checks
- * @version 1.0.3
+ * @version 1.1.0
  */
 
 namespace MDBHC;

diff --git a/js/scripts.js b/js/scripts.js
@@ -9,28 +9,53 @@ jQuery(document).ready(function ($) {
 				const labels = [];
 				const execTime = [];
 				const averageQueries = [];
+				const queriesPerPage = [];
+				const timePerPage = [];
+				var greenColor = "#00FF00";
+				var orangeColor = "#FFA500";
+
 
 				response.data.forEach((res, i) => {
 					labels.push(res.date * 1000);
 					var time_vals = {x: res.date * 1000, y: Math.round(res.microseconds)};
 					var query_vals = {x: res.date * 1000, y: res["queries-num"]};
+					var query_per_page_vals = {x: res.date * 1000, y: Math.round(res["queries-per-page"])};
+					var time_per_page_vals = {x: res.date * 1000, y: Math.round(res['time-per-page'])};
 					execTime.push(time_vals);
 					averageQueries.push(query_vals);
+					queriesPerPage.push(query_per_page_vals);
+					timePerPage.push(time_per_page_vals);
 				});
 
 				var datasets = [
 					{
-						label: "Average execution time in μS",
+						label: "Average DB time per page in ms",
+						data: timePerPage,
+						borderWidth: 1,
+						yAxisID: "y",
+					},
+					{
+						label: "Average queries per page",
+						data: queriesPerPage,
+						borderWidth: 1,
+						yAxisID: "y1",
+					},
+					{
+						label: "Average DB time per query in μs",
 						data: execTime,
 						borderWidth: 1,
 						yAxisID: "y",
+						hidden: true
 					},
 					{
-						label: "Queries",
+						label: "Total hourly queries",
 						data: averageQueries,
 						borderWidth: 1,
 						yAxisID: "y1",
-					}
+						hidden: true
+					},
+
+
 				];
 
 				var redColor  = "#FF7390";
@@ -45,6 +70,10 @@ jQuery(document).ready(function ($) {
 					datasets[0].borderColor = blueColor;
 					datasets[1].borderWidth = 3;
 					datasets[1].borderColor = redColor;
+					datasets[2].borderWidth = 3;
+					datasets[2].borderColor = greenColor;
+					datasets[3].borderWidth = 3;
+					datasets[3].borderColor = orangeColor;
 				}
 
 				new Chart(ctx, {
@@ -59,7 +88,7 @@ jQuery(document).ready(function ($) {
 								beginAtZero: true,
 								title: {
 									display: true,
-									text: "Execution time",
+									text: "DB time",
 									color: blueColor,
 									font: {
 										size: 20,
@@ -75,7 +104,7 @@ jQuery(document).ready(function ($) {
 								beginAtZero: true,
 								title: {
 									display: true,
-									text: "Queries",
+									text: "Query count",
 									color: redColor,
 									font: {
 										size: 20,

diff --git a/mariadb-health-checks.php b/mariadb-health-checks.php
@@ -3,7 +3,7 @@
  * Plugin Name: MariaDB Health Checks
  * Plugin URI: http://github.com/MariaDB/wordpress-mariadb-health-checks
  * Description: MariaDB Health Checks
- * Version: 1.0.3
+ * Version: 1.1.0
  * Plugin Prefixes: mdbhc, Mdbhc, MDBHC
  * Text Domain: mariadb-health-checks
  * Author: Cloudfest Hackathon 2023 Team

diff --git a/readme.txt b/readme.txt
@@ -39,6 +39,12 @@ Extract the contents of the ZIP and upload the contents to the `/wp-content/plug
 
 == Changelog ==
 
+= 1.1.0 =
+
+* Make graph data easier to understand
+* Add more useful metrics to the graph
+* Fix version check for MariaDB < 10.2
+
 = 1.0.3 =
 
 * Fix DB error that can happen on install

diff --git a/templates/admin/main-data.php b/templates/admin/main-data.php
@@ -25,11 +25,11 @@
 <?php
 	$executionTime = new MDBHC\ExecutionTime();
 	$executionTimeAjax = new MDBHC\AdminScreen();
-  echo '<table class="wp-list-table widefat striped table-view-list"><thead><tr><th>'. __('Date / Time', 'mariadb-health-checks') . "</th><th>". __('Average Exection Time (μs)', 'mariadb-health-checks'). '</th><th>' . __('Total Queries', 'mariadb-health-checks'). '</th></tr></thead>';
+  echo '<table class="wp-list-table widefat striped table-view-list"><thead><tr><th>'. __('Date / Time', 'mariadb-health-checks') . '</th><th>' . __('Queries Per Page', 'mariadb-health-checks') . '</th><th>' . __('Average DB Time Per Page (ms)', 'mariadb-health-checks') . "</th><th>". __('Average DB Time Per Query (μs)', 'mariadb-health-checks'). '</th><th>' . __('Total Queries', 'mariadb-health-checks') . '</th></tr></thead>';
 	echo '<tbody id="the-list">';
   $execTime = $executionTime->get_raw();
   foreach ($execTime as $value) {
-		echo '<tr class="inactive"><td>' . date("Y-m-d H:00", strtotime('-' . $value['hours-ago'] . ' hour')) . '</td><td>' . round($value['avg-seconds'] * 1000000) . '</td><td>' . round($value['queries-num']) . '</td></tr>';
+		echo '<tr class="inactive"><td>' . date("Y-m-d H:00", strtotime('-' . $value['hours-ago'] . ' hour')) . '</td><td>' . round($value['avg-queries-per-page']) . '</td><td>' . round($value['avg-seconds-per-page'] * 1000) . '</td><td>' . round($value['avg-seconds'] * 1000000) . '</td><td>' . round($value['queries-num']) . '</td></tr>';
   }
 	echo '</tbody></table>';
 ?>