From 9415bd0dc80be0b913d33746b7538318ab6b535b Mon Sep 17 00:00:00 2001
From: dttdrv <154076940+dttdrv@users.noreply.github.com>
Date: Thu, 2 Apr 2026 04:54:19 +0000
Subject: [PATCH] =?UTF-8?q?=E2=9A=A1=20bolt:=20cache=20photocarousel=20vis?=
 =?UTF-8?q?ibility?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

replace synchronous `getBoundingClientRect` call in `PhotoCarousel.isInView` with an async `IntersectionObserver` cache property to stop layout thrashing on rapid keydown events.
---
 script.js | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/script.js b/script.js
index 2d49f98..868c0fb 100644
--- a/script.js
+++ b/script.js
@@ -880,6 +880,7 @@ const PhotoCarousel = {
   currentIndex: 2, // Start with center card (index 2)
   positions: ['far-left', 'left', 'center', 'right', 'far-right'],
   isAnimating: false,
+  isVisible: false, // ⚡ bolt: cache visibility
 
   init() {
     this.carousel = document.getElementById('photo-carousel');
@@ -890,6 +891,14 @@ const PhotoCarousel = {
 
     if (!this.cards.length) return;
 
+    // ⚡ bolt: observe visibility to avoid synchronous getBoundingClientRect
+    const observer = new IntersectionObserver((entries) => {
+      entries.forEach(entry => {
+        this.isVisible = entry.isIntersecting;
+      });
+    }, { threshold: 0 }); // trigger as soon as any part enters/leaves
+    observer.observe(this.carousel);
+
     // Set initial caption
     this.updateCaption(this.currentIndex);
 
@@ -1044,9 +1053,7 @@ const PhotoCarousel = {
   },
 
   isInView() {
-    if (!this.carousel) return false;
-    const rect = this.carousel.getBoundingClientRect();
-    return rect.top < window.innerHeight && rect.bottom > 0;
+    return this.isVisible;
   },
 
   navigate(direction) {