Refine map tile updates and enhance performance

- Updated tile freshness animation to reduce flicker and improve visual clarity.
- Modified MapView component to optimize layer visibility handling and ensure proper map resizing on fullscreen toggle.
- Increased tile buffer size in map initialization for better tile loading efficiency.
- Implemented logic to limit tile updates to only visible tiles, enhancing rendering performance during map updates.

frontend-nuxt/components/MapView.vue

@@ -439,13 +439,21 @@ onMounted(async () => {
       ;(mapInit.coordLayer.options as { visible?: boolean }).visible = v
       mapInit.coordLayer.setOpacity(v ? 1 : 0)
       mapInit.coordLayer.redraw?.()
-      if (v && leafletMap) {
-        mapInit.coordLayer.bringToFront?.()
-        leafletMap.invalidateSize()
-      }
+      if (v) mapInit.coordLayer.bringToFront?.()
     }
   })
 
+  watch(
+    () => fullscreen.isFullscreen.value,
+    () => {
+      nextTick(() => {
+        requestAnimationFrame(() => {
+          if (leafletMap) leafletMap.invalidateSize()
+        })
+      })
+    }
+  )
+
   watch(mapLogic.state.hideMarkers, (v) => {
     layersManager?.refreshMarkersVisibility(v)
   })
@@ -496,9 +504,6 @@ onMounted(async () => {
 
   leafletMap.on('moveend', () => mapLogic.updateDisplayCoords(leafletMap))
   mapLogic.updateDisplayCoords(leafletMap)
-  leafletMap.on('zoomend', () => {
-    if (leafletMap) leafletMap.invalidateSize()
-  })
   leafletMap.on('drag', () => {
     mapLogic.state.trackingCharacterId.value = -1
   })