fix: support react compiler for auto updating studios

[stipsan]

Description

When using both autoUpdates: true and reactCompiler: {target: '18' | '19'} then only userland custom studio code is compiled, while the sanity and @sanity/vision modules are not.
I thought we were pulling these packages off of npm, I wasn't aware they had their own vite pipeline 😅
It turns out that if autoUpdates: true is in use, then the sanity and @sanity/vision code isn't pre-compiled by React Compiler.

What to review

I'm not super familiar with how this pipeline is setup, so I hope it's the right place 😮‍💨

Testing

I don't know how we can test this e2e without publishing. I've verified that other libraries that are pushed out, like @sanity/ui, as well as custom studio code, works just fine with autoUpdates: true, as seen in the community studio for example. I see no reason it should fail for sanity and @sanity/vision.

Notes for release

When using autoUpdates: true the sanity and @sanity/vision were no longer using pre-compiled code auto-memoized by the React Compiler. Leading to slower perf. It doesn't make sense to be forced to choose between fastest possible studio vs lowest effort maintenance. You can, and should, have your cake and eat it too 🍰

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
performance-studio	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 28, 2024 0:50am
test-studio	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 28, 2024 0:50am

3 Skipped Deployments

Name	Status	Preview	Comments	Updated (UTC)
studio-workshop	⬜️ Ignored (Inspect)			Nov 28, 2024 0:50am
page-building-studio	⬜️ Skipped (Inspect)			Nov 28, 2024 0:50am
test-next-studio	⬜️ Skipped (Inspect)			Nov 28, 2024 0:50am

[github-actions]

No changes to documentation

[github-actions]

Component Testing Report Updated Nov 28, 2024 12:56 AM (UTC)

✅ All Tests Passed -- expand for details

File	Status	Duration	Passed	Skipped	Failed
comments/CommentInput.spec.tsx	✅ Passed (Inspect)	51s	15	0	0
formBuilder/ArrayInput.spec.tsx	✅ Passed (Inspect)	9s	3	0	0
formBuilder/inputs/PortableText/Annotations.spec.tsx	✅ Passed (Inspect)	32s	6	0	0
formBuilder/inputs/PortableText/copyPaste/CopyPaste.spec.tsx	✅ Passed (Inspect)	39s	11	7	0
formBuilder/inputs/PortableText/copyPaste/CopyPasteFields.spec.tsx	✅ Passed (Inspect)	0s	0	12	0
formBuilder/inputs/PortableText/Decorators.spec.tsx	✅ Passed (Inspect)	18s	6	0	0
formBuilder/inputs/PortableText/DisableFocusAndUnset.spec.tsx	✅ Passed (Inspect)	10s	3	0	0
formBuilder/inputs/PortableText/DragAndDrop.spec.tsx	✅ Passed (Inspect)	3m 0s	0	0	0
formBuilder/inputs/PortableText/FocusTracking.spec.tsx	✅ Passed (Inspect)	46s	15	0	0
formBuilder/inputs/PortableText/Input.spec.tsx	✅ Passed (Inspect)	1m 47s	21	0	0
formBuilder/inputs/PortableText/ObjectBlock.spec.tsx	✅ Passed (Inspect)	1m 17s	18	0	0
formBuilder/inputs/PortableText/PresenceCursors.spec.tsx	✅ Passed (Inspect)	9s	3	9	0
formBuilder/inputs/PortableText/RangeDecoration.spec.tsx	✅ Passed (Inspect)	27s	9	0	0
formBuilder/inputs/PortableText/Styles.spec.tsx	✅ Passed (Inspect)	18s	6	0	0
formBuilder/inputs/PortableText/Toolbar.spec.tsx	✅ Passed (Inspect)	37s	12	0	0
formBuilder/tree-editing/TreeEditing.spec.tsx	✅ Passed (Inspect)	0s	0	3	0
formBuilder/tree-editing/TreeEditingNestedObjects.spec.tsx	✅ Passed (Inspect)	0s	0	3	0

[github-actions]

⚡️ Editor Performance Report

