perf(playground): code improvements

[vramana]

Summary

Fixes #2856

• Updated Vite to version 2.9 to add worker support.
• Updated vite-plugin-svgr to be compatible with Vite 2.9
• Use react-codemirror instead of react-textarea-code-editor
• Move formatting from rome and prettier into seperate workers

Test Plan

[vramana]

There are too many unnecessary code changes. I will fix them a little later.

[vramana]

Before:

Screencast.from.07-12-2022.12.30.39.PM.webm.mov

After:

Screencast.from.07-12-2022.12.29.30.PM.webm.mov

In the after video, you can see characters appearing as I type. The recording is stil choppy on my computer. You can test it either locally or on deployment to feel the difference.

[IWANABETHATGUY]

I notice that you use lang-javascript, does this package support jsx, tsx syntax ?

[vramana]

Yes.

[ematipico]

I tried to run the app locally, and it seems there's errors in Firefox:

The error is weird though, because the source code has the import at the top level of the code. So probably there's some transformation that breaks in firefox, or maybe it's a bug in firefox

[vramana]

Apparently firefox is the hold out here.

It doesn't work in dev (Vite restriction) but works in production. vitejs/vite#4586 (comment)

[vramana]

@ematipico Can you approve workflow so the CI can run?

[ematipico]

CI is failing, there's some code not formatted. Just run the command format:rome and you should be fine. The last diagnostic is a false positive that we fixed in main, so you can ignore it

[vramana]

@ematipico Done