perf: avoid reactivity on immutable objects

Signed-off-by: Pedro Lamas <[email protected]>

Author: pedrolamas

src/store/charts/mutations.ts

@@ -37,7 +37,7 @@ export const mutations = {
    * Inits the chart store from moonraker.
    */
   setChartStore (state, payload: ChartData[]) {
-    state.chart = payload
+    state.chart = payload.map<ChartData>(Object.freeze)
     state.ready = true
   },
 
@@ -49,7 +49,7 @@ export const mutations = {
     if (!state[payload.type]) {
       Vue.set(state, payload.type, [])
     }
-    state[payload.type].push(payload.data)
+    state[payload.type].push(Object.freeze(payload.data))
     const firstInRange = state[payload.type].findIndex((entry: ChartData) => (Date.now() - entry.date.valueOf()) / 1000 < payload.retention)
     if (firstInRange > 0) state[payload.type].splice(0, firstInRange)
   },

src/store/printer/mutations.ts

@@ -75,7 +75,7 @@ export const mutations = {
         // always evaluate true since we never
         // get an update unless something has changed.
         if (stateObject[key] !== payloadValue[key]) {
-          Vue.set(stateObject, key, payloadValue[key])
+          Vue.set(stateObject, key, Object.freeze(payloadValue[key]))
         }
       }
     }

src/store/server/actions.ts

@@ -145,21 +145,22 @@ export const actions = {
     commit('setMoonrakerStats', payload)
 
     // Add a chart entry
-    if (
-      payload.moonraker_stats &&
-      'cpu_usage' in payload.moonraker_stats &&
-      !Array.isArray(payload.moonraker_stats)
-    ) {
-      const d = payload.moonraker_stats
-      if (d.cpu_usage <= 100) {
-        commit('charts/setChartEntry', {
-          type: 'moonraker',
-          retention: 600,
-          data: {
-            date: new Date(d.time * 1000),
-            load: d.cpu_usage.toFixed(2)
-          }
-        }, { root: true })
+    if (payload.moonraker_stats) {
+      const stats = Array.isArray(payload.moonraker_stats)
+        ? payload.moonraker_stats
+        : [payload.moonraker_stats]
+
+      for (const d of stats) {
+        if (d.cpu_usage <= 100) {
+          commit('charts/setChartEntry', {
+            type: 'moonraker',
+            retention: 600,
+            data: {
+              date: new Date(d.time * 1000),
+              load: d.cpu_usage.toFixed(2)
+            }
+          }, { root: true })
+        }
       }
     }
   },

src/store/server/mutations.ts

@@ -60,18 +60,21 @@ export const mutations = {
    * On initial init, we get the server (moonraker) process stats and any throttled state flags.
    */
   setMoonrakerStats (state, payload) {
-    if (payload.cpu_temp) Vue.set(state, 'cpu_temp', payload.cpu_temp)
-    if (payload.throttled_state) state.throttled_state = { ...state.throttled_state, ...payload.throttled_state }
-    if (
-      payload.moonraker_stats &&
-      Array.isArray(payload.moonraker_stats)
-    ) {
-      // Update with array.
-      Vue.set(state, 'moonraker_stats', payload.moonraker_stats)
-    } else {
-      // Append to array.
-      if (state.moonraker_stats) {
-        state.moonraker_stats.push(payload.moonraker_stats)
+    if (payload.cpu_temp) {
+      Vue.set(state, 'cpu_temp', payload.cpu_temp)
+    }
+
+    if (payload.throttled_state) {
+      state.throttled_state = { ...state.throttled_state, ...payload.throttled_state }
+    }
+
+    if (payload.moonraker_stats) {
+      if (Array.isArray(payload.moonraker_stats)) {
+        // Update with array.
+        Vue.set(state, 'moonraker_stats', payload.moonraker_stats.map(Object.freeze))
+      } else {
+        // Append to array.
+        state.moonraker_stats.push(Object.freeze(payload.moonraker_stats))
         while (state.moonraker_stats.length > 30) {
           state.moonraker_stats.splice(0, 1)
         }