diff --git a/src/client/app/common/views/widgets/server.cpu-memory.vue b/src/client/app/common/views/widgets/server.cpu-memory.vue
index 2988993c94..b0421d6150 100644
--- a/src/client/app/common/views/widgets/server.cpu-memory.vue
+++ b/src/client/app/common/views/widgets/server.cpu-memory.vue
@@ -122,7 +122,7 @@ export default Vue.extend({
this.memP = (stats.mem.used / stats.mem.total * 100).toFixed(0);
},
onStatsLog(statsLog) {
- statsLog.forEach(stats => this.onStats(stats));
+ statsLog.reverse().forEach(stats => this.onStats(stats));
}
}
});
diff --git a/src/client/app/desktop/views/pages/admin/admin.cpu-memory.vue b/src/client/app/desktop/views/pages/admin/admin.cpu-memory.vue
index 572974e248..d14ce12553 100644
--- a/src/client/app/desktop/views/pages/admin/admin.cpu-memory.vue
+++ b/src/client/app/desktop/views/pages/admin/admin.cpu-memory.vue
@@ -15,14 +15,14 @@
:points="cpuPolylinePoints"
fill="none"
stroke="#fff"
- stroke-width="0.3"/>
+ stroke-width="1"/>
- CPU {{ cpuP }}%
+ CPU {{ cpuP }}%
@@ -59,8 +59,8 @@ export default Vue.extend({
props: ['connection'],
data() {
return {
- viewBoxX: 50,
- viewBoxY: 20,
+ viewBoxX: 200,
+ viewBoxY: 70,
stats: [],
cpuGradientId: uuid(),
cpuMaskId: uuid(),
@@ -79,7 +79,8 @@ export default Vue.extend({
this.connection.on('statsLog', this.onStatsLog);
this.connection.send({
type: 'requestLog',
- id: Math.random().toString()
+ id: Math.random().toString(),
+ length: 200
});
},
beforeDestroy() {
@@ -89,7 +90,7 @@ export default Vue.extend({
methods: {
onStats(stats) {
this.stats.push(stats);
- if (this.stats.length > 50) this.stats.shift();
+ if (this.stats.length > 200) this.stats.shift();
const cpuPolylinePoints = this.stats.map((s, i) => [this.viewBoxX - ((this.stats.length - 1) - i), (1 - s.cpu_usage) * this.viewBoxY]);
const memPolylinePoints = this.stats.map((s, i) => [this.viewBoxX - ((this.stats.length - 1) - i), (1 - (s.mem.used / s.mem.total)) * this.viewBoxY]);
@@ -103,7 +104,7 @@ export default Vue.extend({
this.memP = (stats.mem.used / stats.mem.total * 100).toFixed(0);
},
onStatsLog(statsLog) {
- statsLog.forEach(stats => this.onStats(stats));
+ statsLog.reverse().forEach(stats => this.onStats(stats));
}
}
});
@@ -111,8 +112,6 @@ export default Vue.extend({
diff --git a/src/daemons/server-stats.ts b/src/daemons/server-stats.ts
index af935d35b2..4a653f81f4 100644
--- a/src/daemons/server-stats.ts
+++ b/src/daemons/server-stats.ts
@@ -15,8 +15,8 @@ const interval = 1000;
export default function() {
const log = new Deque();
- ev.on('requestServerStatsLog', id => {
- ev.emit('serverStatsLog:' + id, log.toArray());
+ ev.on('requestServerStatsLog', x => {
+ ev.emit('serverStatsLog:' + x.id, log.toArray().slice(0, x.length || 50));
});
async function tick() {
@@ -36,8 +36,8 @@ export default function() {
process_uptime: process.uptime()
};
ev.emit('serverStats', stats);
- log.push(stats);
- if (log.length > 50) log.shift();
+ log.unshift(stats);
+ if (log.length > 200) log.pop();
}
tick();
diff --git a/src/server/api/stream/server-stats.ts b/src/server/api/stream/server-stats.ts
index 2a058de6c3..f6c1f14ebe 100644
--- a/src/server/api/stream/server-stats.ts
+++ b/src/server/api/stream/server-stats.ts
@@ -22,7 +22,10 @@ export default function(request: websocket.request, connection: websocket.connec
body: statsLog
}));
});
- ev.emit('requestServerStatsLog', msg.id);
+ ev.emit('requestServerStatsLog', {
+ id: msg.id,
+ length: msg.length
+ });
break;
}
});