I recommend the first one as its very easy to use and supports RSC

I really like it. Used it to highlight code and it's very pleasant experience

But do you know any way to use Shiki to make an editable highlighter? Like codemirror but autocomplete isn't necessary

Just the highlight of code in a textarea for eg

you can try the approach used by [shiki's website](https://shiki.style). it's quite ingenious:

* you make a relatively positioned div.
* you render shiki inside the div
* you render a textarea element with transparent text colour on top of shiki

That sounds like a good approach. I was looking at your website's code right now and it seems like you used the same method

i also use that exact same method [on my website](https://joulev.dev/apps/snippets), so if you want nextjs code for reference it's available: https://github.com/joulev/website/blob/main/src/app/(public)/apps/snippets/editor.tsx

yes exactly

Thanks for the help 🙂

keep in mind though that it does add a lot to the bundle size

Well that is totally expected and I guess it's ok because it will be heavy

yeah indeed, shiki is designed to be beautiful, not lightweight

Also I don't think if it will impact performance much 🤔

I mean not in a way that the user has to wait for like 10-20 seconds for the editor

yeah, it's not disastrously bad. for most users nowadays the perf hit won't even be noticeable

yup

but you wont get the little green numbers in the build log lol

it will likely be red but it's ok

yea I expected that lol