@principal-ai/file-city-react 0.4.1 → 0.4.2

package/dist/components/ArchitectureMapHighlightLayers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ArchitectureMapHighlightLayers.d.ts","sourceRoot":"","sources":["../../src/components/ArchitectureMapHighlightLayers.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ArchitectureMapHighlightLayers.d.ts","sourceRoot":"","sources":["../../src/components/ArchitectureMapHighlightLayers.tsx"],"names":[],"mappings":"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"}

package/dist/components/ArchitectureMapHighlightLayers.js

@@ -210,6 +210,9 @@ onHover, buildingBorderRadius = 0, districtBorderRadius = 0, }) {
     const isAnimating = targetZoom !== null;
     // Track the last zoomToPath to detect changes
     const lastZoomToPathRef = (0, react_1.useRef)(null);
+    // Throttle ref for hover updates (improves performance with large datasets)
+    const lastHoverUpdateRef = (0, react_1.useRef)(0);
+    const HOVER_THROTTLE_MS = 16; // ~60fps max for hover updates
     (0, react_1.useEffect)(() => {
         // Reset user interaction state when enableZoom is disabled
         if (!enableZoom) {
@@ -693,6 +696,66 @@ onHover, buildingBorderRadius = 0, districtBorderRadius = 0, }) {
         }
         return layers;
     }, [stableLayers, dynamicLayers, abstractionLayer]);
+    // Memoize abstracted paths lookup - only recalculates when abstraction layer changes
+    const { abstractedPathsSet, abstractedPathLookup } = (0, react_1.useMemo)(() => {
+        const pathsSet = new Set();
+        const abstractionLayerDef = allLayers.find(l => l.id === 'directory-abstraction');
+        if (abstractionLayerDef && abstractionLayerDef.enabled) {
+            abstractionLayerDef.items.forEach(item => {
+                if (item.type === 'directory') {
+                    pathsSet.add(item.path);
+                }
+            });
+        }
+        return {
+            abstractedPathsSet: pathsSet,
+            abstractedPathLookup: new PathHierarchyLookup(pathsSet),
+        };
+    }, [allLayers]);
+    // Memoize visible districts - only recalculates when data or abstraction changes, NOT on hover
+    const visibleDistrictsMemo = (0, react_1.useMemo)(() => {
+        if (!filteredCityData)
+            return [];
+        let districts = abstractedPathLookup.size > 0
+            ? filteredCityData.districts.filter(district => {
+                // Check for root abstraction first
+                if (abstractedPathLookup.has('')) {
+                    return !district.path || district.path === '';
+                }
+                if (!district.path)
+                    return true;
+                if (abstractedPathLookup.has(district.path))
+                    return true;
+                return !abstractedPathLookup.isChildOfAbstracted(district.path);
+            })
+            : filteredCityData.districts;
+        // If root is abstracted and there's no root district, create one for the cover
+        if (abstractedPathsSet.has('')) {
+            const hasRootDistrict = districts.some(d => !d.path || d.path === '');
+            if (!hasRootDistrict) {
+                districts = [
+                    {
+                        path: '',
+                        worldBounds: filteredCityData.bounds,
+                        fileCount: filteredCityData.buildings.length,
+                        type: 'directory',
+                    },
+                    ...districts,
+                ];
+            }
+        }
+        return districts;
+    }, [filteredCityData, abstractedPathLookup, abstractedPathsSet]);
+    // Memoize visible buildings - only recalculates when data or abstraction changes, NOT on hover
+    const visibleBuildingsMemo = (0, react_1.useMemo)(() => {
+        if (!filteredCityData)
+            return [];
+        return abstractedPathLookup.size > 0
+            ? filteredCityData.buildings.filter(building => {
+                return !abstractedPathLookup.isPathAbstracted(building.path);
+            })
+            : filteredCityData.buildings;
+    }, [filteredCityData, abstractedPathLookup]);
     // Update hit test cache when geometry or abstraction changes
     // Note: We don't depend on zoomState here because:
     // 1. The spatial grid only depends on buildings/districts and abstraction
@@ -762,64 +825,12 @@ onHover, buildingBorderRadius = 0, districtBorderRadius = 0, }) {
             y: ((z - coordinateSystemData.bounds.minZ) * scale + offsetZ) * zoomState.scale +
                 zoomState.offsetY,
         });
