improvements to frontend

This commit is contained in:
Pedro 2015-01-26 15:40:39 +01:00
parent b262cf9fe6
commit 7ceaf2e9c1
4 changed files with 42 additions and 13 deletions

View File

@ -39,18 +39,21 @@ HyriseConnector.prototype._formatPerformanceData = function(object) {
var totalTime = 0; var totalTime = 0;
var queryTaskTime = 0; var queryTaskTime = 0;
var parseTime = 0;
$.each(performanceData, function(i, data) { $.each(performanceData, function(i, data) {
data.time_ms = data.endTime - data.startTime; data.time_ms = data.endTime - data.startTime;
totalTime += data.time_ms; totalTime += data.time_ms;
if (data.name === 'SQLQueryTask') queryTaskTime += data.time_ms; if (data.name === 'SQLQueryTask') queryTaskTime += data.time_ms;
if (data.name === 'RequestParseTask') parseTime += data.time_ms;
}); });
object.performanceData = { object.performanceData = {
totalTime: totalTime, totalTime: totalTime,
queryTaskTime: queryTaskTime, queryTaskTime: queryTaskTime,
operators: performanceData parseTime: parseTime,
operators: performanceData,
} }
}; };
@ -62,6 +65,7 @@ HyriseConnector.prototype.benchmarkSQL = function(query, numRuns, callback) {
var result = { var result = {
totalTime: 0, totalTime: 0,
queryTaskTime: 0, queryTaskTime: 0,
parseTime: 0,
numRuns: allData.length, numRuns: allData.length,
operators: [] operators: []
}; };
@ -72,6 +76,7 @@ HyriseConnector.prototype.benchmarkSQL = function(query, numRuns, callback) {
var perfData = run.performanceData; var perfData = run.performanceData;
result.totalTime += perfData.totalTime; result.totalTime += perfData.totalTime;
result.queryTaskTime += perfData.queryTaskTime; result.queryTaskTime += perfData.queryTaskTime;
result.parseTime += perfData.parseTime;
$.each(perfData.operators, function(i, data) { $.each(perfData.operators, function(i, data) {
if (!(data.id in operatorMap)) { if (!(data.id in operatorMap)) {
@ -89,6 +94,7 @@ HyriseConnector.prototype.benchmarkSQL = function(query, numRuns, callback) {
// Calc average and Transform into array // Calc average and Transform into array
result.totalTime /= result.numRuns; result.totalTime /= result.numRuns;
result.queryTaskTime /= result.numRuns; result.queryTaskTime /= result.numRuns;
result.parseTime /= result.numRuns;
$.each(operatorMap, function(id, data) { $.each(operatorMap, function(id, data) {
data.duration /= result.numRuns; data.duration /= result.numRuns;
@ -103,17 +109,21 @@ HyriseConnector.prototype.benchmarkSQL = function(query, numRuns, callback) {
} }
var allData = []; var allData = [];
var n = 0; var num_completed = 0;
function __run() { function __run() {
++n;
self.executeSQL(query, function(result) { self.executeSQL(query, function(result) {
allData.push(result); allData.push(result);
// Run again or return aggregated Data // Run again or return aggregated Data
if (n < numRuns) __run(); num_completed++;
else __aggregateData(allData); if (num_completed == numRuns) __aggregateData(allData);
}); });
} }
for (var i = 0; i < numRuns; ++i) {
__run();
}
__run(); __run();
}; };

View File

@ -58,7 +58,8 @@
<div class="row"> <div class="row">
<div class="col-sm-12"> <div class="col-sm-12">
<!-- View: Performance Data --> <!-- View: Performance Data -->
<h3>Performance Data (<span id="timeTotal">?</span>ms)</h3> <h3>Performance Data</h3>
<h4 id="timeInfo"></h4>
<table id="performanceDataTable" class="table table-bordered table-striped table-hover"> <table id="performanceDataTable" class="table table-bordered table-striped table-hover">
<thead> <thead>
@ -66,9 +67,9 @@
<th data-key="id">ID</th> <th data-key="id">ID</th>
<th data-key="name">Name</th> <th data-key="name">Name</th>
<th data-key="duration">Duration</th> <th data-key="duration">Duration</th>
<!-- <th>Start Time</th> -->
<!-- <th>End Time</th> -->
<th data-key="time_ms">Time (ms)</th> <th data-key="time_ms">Time (ms)</th>
<th data-key="startTime">Start Time</th>
<th data-key="endTime">End Time</th>
</tr> </tr>
</thead> </thead>
<tbody></tbody> <tbody></tbody>

View File

@ -16,6 +16,7 @@ table {
font-size: 14px; font-size: 14px;
} }
.content { .content {
width: 90%; width: 90%;
margin: auto; margin: auto;
@ -27,3 +28,11 @@ textarea#queryInput {
height: 500px; height: 500px;
resize: none; resize: none;
} }
h1, h2, h3, h4, h5, h6 {
margin-top: 0px;
}
h4 {
font-size: 14px;
}

View File

@ -190,12 +190,16 @@ function UpdateResultTable(result) {
function UpdatePerformanceData(performanceData) { function UpdatePerformanceData(performanceData) {
var table = document.querySelector('#performanceDataTable'); var table = document.querySelector('#performanceDataTable');
$('#timeTotal').html(performanceData.totalTime.toFixed(2)); var timeStrings = [
(performanceData.queryTaskTime + performanceData.parseTime).toFixed(3),
performanceData.queryTaskTime.toFixed(3),
performanceData.parseTime.toFixed(3),
performanceData.totalTime.toFixed(3),
]
var timeInfo = + ','
$('#timeInfo').html(timeStrings.join(','));
// Sort and insert into table // Sort and insert into table
if (!table._sortKey) table._sortKey = 'startTime';
if (!('_asc') in table) table._asc = true;
var tableData = performanceData.operators; var tableData = performanceData.operators;
table._data = tableData; table._data = tableData;
SortTableData(table); SortTableData(table);
@ -214,13 +218,18 @@ function InsertPerformanceData(performanceData) {
tr.append(CreateElement('td', data.name)); tr.append(CreateElement('td', data.name));
tr.append(CreateElement('td', data.duration)); tr.append(CreateElement('td', data.duration));
tr.append(CreateElement('td', data.time_ms.toFixed(6))); tr.append(CreateElement('td', data.time_ms.toFixed(6)));
tr.append(CreateElement('td', data.startTime));
tr.append(CreateElement('td', data.endTime));
tbody.append(tr); tbody.append(tr);
}); });
} }
function SortTableData(table) { function SortTableData(table) {
if (!table._sortKey) table._sortKey = 'startTime';
if (!('_asc') in table) table._asc = true;
var key = table._sortKey; var key = table._sortKey;
var sign = (table._asc) ? 1 : -1; var sign = (table._asc) ? -1 : 1;
table._data.sort(function(a, b) { table._data.sort(function(a, b) {
if (a[key].localeCompare) return sign * a[key].localeCompare(b[key]); if (a[key].localeCompare) return sign * a[key].localeCompare(b[key]);
return sign * (a[key] - b[key]); return sign * (a[key] - b[key]);