Could you explain when react-spring will be "declarative" and have a lot of re-rendering?

[blueskybreeze]

Could you explain when react-spring will be "declarative" and have a lot of re-rendering?

These examples:
https://codesandbox.io/s/react-spring-most-basic-yv274
https://codesandbox.io/s/react-spring-number-updates-32d7y

They only render once (as seen in console.log. That's really too magical, especially in example 2, where the number actually change on the page, but then it does not involve re-rendering, which is the most fundamental way how ReactJS works.

Can you give a simple example when it will have a lot of re-rendering?
I have a complicated example: https://codesandbox.io/s/musing-dew-9tfi9?file=/src/App.tsx
but I don't know how I can make it re-render a lot in a simple example.

This is so that I can explain to other people (and perhaps write a blog) as to when will react-spring re-render a lot and when it will only re-render once.

Can you also explain the "magic" as to, why can you even change the number on the page (in example 2 above), without needing the component to re-render? That seems like totally against the way React works (by re-rendering). Is it by animated.div which is somehow a Pure Component? And then you somehow "short circuit" and directly go in and alter the DOM underneath it?

Or that it is not a Pure Component, but just a regular component, but somehow, you set a useEffect and setInterval to update the DOM subtree underneath it?