-        // Get abstracted paths for filtering child districts
-        const abstractedPathsForDistricts = new Set();
-        const abstractionLayerForDistricts = allLayers.find(l => l.id === 'directory-abstraction');
-        if (abstractionLayerForDistricts && abstractionLayerForDistricts.enabled) {
-            abstractionLayerForDistricts.items.forEach(item => {
-                if (item.type === 'directory') {
-                    abstractedPathsForDistricts.add(item.path);
-                }
-            });
-        }
-        // Create PathHierarchyLookup for O(depth) containment checks
-        const pathLookup = new PathHierarchyLookup(abstractedPathsForDistricts);
-        // Keep abstracted districts (for covers) but filter out their children
-        let visibleDistricts = pathLookup.size > 0
-            ? filteredCityData.districts.filter(district => {
-                // Check for root abstraction first
-                if (pathLookup.has('')) {
-                    // If root is abstracted, only show root district
-                    return !district.path || district.path === '';
-                }
-                if (!district.path)
-                    return true; // Keep root
-                // Keep the abstracted district itself (we need it for the cover)
-                if (pathLookup.has(district.path)) {
-                    return true;
-                }
-                // Filter out children of abstracted directories using O(depth) lookup
-                return !pathLookup.isChildOfAbstracted(district.path);
-            })
-            : filteredCityData.districts;
-        // If root is abstracted and there's no root district, create one for the cover
-        if (abstractedPathsForDistricts.has('')) {
-            const hasRootDistrict = visibleDistricts.some(d => !d.path || d.path === '');
-            if (!hasRootDistrict) {
-                visibleDistricts = [
-                    {
-                        path: '',
-                        worldBounds: filteredCityData.bounds,
-                        fileCount: filteredCityData.buildings.length, // Total file count
-                        type: 'directory',
-                    },
-                    ...visibleDistricts,
-                ];
-            }
-        }
+        // Use memoized visible districts and buildings (pre-filtered, doesn't recalculate on hover)
         // Draw districts with layer support
