I have a very weird issue. I am doing a basic animation like (with framer-motion 5.5.5 and tailwindcss 2.2.16):
<motion.div
className="w-2/3 h-96 bg-red-500 absolute left-10 top-10"
initial={{ x: 2700 }}
animate={{ x: 0 }}
transition={{
type: "spring",
stiffness: 80,
delay: 0.6,
damping: 15,
}}
></motion.div>
The problem with this animation is that on Edge it lags/freezes a tiny amount in the ending. On any other browser like Chrome and Firefox, the animation is very smooth. The weird part is that if I am using the Edge Incognito mode (InPrivate) the animation is smooth without any lag or freeze.
I have to specify that I am returning the above element in index.js so nothing else it's interfering.
My node version is v16.13.1 and my npm version is 8.1.2.