"use client"; import { memo, useEffect, useState } from "react"; interface HeroDecorProps { className?: string; } const HeroDecor = memo(({ className = "" }) => { const [grainEnabled, setGrainEnabled] = useState(false); useEffect(() => { // feTurbulence forces tiled rasterization that reads as top-down segments on // first paint. Flat shapes render immediately; grain applies after paint. const frame = requestAnimationFrame(() => { setGrainEnabled(true); }); return () => cancelAnimationFrame(frame); }, []); return ( ); }); HeroDecor.displayName = "HeroDecor"; export default HeroDecor;