Non-Local State Update in React: Proof-of-Concept

This App is a proof-of-concept to show how state can be updated within a component without needing prop drilling or context. It is best suited to a static component tree. The idea works as follows:

1. An ancestor component passes in a registration callback to a descendant component; passing in this registration callback will require prop drilling.
2. The descendant calls the registration function after the first render in an effect with empty dependencies. It will pass in an argument which is an updater function which allows updating selected parts of the descendant's state. This updater function is recorded within some data structure in the ancestor component.
3. When the ancestor component finishes its first render, it records the data structure within its state (or a ref).
4. Subsequently, whenever the ancestor wishes to update the state of the descendant, it simply calls the updated function.

App