Updated Thu, 28 Nov 2024 00:58:50 GMT

Benchmark	reference latency of sanity@latest	experiment latency of this branch	Δ (%) latency difference
article (title)	23.8 efps (42ms)	24.4 efps (41ms)	-1ms (-2.4%)	✅
article (body)	59.3 efps (17ms)	60.1 efps (17ms)	-0ms (-1.2%)	✅
article (string inside object)	25.6 efps (39ms)	25.6 efps (39ms)	+0ms (-/-%)	✅
article (string inside array)	23.3 efps (43ms)	21.7 efps (46ms)	+3ms (+7.0%)	✅
recipe (name)	50.0 efps (20ms)	47.6 efps (21ms)	+1ms (+5.0%)	✅
recipe (description)	58.8 efps (17ms)	55.6 efps (18ms)	+1ms (+5.9%)	✅
recipe (instructions)	99.9+ efps (6ms)	99.9+ efps (6ms)	+0ms (-/-%)	✅
synthetic (title)	18.5 efps (54ms)	18.2 efps (55ms)	+1ms (+1.9%)	✅
synthetic (string inside object)	19.4 efps (52ms)	19.2 efps (52ms)	+1ms (+1.0%)	✅

efps — editor "frames per second". The number of updates assumed to be possible within a second.

Derived from input latency. efps = 1000 / input_latency

Detailed information

🏠 Reference result

The performance result of sanity@latest

Benchmark	latency	p75	p90	p99	blocking time	test duration
article (title)	42ms	49ms	55ms	192ms	292ms	13.1s
article (body)	17ms	19ms	30ms	105ms	254ms	5.7s
article (string inside object)	39ms	42ms	49ms	338ms	261ms	7.2s
article (string inside array)	43ms	47ms	55ms	184ms	281ms	7.5s
recipe (name)	20ms	22ms	33ms	45ms	0ms	7.5s
recipe (description)	17ms	19ms	22ms	27ms	0ms	4.5s
recipe (instructions)	6ms	8ms	9ms	9ms	0ms	3.2s
synthetic (title)	54ms	57ms	63ms	408ms	737ms	13.7s
synthetic (string inside object)	52ms	56ms	78ms	512ms	1015ms	8.5s

🧪 Experiment result

The performance result of this branch

Benchmark	latency	p75	p90	p99	blocking time	test duration
article (title)	41ms	44ms	52ms	205ms	230ms	11.4s
article (body)	17ms	19ms	31ms	88ms	48ms	5.2s
article (string inside object)	39ms	43ms	50ms	189ms	376ms	7.2s
article (string inside array)	46ms	50ms	60ms	241ms	287ms	7.9s
recipe (name)	21ms	22ms	27ms	41ms	0ms	7.0s
recipe (description)	18ms	20ms	21ms	28ms	0ms	4.6s
recipe (instructions)	6ms	8ms	9ms	9ms	0ms	3.1s
synthetic (title)	55ms	58ms	71ms	371ms	746ms	13.8s
synthetic (string inside object)	52ms	54ms	62ms	440ms	142ms	8.3s

📚 Glossary

column definitions

• benchmark — the name of the test, e.g. "article", followed by the label of the field being measured, e.g. "(title)".
• latency — the time between when a key was pressed and when it was rendered. derived from a set of samples. the median (p50) is shown to show the most common latency.
• p75 — the 75th percentile of the input latency in the test run. 75% of the sampled inputs in this benchmark were processed faster than this value. this provides insight into the upper range of typical performance.
• p90 — the 90th percentile of the input latency in the test run. 90% of the sampled inputs were faster than this. this metric helps identify slower interactions that occurred less frequently during the benchmark.
• p99 — the 99th percentile of the input latency in the test run. only 1% of sampled inputs were slower than this. this represents the worst-case scenarios encountered during the benchmark, useful for identifying potential performance outliers.
• blocking time — the total time during which the main thread was blocked, preventing user input and UI updates. this metric helps identify performance bottlenecks that may cause the interface to feel unresponsive.
• test duration — how long the test run took to complete.