reduced flashlite after video transition

This commit is contained in:
Dmitri 2026-04-14 15:43:50 +04:00
parent 0da1c02b60
commit fc624c0700
3 changed files with 29 additions and 19 deletions

View File

@ -330,17 +330,22 @@ export default function RuntimePresentation({
}, [selectedPage?.background_image_url, selectedPage?.background_video_url]); }, [selectedPage?.background_image_url, selectedPage?.background_video_url]);
// Video transition overlay removal - instant (no fade) when background is ready // Video transition overlay removal - instant (no fade) when background is ready
// This ensures UI elements have time to appear before we remove the transition overlay // Uses double RAF to ensure browser has painted the new background before removing overlay
useEffect(() => { useEffect(() => {
if (pendingTransitionComplete && isBackgroundReady) { if (pendingTransitionComplete && isBackgroundReady) {
// Background is ready - instantly remove transition overlay (no fade) // Wait for paint cycle to complete before removing overlay
const video = transitionVideoRef.current; // Double RAF ensures the new background is fully rendered
if (video) { requestAnimationFrame(() => {
video.removeAttribute('src'); requestAnimationFrame(() => {
video.load(); const video = transitionVideoRef.current;
} if (video) {
setTransitionPreview(null); video.removeAttribute('src');
setPendingTransitionComplete(false); video.load();
}
setTransitionPreview(null);
setPendingTransitionComplete(false);
});
});
} }
}, [pendingTransitionComplete, isBackgroundReady]); }, [pendingTransitionComplete, isBackgroundReady]);

View File

@ -53,7 +53,7 @@ export const getBrowserInfo = (): BrowserInfo => {
// iOS Safari detection // iOS Safari detection
const isIOSSafari = const isIOSSafari =
/iPad|iPhone|iPod/.test(ua) && !('MSStream' in window as unknown); /iPad|iPhone|iPod/.test(ua) && !(('MSStream' in window) as unknown);
// Chrome detection (includes Chromium-based browsers except Edge) // Chrome detection (includes Chromium-based browsers except Edge)
const isChrome = /chrome/i.test(ua) && !/edg/i.test(ua); const isChrome = /chrome/i.test(ua) && !/edg/i.test(ua);

View File

@ -373,17 +373,22 @@ const ConstructorPage = ({ mode = 'constructor' }: ConstructorPageProps) => {
}); });
// Video transition overlay removal - instant (no fade) when background is ready // Video transition overlay removal - instant (no fade) when background is ready
// This ensures UI elements have time to appear before we remove the transition overlay // Uses double RAF to ensure browser has painted the new background before removing overlay
useEffect(() => { useEffect(() => {
if (pendingTransitionComplete && isBackgroundReady) { if (pendingTransitionComplete && isBackgroundReady) {
// Background is ready - instantly remove transition overlay (no fade) // Wait for paint cycle to complete before removing overlay
const video = transitionVideoRef.current; // Double RAF ensures the new background is fully rendered
if (video) { requestAnimationFrame(() => {
video.removeAttribute('src'); requestAnimationFrame(() => {
video.load(); const video = transitionVideoRef.current;
} if (video) {
closeTransitionPreview(); video.removeAttribute('src');
setPendingTransitionComplete(false); video.load();
}
closeTransitionPreview();
setPendingTransitionComplete(false);
});
});
} }
}, [pendingTransitionComplete, isBackgroundReady, closeTransitionPreview]); }, [pendingTransitionComplete, isBackgroundReady, closeTransitionPreview]);