DEV Community

Discussion on: Monaco Vs CodeMirror in React

 
greggman profile image
Greggman

That's kind of waste though. Using either one is downloading megs of javascript just to display some static code (because read-only). For read only, either use something like highlight.js (at build time or on the page) and simple CSS. Much better for users than having them download megs of js to display read-only code.

Thread Thread
 
veerasrivastava profile image
Veera Srivastava • Edited

Yup, you are right but it is an alternative, also, Codemirror is Used in devtools for various browsers like Chrome and Firefox, and is sponsored by codepen and many other big organisations, this gives an assurance that this third party library is not going to go anywhere without notice and ghost and break my application, as you wouldn't believe that these browsers would rely on something so weak that it runs out of service so soon, also I used to use codemirror when I was very new as if you go to youtube to learn something, you'd find tonnes of quality content relying around code mirror, the only thing is that codemirror as such a big market that it won't be broken very easily, with that being said monaco-editor does come from Microsoft and hence will not break anyways but codemirror is old and has a big market which is probably the main reason why people are using it extensively till date.

Thread Thread
 
miriamso profile image
Miriam Soloveichik

Using Monaco is not waste.
With monaco-editor-webpack-plugin it's easy to remove irrelevant features from Monaco (like edit, autocomplete, etc.) so it's not that heavy
For long code snippets with folder structures the Monaco has better user experience than code-mirror