5837765c by Rafal Wilinski

:cop: Layout and statistics improvements

1 parent 5c4f897e
......@@ -25,17 +25,13 @@
}
.stats-column {
display: flex;
flex-direction: column;
justify-content: center;
align-content: center;
margin-right: 3em;
flex: 0 0 200px;
}
.container {
display: flex;
flex-direction: row;
margin: auto;
margin-top: 20px;
}
.footer {
......@@ -65,6 +61,20 @@
</div>
<canvas id="memChart" width="400" height="100"></canvas>
</div>
<div class="container">
<div class="stats-column">
<h5>Requests per second</h5>
<h1 id="rpsStat">1.45</h1>
</div>
<canvas id="rpsChart" width="400" height="100"></canvas>
</div>
<div class="Status Codes">
<div class="stats-column">
<h5>Response status codes</h5>
<h1 id="codeStat">OK</h1>
</div>
<canvas id="codeChart" width="400" height="100"></canvas>
</div>
<div class="footer">
<p>Powered by Socket.io</p>
</div>
......@@ -135,12 +145,13 @@
});
socket.on('stats', function (data) {
console.log(data);
cpuStat.textContent = data.osStats[data.osStats.length - 1].cpu.toFixed(1) + '%';
cpuChart.data.datasets[0].data = data.osStats.map((point) => point.cpu);
cpuChart.data.labels = data.osStats.map((point) => point.timestamp);
cpuChart.update();
memStat.textContent = (data.osStats[data.osStats.length - 1].memory / 1024 / 1024).toFixed(1) + 'MB';
memStat.textContent = data.osStats[data.osStats.length - 1].memory.toFixed(1) + 'MB';
memChart.data.datasets[0].data = data.osStats.map((point) => point.memory);
memChart.data.labels = data.osStats.map((point) => point.timestamp);
memChart.update();
......
......@@ -14,19 +14,22 @@
retention: 100,
};
const gatherOsMetrics = (io) => {
const gatherOsMetrics = (io, config) => {
pidusage.stat(process.pid, (err, stat) => {
stat.timestamp = Date.now();
// Convert from B to MB
stat.memory = stat.memory / 1024 / 1024;
osStats.push(stat);
if (osStats.length >= config.retention) osStats.shift();
sendMetrics(io);
});
};
const sendMetrics = (io) => {
osStats.slice(Math.max(osStats.length - defaultConfig.retention, 1));
io.emit('stats', {
osStats: osStats.slice(Math.max(osStats.length - defaultConfig.retention, 1)),
osStats,
responseTimes
});
};
......@@ -50,11 +53,7 @@
const io = require('socket.io')(config.socketPort);
setInterval(() => gatherOsMetrics(io), config.interval * 1000);
io.on('connection', (socket) => {
});
setInterval(() => gatherOsMetrics(io, config), config.interval * 1000);
return (req, res, next) => {
const startTime = process.hrtime();
......@@ -70,7 +69,6 @@
responseTime,
timestamp: Date.now()
});
});
next();
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!