diff --git a/components/blocks/HeroVideo.tsx b/components/blocks/HeroVideo.tsx index d8c2281dd..5dc96b6b0 100644 --- a/components/blocks/HeroVideo.tsx +++ b/components/blocks/HeroVideo.tsx @@ -41,6 +41,15 @@ export function HeroVideo(props: HeroVideoProps) { const secondaryCtaLabel = props.secondaryCtaLabel || data?.secondaryCtaLabel || (currentLocale === 'de' ? 'Projekt anfragen' : 'Inquire Project'); const secondaryCtaHref = props.secondaryCtaHref || data?.secondaryCtaHref || `/${currentLocale}/contact`; + const [videoSrcLoaded, setVideoSrcLoaded] = useState(false); + useEffect(() => { + // Delay loading the video until after the page has visually painted the LCP image + const timer = setTimeout(() => { + setVideoSrcLoaded(true); + }, 500); + return () => clearTimeout(timer); + }, []); + return (
{/* Background color while video loads */} @@ -57,17 +66,17 @@ export function HeroVideo(props: HeroVideoProps) { priority /> - {/* Render video on top if available, but don't force aggressive preload */} + {/* Render video on top if available, but defer src to avoid blocking LCP */} {videoUrl && (