Does object destructuring affect Valtio's useSnapshot re-render optimisation

[codebycarlos]

According to the documentation:

"useSnapshot wraps the Valtio snapshot in an access-tracking proxy, so your component is render optimized, i.e. it will only re-render if keys that it (or its child components) specifically accessed have changed, and not on every single change to the proxy."

And the example..

function Counter() {
  const snap = useSnapshot(state)
  return (
    <div>
      {snap.count}
      <button
        onClick={() => {
          // also read from the state proxy in callbacks
          if (state.count < 10) {
            ++state.count
          }
        }}>
        +1
      </button>
    </div>
  )
}

My question is, if we replace the above with object destructuring (i.e. const { count } = useSnapshot(state)) would the optimisation still work as intended?

[codebycarlos]

Based on this, it appears the answer is no (doesn't affect optimisation).

[dai-shi]

My question is, if we replace the above with object destructuring (i.e. const { count } = useSnapshot(state)) would the optimisation still work as intended?

Yes, it still works as intended (= render optimized.)