-        (0, drawLayeredBuildings_1.drawLayeredDistricts)(ctx, visibleDistricts, worldToCanvas, scale * zoomState.scale, allLayers, interactionState.hoveredDistrict, fullSize, resolvedDefaultDirectoryColor, filteredCityData.metadata.layoutConfig, abstractedPathsForDistricts, // Pass abstracted paths to skip labels
+        (0, drawLayeredBuildings_1.drawLayeredDistricts)(ctx, visibleDistrictsMemo, worldToCanvas, scale * zoomState.scale, allLayers, interactionState.hoveredDistrict, fullSize, resolvedDefaultDirectoryColor, filteredCityData.metadata.layoutConfig, abstractedPathsSet, // Pass abstracted paths to skip labels
         showDirectoryLabels, districtBorderRadius);
-        // Filter out buildings that are in abstracted directories
-        // Reuse the pathLookup created earlier for O(depth) containment checks
-        const visibleBuildings = pathLookup.size > 0
-            ? filteredCityData.buildings.filter(building => {
-                // Use PathHierarchyLookup for efficient O(depth) check
-                return !pathLookup.isPathAbstracted(building.path);
-            })
-            : filteredCityData.buildings;
         // Draw buildings with layer support
-        (0, drawLayeredBuildings_1.drawLayeredBuildings)(ctx, visibleBuildings, worldToCanvas, scale * zoomState.scale, allLayers, interactionState.hoveredBuilding, resolvedDefaultBuildingColor, showFileNames, resolvedHoverBorderColor, disableOpacityDimming, showFileTypeIcons, buildingBorderRadius);
+        (0, drawLayeredBuildings_1.drawLayeredBuildings)(ctx, visibleBuildingsMemo, worldToCanvas, scale * zoomState.scale, allLayers, interactionState.hoveredBuilding, resolvedDefaultBuildingColor, showFileNames, resolvedHoverBorderColor, disableOpacityDimming, showFileTypeIcons, buildingBorderRadius);
         // Performance monitoring end available for debugging
         // Performance stats available but not logged to reduce console noise
         // Uncomment for debugging: render time, buildings/districts counts, layer counts
@@ -848,6 +859,10 @@ onHover, buildingBorderRadius = 0, districtBorderRadius = 0, }) {
         resolvedDefaultBuildingColor,
         districtBorderRadius,
         showFileTypeIcons,
+        // Memoized values for performance (don't recalculate on hover)
+        visibleDistrictsMemo,
+        visibleBuildingsMemo,
+        abstractedPathsSet,
     ]);
     // Optimized hit testing
     const performHitTest = (0, react_1.useCallback)((canvasX, canvasY) => {
@@ -974,6 +989,12 @@ onHover, buildingBorderRadius = 0, districtBorderRadius = 0, }) {
     const handleMouseMoveInternal = (0, react_1.useCallback)((e) => {
         if (!canvasRef.current || !containerRef.current || !filteredCityData || zoomState.isDragging)
             return;
+        // Throttle hover updates to improve performance with large datasets
+        const now = performance.now();
+        if (now - lastHoverUpdateRef.current < HOVER_THROTTLE_MS) {
+            return;
+        }
+        lastHoverUpdateRef.current = now;
         // Get the container rect for mouse position
         const containerRect = containerRef.current.getBoundingClientRect();
         // Get mouse position relative to the container

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@principal-ai/file-city-react",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "React components for File City visualization",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/components/ArchitectureMapHighlightLayers.tsx

@@ -358,6 +358,10 @@ function ArchitectureMapHighlightLayersInner({
   // Track the last zoomToPath to detect changes
   const lastZoomToPathRef = useRef<string | null>(null);
 
+  // Throttle ref for hover updates (improves performance with large datasets)
+  const lastHoverUpdateRef = useRef<number>(0);
+  const HOVER_THROTTLE_MS = 16; // ~60fps max for hover updates
+
   useEffect(() => {
     // Reset user interaction state when enableZoom is disabled
     if (!enableZoom) {
@@ -1003,6 +1007,70 @@ function ArchitectureMapHighlightLayersInner({
     return layers;
   }, [stableLayers, dynamicLayers, abstractionLayer]);
 
+  // Memoize abstracted paths lookup - only recalculates when abstraction layer changes
+  const { abstractedPathsSet, abstractedPathLookup } = useMemo(() => {
+    const pathsSet = new Set<string>();
+    const abstractionLayerDef = allLayers.find(l => l.id === 'directory-abstraction');
+    if (abstractionLayerDef && abstractionLayerDef.enabled) {
+      abstractionLayerDef.items.forEach(item => {
+        if (item.type === 'directory') {
+          pathsSet.add(item.path);
+        }
+      });
+    }
+    return {
+      abstractedPathsSet: pathsSet,
+      abstractedPathLookup: new PathHierarchyLookup(pathsSet),
+    };
+  }, [allLayers]);
+
+  // Memoize visible districts - only recalculates when data or abstraction changes, NOT on hover
+  const visibleDistrictsMemo = useMemo(() => {
+    if (!filteredCityData) return [];
+
+    let districts =
+      abstractedPathLookup.size > 0
+        ? filteredCityData.districts.filter(district => {
+            // Check for root abstraction first
+            if (abstractedPathLookup.has('')) {
+              return !district.path || district.path === '';
+            }
+            if (!district.path) return true;
+            if (abstractedPathLookup.has(district.path)) return true;
+            return !abstractedPathLookup.isChildOfAbstracted(district.path);
+          })
+        : filteredCityData.districts;
+
+    // If root is abstracted and there's no root district, create one for the cover
+    if (abstractedPathsSet.has('')) {
+      const hasRootDistrict = districts.some(d => !d.path || d.path === '');
+      if (!hasRootDistrict) {
+        districts = [
+          {
+            path: '',
+            worldBounds: filteredCityData.bounds,
+            fileCount: filteredCityData.buildings.length,
+            type: 'directory' as const,
+          },
+          ...districts,
+        ];
+      }
+    }
+
+    return districts;
+  }, [filteredCityData, abstractedPathLookup, abstractedPathsSet]);
+
+  // Memoize visible buildings - only recalculates when data or abstraction changes, NOT on hover
+  const visibleBuildingsMemo = useMemo(() => {
+    if (!filteredCityData) return [];
+
+    return abstractedPathLookup.size > 0
+      ? filteredCityData.buildings.filter(building => {
+          return !abstractedPathLookup.isPathAbstracted(building.path);
+        })
+      : filteredCityData.buildings;
+  }, [filteredCityData, abstractedPathLookup]);
+
   // Update hit test cache when geometry or abstraction changes
   // Note: We don't depend on zoomState here because:
   // 1. The spatial grid only depends on buildings/districts and abstraction
@@ -1106,63 +1174,11 @@ function ArchitectureMapHighlightLayersInner({
         zoomState.offsetY,
     });
 
-    // Get abstracted paths for filtering child districts
-    const abstractedPathsForDistricts = new Set<string>();
-    const abstractionLayerForDistricts = allLayers.find(l => l.id === 'directory-abstraction');
-    if (abstractionLayerForDistricts && abstractionLayerForDistricts.enabled) {
-      abstractionLayerForDistricts.items.forEach(item => {
-        if (item.type === 'directory') {
-          abstractedPathsForDistricts.add(item.path);
-        }
-      });
-    }
-
-    // Create PathHierarchyLookup for O(depth) containment checks
-    const pathLookup = new PathHierarchyLookup(abstractedPathsForDistricts);
-
-    // Keep abstracted districts (for covers) but filter out their children
-    let visibleDistricts =
-      pathLookup.size > 0
-        ? filteredCityData.districts.filter(district => {
-            // Check for root abstraction first
-            if (pathLookup.has('')) {
-              // If root is abstracted, only show root district
-              return !district.path || district.path === '';
-            }
-
-            if (!district.path) return true; // Keep root
-
-            // Keep the abstracted district itself (we need it for the cover)
-            if (pathLookup.has(district.path)) {
-              return true;
-            }
-
-            // Filter out children of abstracted directories using O(depth) lookup
-            return !pathLookup.isChildOfAbstracted(district.path);
-          })
-        : filteredCityData.districts;
-
-    // If root is abstracted and there's no root district, create one for the cover
-    if (abstractedPathsForDistricts.has('')) {
-      const hasRootDistrict = visibleDistricts.some(d => !d.path || d.path === '');
-
-      if (!hasRootDistrict) {
-        visibleDistricts = [
-          {
-            path: '',
-            worldBounds: filteredCityData.bounds,
-            fileCount: filteredCityData.buildings.length, // Total file count
-            type: 'directory',
-          },
-          ...visibleDistricts,
-        ];
-      }
-    }
-
+    // Use memoized visible districts and buildings (pre-filtered, doesn't recalculate on hover)
     // Draw districts with layer support
     drawLayeredDistricts(
       ctx,
-      visibleDistricts,
+      visibleDistrictsMemo,
       worldToCanvas,
       scale * zoomState.scale,
       allLayers,
@@ -1170,25 +1186,15 @@ function ArchitectureMapHighlightLayersInner({
       fullSize,
       resolvedDefaultDirectoryColor,
       filteredCityData.metadata.layoutConfig,
-      abstractedPathsForDistricts, // Pass abstracted paths to skip labels
+      abstractedPathsSet, // Pass abstracted paths to skip labels
       showDirectoryLabels,
       districtBorderRadius,
     );
 
-    // Filter out buildings that are in abstracted directories
-    // Reuse the pathLookup created earlier for O(depth) containment checks
-    const visibleBuildings =
-      pathLookup.size > 0
-        ? filteredCityData.buildings.filter(building => {
-            // Use PathHierarchyLookup for efficient O(depth) check
-            return !pathLookup.isPathAbstracted(building.path);
-          })
-        : filteredCityData.buildings;
-
     // Draw buildings with layer support
     drawLayeredBuildings(
       ctx,
-      visibleBuildings,
+      visibleBuildingsMemo,
       worldToCanvas,
       scale * zoomState.scale,
       allLayers,
@@ -1229,6 +1235,10 @@ function ArchitectureMapHighlightLayersInner({
     resolvedDefaultBuildingColor,
     districtBorderRadius,
     showFileTypeIcons,
+    // Memoized values for performance (don't recalculate on hover)
+    visibleDistrictsMemo,
+    visibleBuildingsMemo,
+    abstractedPathsSet,
   ]);
 
   // Optimized hit testing
@@ -1406,6 +1416,13 @@ function ArchitectureMapHighlightLayersInner({
       if (!canvasRef.current || !containerRef.current || !filteredCityData || zoomState.isDragging)
         return;
 
+      // Throttle hover updates to improve performance with large datasets
+      const now = performance.now();
+      if (now - lastHoverUpdateRef.current < HOVER_THROTTLE_MS) {
+        return;
+      }
+      lastHoverUpdateRef.current = now;
+
       // Get the container rect for mouse position
       const containerRect = containerRef.current.getBoundingClientRect();
       // Get mouse position relative to the container