Removed unused imports

app/components/Hero.tsx

@@ -8,23 +8,29 @@ function useGridSize() {
   const [gridSize, setGridSize] = useState({ cols: 20, rows: 12 });
 
   useEffect(() => {
+    let timeout: ReturnType<typeof setTimeout>;
     const updateGridSize = () => {
       const width = window.innerWidth;
       if (width < 640) {
-        // Mobile
         setGridSize({ cols: 8, rows: 10 });
       } else if (width < 1024) {
-        // Tablet
         setGridSize({ cols: 12, rows: 10 });
       } else {
-        // Desktop
         setGridSize({ cols: 20, rows: 12 });
       }
     };
 
+    const debouncedUpdate = () => {
+      clearTimeout(timeout);
+      timeout = setTimeout(updateGridSize, 150);
+    };
+
     updateGridSize();
-    window.addEventListener("resize", updateGridSize);
-    return () => window.removeEventListener("resize", updateGridSize);
+    window.addEventListener("resize", debouncedUpdate);
+    return () => {
+      clearTimeout(timeout);
+      window.removeEventListener("resize", debouncedUpdate);
+    };
   }, []);
 
   return gridSize;
@@ -68,6 +74,7 @@ function TileGrid() {
 
   return (
     <div
+      key={`grid-${cols}-${rows}`}
       ref={gridRef}
       className="absolute inset-0 grid z-0"
       style={{
@@ -88,7 +95,6 @@ function TileGrid() {
             className="w-full h-full relative"
             style={{ 
               transformStyle: "preserve-3d",
-              willChange: "transform",
             }}
           >
             {/* Front - Black */}