Migrate lexical-code from PrismJS to Shiki

facebook / lexical

Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance.

https://lexical.dev

MIT License

19.39k stars 1.64k forks source link

Migrate lexical-code from PrismJS to Shiki #6575

Open ivailop7 opened 1 month ago

ivailop7 commented 1 month ago

PrismJS appears to be no longer maintained and Shiki seems to be the closest maintained alternative for syntax highlighting. A number of people have suggested the migration and I agree it makes sense, primarily because PrismJS is not ESM and creates issues when used with certain server-side rendering frameworks.

etrepum commented 1 month ago

I have looked into this a little bit, the downsides are:

Shiki is larger since it brings in a wasm build of the oniguruma regex engine (~500kb gzip I think) required to support the TextMate grammars that all of the syntax highlighting is defined with https://shiki.style/guide/bundles
It's designed more for ahead-of-time highlighting rather than as-you-type highlighting
It uses inline style rather than semantic classes

Probably not a deal-breaker for everyone but I assume that there are many people that would prefer the dead-end prismjs solution at <100kb

ivailop7 commented 1 month ago

Not tied to the framework, but it appears everyone I've spoken to recently is switching to this one, short of Monaco and CodeMirror embeds. Size-wise - yes, 5x increase is significant. If there are other reasonable alternatives, I'm all ears.

etrepum commented 1 month ago

I didn't find anything better, which was disappointing. Maybe the ideal would be to properly divorce highlighting from the code node model so that either solution (or something bespoke, e.g. a custom treesitter based highlighter) could be used. For the most part it really is just a display concern, shouldn't need such tight coupling.

etrepum commented 1 month ago

Looks like https://github.com/wooorm/starry-night is a similar project to shiki but AST and class based

etrepum commented 1 month ago

Looks like the size concerns with Shiki are being addressed https://github.com/shikijs/shiki/pull/761

rockwotj commented 1 week ago

Also - could the list of languages be made pluggable? If I want to support a different subset of prism langauges than the existing lexical-code package, I have to fork or patch the list of languages. Would be awesome if I could customize that without the fork/patch.

etrepum commented 1 week ago

Given that everything in prism is global you should be able to add languages by importing them before you import lexical code. Removing them is a bit trickier but you could configure your bundler to make some of them return an empty module or to eliminate those imports altogether.