Remove antipattern in animated.md

[poteto]

Reading or writing to a ref in render is a rule of React violation. This PR updates the docs for animated to use the useAnimatedValue hook instead, which does use a ref under the hood but initializes it lazily (which is ok).

[netlify[bot]]

✅ Deploy Preview for react-native ready!

Name	Link
🔨 Latest commit	b23f5a560e8bdf51ed826362c69b8af122c4893a
🔍 Latest deploy log	https://app.netlify.com/sites/react-native/deploys/66d08933c9239e000881242e
😎 Deploy Preview	https://deploy-preview-4200--react-native.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify[bot]]

✅ Deploy Preview for react-native ready!

Name	Link
🔨 Latest commit	f6728c47aa1bc43501c70f1f66be2c4cf9e6aa2e
🔍 Latest deploy log	https://app.netlify.com/sites/react-native/deploys/67225c7716c94d00087c26d5
😎 Deploy Preview	https://deploy-preview-4200--react-native.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[gsathya]

Isn't useAnimatedValue also reading ref.current in render? https://github.com/facebook/react-native/blob/8b2ccea243d8b8156d6f6e1e3e08b6064f82ed84/packages/react-native/Libraries/Animated/useAnimatedValue.js#L24

[poteto]

Isn't useAnimatedValue also reading ref.current in render? https://github.com/facebook/react-native/blob/8b2ccea243d8b8156d6f6e1e3e08b6064f82ed84/packages/react-native/Libraries/Animated/useAnimatedValue.js#L24

Yeah that's true. But updating the docs means that we can remove a Rule of React violation from user code, so if React Compiler is being used these components/hooks can still be compiled, while the offending useAnimatedValue will not (if we compile it).