He configurado el código para cambiar la propiedad de transformación en React. Inicialmente, se establece en --scaleX como 1, luego, después de 6 segundos, primero setTimeout, cámbielo a 0 y 6 segundos después (es decir, 12 segundos desde el inicio), setInterval se activa y se ejecuta cada 12 segundos, haciendo también un cambio de ese estilo cada 6 segundos (la duración total de setInterval es de 12 segundos). Una muestra del código se muestra a continuación.

 useEffect(() => { setTimeout(() => { redRef.current.style.setProperty("--scale", "scaleX(0)"); }, 6000); let repeatSec = setInterval(() => { redRef.current.style.setProperty("--scale", "scaleX(1)"); setTimeout(() => { redRef.current.style.setProperty("--scale", "scaleX(0)"); }, 6000); }, 12000); return () => { clearInterval(repeatSec); }; }, []);

Pero, aunque he borrado el intervalo, la página funciona y el estilo cambia cada 6 segundos, pero la página parpadea constantemente de forma extraña. Por ejemplo, de repente todo desaparece y se vuelve blanco, pero vuelve cuando me desplazo hacia arriba/abajo.

Además, se produce parpadeo en algunos lugares de todo el sitio.

¿Por qué sucede eso y qué debo corregir aquí para evitarlo?