Enhance map updates and component performance

- Updated API documentation to clarify the initial data message structure for real-time tile updates.
- Modified MapView component to load configuration and user data in parallel, improving map loading speed.
- Implemented asynchronous loading for markers after the map is visible, enhancing user experience.
- Introduced batching for tile updates to optimize rendering performance during map updates.
- Refactored character and marker creation functions to utilize dynamic Leaflet imports, improving modularity.

frontend-nuxt/lib/Marker.ts

@@ -1,5 +1,5 @@
+import type L from 'leaflet'
 import { HnHMaxZoom, ImageIcon } from '~/lib/LeafletCustomTypes'
-import * as L from 'leaflet'
 
 export interface MarkerData {
   id: number
@@ -48,7 +48,13 @@ export interface MarkerIconOptions {
   fallbackIconUrl?: string
 }
 
-export function createMarker(data: MarkerData, iconOptions?: MarkerIconOptions): MapMarker {
+export type LeafletApi = typeof import('leaflet')
+
+export function createMarker(
+  data: MarkerData,
+  iconOptions: MarkerIconOptions | undefined,
+  L: LeafletApi
+): MapMarker {
   let leafletMarker: L.Marker | null = null
   let onClick: ((e: L.LeafletMouseEvent) => void) | null = null
   let onContext: ((e: L.LeafletMouseEvent) => void) | null = null