Accessing nested state with path known only at runtime

[pprimm]

I'm using dlv/dset to access/set nested state unknown at design-time by proving a string path to the particular state of interest (arbitrarily nested). These paths are known at runtime. This codesandbox seems to work...kinda.

I'm using 4 different silly component types to show different ways of accessing the nested state. dlv may not be suggested/supported as I'm seeing "double-renders" in the nested useSnapshot(...) access. At the same time, however, HeaderType3 accesses the sub3 nested state in the "traditional" manner of useSnapshot(state) with static-path nested access; yet still indicates a double render.

Am I not "really" seeing double-renders? Render counts seem to be accurate because HeaderType4 only renders once and accesses nested state using dlv technique. I tried several different things to product different results; but no different outcome.

Is there a supported pattern to access nested state only known at runtime?

[dai-shi]

Hi, I didn't looked into 4 different types of components yet, but noticed you counted renders instead of effects.

Please check this and see how it behaves as expected, or not:
https://codesandbox.io/s/valtio-by-ref-forked-gd1xgy?file=/src/App.js

Is there a supported pattern to access nested state only known at runtime?

Both patterns should work:

useSnapshot(state[name])
useSnapshot(state)[name]

If state[name] doesn't change, the former is more efficient because its subscription is narrower.