From f5ef24c02fd45baad6f077b7e01de50afb0f0ed1 Mon Sep 17 00:00:00 2001
From: htlee <htlee@gcsc.co.kr>
Date: Mon, 16 Feb 2026 05:28:44 +0900
Subject: [PATCH] =?UTF-8?q?perf(map):=20=ED=95=B4=EC=A0=80=EC=BC=80?=
 =?UTF-8?q?=EC=9D=B4=EB=B8=94=20=EB=A0=8C=EB=8D=94=EB=A7=81=20=EC=B5=9C?=
 =?UTF-8?q?=EC=A0=81=ED=99=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- GeoJSON source tolerance:1, buffer:64 (저줌 vertex 단순화)
- hitarea/casing/glow 레이어 minzoom:3 (저줌 렌더 제외)
- ensureGeoJsonSource에 source options 파라미터 추가
- NativeSourceConfig에 options 필드 추가

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 apps/web/src/widgets/map3d/hooks/useNativeMapLayers.ts | 6 ++++--
 apps/web/src/widgets/map3d/hooks/useSubcablesLayer.ts  | 5 ++++-
 apps/web/src/widgets/map3d/lib/layerHelpers.ts         | 2 ++
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/apps/web/src/widgets/map3d/hooks/useNativeMapLayers.ts b/apps/web/src/widgets/map3d/hooks/useNativeMapLayers.ts
index 6b5e0c6..d82cd42 100644
--- a/apps/web/src/widgets/map3d/hooks/useNativeMapLayers.ts
+++ b/apps/web/src/widgets/map3d/hooks/useNativeMapLayers.ts
@@ -14,7 +14,7 @@
  * 별도 useEffect에서 처리합니다.
  */
 import { useEffect, useRef, type MutableRefObject } from 'react';
-import maplibregl, { type LayerSpecification } from 'maplibre-gl';
+import maplibregl, { type GeoJSONSourceSpecification, type LayerSpecification } from 'maplibre-gl';
 import { ensureGeoJsonSource, ensureLayer, setLayerVisibility, cleanupLayers } from '../lib/layerHelpers';
 import { kickRepaint, onMapStyleReady } from '../lib/mapCore';
 
@@ -23,6 +23,8 @@ import { kickRepaint, onMapStyleReady } from '../lib/mapCore';
 export interface NativeSourceConfig {
   id: string;
   data: GeoJSON.GeoJSON | null;
+  /** GeoJSON source 옵션 (tolerance, buffer 등) */
+  options?: Partial<Omit<GeoJSONSourceSpecification, 'type' | 'data'>>;
 }
 
 export interface NativeLayerSpec {
@@ -101,7 +103,7 @@ export function useNativeMapLayers(
         // 3. Source 생성/업데이트
         for (const src of cfg.sources) {
           if (src.data) {
-            ensureGeoJsonSource(map, src.id, src.data);
+            ensureGeoJsonSource(map, src.id, src.data, src.options);
           }
         }
 
diff --git a/apps/web/src/widgets/map3d/hooks/useSubcablesLayer.ts b/apps/web/src/widgets/map3d/hooks/useSubcablesLayer.ts
index 59f9411..7fcc138 100644
--- a/apps/web/src/widgets/map3d/hooks/useSubcablesLayer.ts
+++ b/apps/web/src/widgets/map3d/hooks/useSubcablesLayer.ts
@@ -33,6 +33,7 @@ const LAYER_SPECS: NativeLayerSpec[] = [
     sourceId: SRC_ID,
     paint: { 'line-color': 'rgba(0,0,0,0)', 'line-width': 14, 'line-opacity': 0 },
     layout: { 'line-cap': 'round', 'line-join': 'round' },
+    minzoom: 3,
   },
   {
     id: CASING_ID,
@@ -44,6 +45,7 @@ const LAYER_SPECS: NativeLayerSpec[] = [
       'line-opacity': CASING_OPACITY_DEFAULT,
     },
     layout: { 'line-cap': 'round', 'line-join': 'round' },
+    minzoom: 3,
   },
   {
     id: LINE_ID,
@@ -68,6 +70,7 @@ const LAYER_SPECS: NativeLayerSpec[] = [
     },
     filter: ['==', ['get', 'id'], ''],
     layout: { 'line-cap': 'round', 'line-join': 'round' },
+    minzoom: 3,
   },
   {
     id: POINTS_ID,
@@ -156,7 +159,7 @@ export function useSubcablesLayer(
     reorderGlobeFeatureLayers,
     {
       sources: [
-        { id: SRC_ID, data: subcableGeo },
+        { id: SRC_ID, data: subcableGeo, options: { tolerance: 1, buffer: 64 } },
         { id: POINTS_SRC_ID, data: pointsGeoJson },
       ],
       layers: LAYER_SPECS,
diff --git a/apps/web/src/widgets/map3d/lib/layerHelpers.ts b/apps/web/src/widgets/map3d/lib/layerHelpers.ts
index bfe12ca..8a06564 100644
--- a/apps/web/src/widgets/map3d/lib/layerHelpers.ts
+++ b/apps/web/src/widgets/map3d/lib/layerHelpers.ts
@@ -71,6 +71,7 @@ export function ensureGeoJsonSource(
   map: maplibregl.Map,
   sourceId: string,
   data: GeoJSON.GeoJSON,
+  options?: Partial<Omit<GeoJSONSourceSpecification, 'type' | 'data'>>,
 ) {
   const existing = map.getSource(sourceId);
   if (existing) {
@@ -79,6 +80,7 @@ export function ensureGeoJsonSource(
     map.addSource(sourceId, {
       type: 'geojson',
       data,
+      ...options,
     } satisfies GeoJSONSourceSpecification);
   }
 }