Fix/use editor state inside canvas

[balazsbajorics]

Problem:
When anything in the projectContents changes, the DerivedState.remixData gets recreated. (This should be improved to only recreate the remixData if we actually change the file-based routing)

The UtopiaRemixRootComponent uses illegal (🙂) useEditorState hooks to access DerivedState.remixData.

Since DerivedState.remixData is referentially new, the useEditorState hooks will trigger a re-render of every UtopiaRemixRootComponent.

The UtopiaRemixRootComponent rerenders then basically trigger an almost full rerender of the canvas before the "real" canvas rerender step.

on master:

with Sean's createExecutionScope cache fix (currently disabled and blocked by #6091):

On the image you can see that in the sample store's / route this takes 15ms every single frame.

Fix:
20ms -> 10ms -> 5ms

When the canvas is in selective rerender mode, DO NOT let UtopiaRemixRootComponent rerender itself. Not updating UtopiaRemixRootComponent during the selective mode should be safe, since the continuous canvas interactions never cause the file based routing or loaders etc to update.

Commit Details: (< vv pls delete this section if's not relevant)

• Wrapping the canvas in a EditorStateContext provider with the value forced to null which means we will throw an error in the future every time new code accidentally uses the useEditorState hooks (which are not compatible with selective re-rendering). Hopefully this means selective re-rendering will be less brittle in the future, but in a follow up PR I will write tests for this too
• Added new hook useCanvasState which is almost the same as useEditorState except it takes an extra callback allowRerender. If AllowRerender is false, then no matter what changes in the editor state, we will passively reject the component update and the hook will return the old state value.
• Using the new hook in utopia-remix-root-component
• Profit!

Notes:
This PR depends on #6091 because the selective re-rendering of the remix root component causes the same css issue as Sean's original #6076

Manual Tests:
I hereby swear that:

• I opened a hydrogen project and it loaded
• I could navigate to various routes in Preview mode

[github-actions]

Try me

[relativeci]

#13441 Bundle Size — 62.64MiB (~+0.01%).

28661d0(current) vs 6339ece master#13440(baseline)

Warning

Bundle contains 70 duplicate packages – View duplicate packages

Bundle metrics   4 changes 2 regressions

	Current #13441	Baseline #13440
Initial JS	45.71MiB(~+0.01%)	45.7MiB
Initial CSS	0B	0B
Cache Invalidation	21.54%	21.52%
Chunks	31	31
Assets	34	34
Modules	4376(+0.05%)	4374
Duplicate Modules	524(+0.19%)	523
Duplicate Code	31.69%	31.69%
Packages	469	469
Duplicate Packages	70	70

Bundle size by type   2 changes 1 regression 1 improvement

	Current #13441	Baseline #13440
JS	62.62MiB (~+0.01%)	62.62MiB
HTML	11.16KiB (-0.33%)	11.2KiB

---

Bundle analysis report Branch fix/use-editor-state-inside-canv... Project dashboard

[ruggi]

👍 👍