diff --git a/src/app/components/VirtualTour.tsx b/src/app/components/VirtualTour.tsx index 42e84b8..0427bf0 100644 --- a/src/app/components/VirtualTour.tsx +++ b/src/app/components/VirtualTour.tsx @@ -294,6 +294,23 @@ function directionFromYawPitch(yaw: number, pitch: number) { ); } +type IdleWindow = typeof window & { + requestIdleCallback?: (cb: () => void, opts?: { timeout: number }) => number; +}; + +// Lên lịch chạy lúc trình duyệt rảnh (fallback setTimeout) — dùng cho preload nền. +function scheduleIdle(cb: () => void) { + if (typeof window === "undefined") { + return; + } + const w = window as IdleWindow; + if (w.requestIdleCallback) { + w.requestIdleCallback(cb, { timeout: 2000 }); + } else { + window.setTimeout(cb, 400); + } +} + export default function VirtualTour({ tourId = "chua-thai-lac", }: { @@ -1282,13 +1299,16 @@ function TourExperience({ .catch(() => undefined); }; + // Cảnh hiện tại: tải ngay. Cảnh kề: lùi xuống lúc rảnh để không nghẽn khi vừa vào. preloadImage(scene.image); - scene.hotspots.forEach((hotspot) => { - const targetScene = tourConfig.sceneById.get(hotspot.targetId); + scheduleIdle(() => { + scene.hotspots.forEach((hotspot) => { + const targetScene = tourConfig.sceneById.get(hotspot.targetId); - if (targetScene) { - preloadImage(targetScene.image); - } + if (targetScene) { + preloadImage(targetScene.image); + } + }); }); }, [tourConfig, warmPanoramaTexture],