From 1467fd1cf316a52b72d82e7f164d9e3e02484d6e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Ant=C3=B4nio=20Cardoso?= <joao.maker@gmail.com>
Date: Sat, 25 Jul 2026 11:25:15 -0300
Subject: [PATCH 1/2] frontend: store: mavlink: Allow lowering message refresh
 rates

Replace listeners when the requested rate changes in either direction
so pages can ratchet streams down on destroy instead of only up.
---
 core/frontend/src/store/mavlink.ts | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/core/frontend/src/store/mavlink.ts b/core/frontend/src/store/mavlink.ts
index 007d920594..729ee3e4d2 100644
--- a/core/frontend/src/store/mavlink.ts
+++ b/core/frontend/src/store/mavlink.ts
@@ -33,21 +33,20 @@ class MavlinkStore extends VuexModule {
     const { messageName, refreshRate } = rate
     if (refreshRate < 0) {
       console.warn(`Invalid request rate requested for message ${messageName}@${refreshRate}Hz`)
+      return
     }
 
-    mavlink2rest.requestMessageRate(messageName, refreshRate, autopilot_data.system_id)
-    // Remove any listener that has a lower frequency than requested
+    // Equal rate: keep existing listener and skip the wire request.
+    // Any other rate change discards the listener and creates a replacement.
     if (messageName in this.message_listeners) {
-      const currentRate = this.message_listeners[messageName].frequency
-      if (currentRate > refreshRate) {
-        console.warn(
-          `Request with higher rate already registered for message ${messageName}@${currentRate}Hz vs ${refreshRate}Hz`,
-        )
+      if (this.message_listeners[messageName].frequency === refreshRate) {
         return
       }
       this.message_listeners[messageName].discard()
     }
 
+    mavlink2rest.requestMessageRate(messageName, refreshRate, autopilot_data.system_id)
+
     // Create a new listener
     this.message_listeners[messageName] = mavlink2rest.startListening(messageName).setCallback((receivedMessage) => {
       this.updateMessage({

From e54d12b359cd9fe386ec411f2772776ea77a4ffe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Ant=C3=B4nio=20Cardoso?= <joao.maker@gmail.com>
Date: Sat, 25 Jul 2026 11:25:15 -0300
Subject: [PATCH 2/2] frontend: vehiclesetup: Clean up MAVLink rates and
 compass timers on leave

Ratchet message rates down on destroy, discard position listeners, and
clear the CompassDisplay render interval plus GSAP tweens.
---
 .../compass/AutoCoordinateDetector.vue         | 18 +++++++++++++-----
 .../configuration/compass/CompassDisplay.vue   | 14 ++++++++++++--
 .../compass/LevelHorizonCalibration.vue        |  2 ++
 .../vehiclesetup/overview/GyroCalib.vue        |  9 ++++++++-
 core/frontend/src/views/MainView.vue           |  1 +
 5 files changed, 36 insertions(+), 8 deletions(-)

diff --git a/core/frontend/src/components/vehiclesetup/configuration/compass/AutoCoordinateDetector.vue b/core/frontend/src/components/vehiclesetup/configuration/compass/AutoCoordinateDetector.vue
index 2085362e7b..ffc064d4ba 100644
--- a/core/frontend/src/components/vehiclesetup/configuration/compass/AutoCoordinateDetector.vue
+++ b/core/frontend/src/components/vehiclesetup/configuration/compass/AutoCoordinateDetector.vue
@@ -61,9 +61,10 @@
 
 <script lang="ts">
 
-import { PropType } from 'vue'
+import { markRaw, PropType } from 'vue'
 
 import mavlink2rest from '@/libs/MAVLink2Rest'
+import Listener from '@/libs/MAVLink2Rest/Listener'
 import autopilot_data from '@/store/autopilot'
 import autopilot from '@/store/autopilot_manager'
 import { FirmwareVehicleType } from '@/types/autopilot'
@@ -93,6 +94,7 @@ export default {
       manual_lat: this.inputcoordinates?.lat,
       manual_lon: this.inputcoordinates?.lon,
       original_ekf_src: undefined as number | undefined,
+      position_listener: undefined as Listener | undefined,
     }
   },
   computed: {
@@ -136,13 +138,19 @@ export default {
   },
   mounted() {
     this.original_ekf_src = this.current_ekf_src
-    mavlink2rest.startListening('GLOBAL_POSITION_INT').setCallback((receivedMessage) => {
-      this.mavlink_lat = receivedMessage.message.lat !== 0 ? receivedMessage.message.lat * 1e-7 : undefined
-      this.mavlink_lon = receivedMessage.message.lon !== 0 ? receivedMessage.message.lon * 1e-7 : undefined
-    }).setFrequency(0)
+    // markRaw: Listener → Endpoint.latestData must not be deep-observed.
+    this.position_listener = markRaw(
+      mavlink2rest.startListening('GLOBAL_POSITION_INT').setCallback((receivedMessage) => {
+        this.mavlink_lat = receivedMessage.message.lat !== 0 ? receivedMessage.message.lat * 1e-7 : undefined
+        this.mavlink_lon = receivedMessage.message.lon !== 0 ? receivedMessage.message.lon * 1e-7 : undefined
+      }).setFrequency(0),
+    )
     mavlink2rest.requestMessageRate('GLOBAL_POSITION_INT', 1, autopilot_data.system_id)
     this.getGeoIp()
   },
+  beforeDestroy() {
+    this.position_listener?.discard()
+  },
   methods: {
     async waitFor(func: () => boolean, raise = false): Promise<void> {
       const start = new Date()
diff --git a/core/frontend/src/components/vehiclesetup/configuration/compass/CompassDisplay.vue b/core/frontend/src/components/vehiclesetup/configuration/compass/CompassDisplay.vue
index 1be7fbf583..39a5d9079c 100644
--- a/core/frontend/src/components/vehiclesetup/configuration/compass/CompassDisplay.vue
+++ b/core/frontend/src/components/vehiclesetup/configuration/compass/CompassDisplay.vue
@@ -38,6 +38,8 @@ const mainAngles = {
   315: 'NW',
 }
 
+const COMPASS_REFRESH_MESSAGES = ['ATTITUDE', 'RAW_IMU', 'SCALED_IMU2', 'SCALED_IMU3', 'GPS_RAW_INT', 'GPS2_RAW']
+
 export default Vue.extend({
   name: 'CompassDisplay',
   components: {
@@ -59,6 +61,7 @@ export default Vue.extend({
       renderVariables: {
         yawAngleDegrees: [0, 0, 0, 0, 0, 0],
       },
+      render_interval: 0,
     }
   },
   computed: {
@@ -131,10 +134,17 @@ export default Vue.extend({
       this.canvas.height = this.canvasSize
     })
     this.initializeCanvas()
-    for (const msg of ['ATTITUDE', 'RAW_IMU', 'SCALED_IMU2', 'SCALED_IMU3', 'GPS_RAW_INT', 'GPS2_RAW']) {
+    for (const msg of COMPASS_REFRESH_MESSAGES) {
       mavlink.setMessageRefreshRate({ messageName: msg, refreshRate: 10 })
     }
   },
+  beforeDestroy() {
+    clearInterval(this.render_interval)
+    gsap.killTweensOf(this.renderVariables.yawAngleDegrees)
+    for (const msg of COMPASS_REFRESH_MESSAGES) {
+      mavlink.setMessageRefreshRate({ messageName: msg, refreshRate: 1 })
+    }
+  },
   methods: {
     resetCanvas(ctx: CanvasRenderingContext2D) {
       ctx.setTransform(1, 0, 0, 1, 0, 0)
@@ -289,7 +299,7 @@ export default Vue.extend({
       }
     },
     initializeCanvas() {
-      setInterval(() => {
+      this.render_interval = window.setInterval(() => {
         for (const [index, _value] of this.renderVariables.yawAngleDegrees.entries()) {
           const angle = this.headings[index]
           const angleDegrees = this.headings[index]
diff --git a/core/frontend/src/components/vehiclesetup/configuration/compass/LevelHorizonCalibration.vue b/core/frontend/src/components/vehiclesetup/configuration/compass/LevelHorizonCalibration.vue
index e893bd7a71..e278cb974d 100644
--- a/core/frontend/src/components/vehiclesetup/configuration/compass/LevelHorizonCalibration.vue
+++ b/core/frontend/src/components/vehiclesetup/configuration/compass/LevelHorizonCalibration.vue
@@ -123,6 +123,8 @@ export default Vue.extend({
       if (open) {
         mavlink.setMessageRefreshRate({ messageName: 'ATTITUDE', refreshRate: 10 })
       } else {
+        // Do not ratchet ATTITUDE down here: CompassDisplay may still be mounted
+        // (Vuetify keeps visited tabs alive) and needs 10 Hz.
         this.status_text = undefined
         this.status_type = undefined
       }
diff --git a/core/frontend/src/components/vehiclesetup/overview/GyroCalib.vue b/core/frontend/src/components/vehiclesetup/overview/GyroCalib.vue
index 48ba2d8563..0b1bae4bcf 100644
--- a/core/frontend/src/components/vehiclesetup/overview/GyroCalib.vue
+++ b/core/frontend/src/components/vehiclesetup/overview/GyroCalib.vue
@@ -70,6 +70,8 @@ import mavlink_store_get from '@/utils/mavlink'
 
 import { calibrator, PreflightCalibration } from '../calibration'
 
+const GYRO_REFRESH_MESSAGES = ['RAW_IMU', 'SCALED_IMU2', 'SCALED_IMU3']
+
 interface CalibrationStatus {
     param?: Parameter
     name: string
@@ -129,10 +131,15 @@ export default Vue.extend({
     },
   },
   mounted() {
-    for (const msg of ['RAW_IMU', 'SCALED_IMU2', 'SCALED_IMU3']) {
+    for (const msg of GYRO_REFRESH_MESSAGES) {
       mavlink.setMessageRefreshRate({ messageName: msg, refreshRate: 10 })
     }
   },
+  beforeDestroy() {
+    for (const msg of GYRO_REFRESH_MESSAGES) {
+      mavlink.setMessageRefreshRate({ messageName: msg, refreshRate: 1 })
+    }
+  },
   methods: {
     async calibrate() {
       this.calibration_status = 'Calibrating...'
diff --git a/core/frontend/src/views/MainView.vue b/core/frontend/src/views/MainView.vue
index b53c382b8d..feb3d3b983 100644
--- a/core/frontend/src/views/MainView.vue
+++ b/core/frontend/src/views/MainView.vue
@@ -268,6 +268,7 @@ export default Vue.extend({
   },
   beforeDestroy() {
     window.removeEventListener('resize', this.handleResize)
+    mavlink.setMessageRefreshRate({ messageName: 'ATTITUDE', refreshRate: 1 })
   },
   methods: {
     handleResize() {