prevent all monitors making requests at the same moment when start the server

server/server.js

@@ -755,9 +755,11 @@ async function startMonitors() {
     let list = await R.find("monitor", " active = 1 ")
 
     for (let monitor of list) {
-        monitor.start(io);
         monitorList[monitor.id] = monitor;
+    }
 
+    for (let monitor of list) {
+        monitor.start(io);
         // Give some delays, so all monitors won't make request at the same moment when just start the server.
         await sleep(getRandomInt(300, 1000));
     }

src/components/HeartbeatBar.vue

@@ -43,7 +43,11 @@ export default {
         },
 
         shortBeatList() {
-            let placeholders = []
+            if (! this.beatList) {
+                return [];
+            }
+
+            let placeholders = [];
 
             let start = this.beatList.length - this.maxBeat;