# Only syntax highlighting? **URL:** \ **Category:** Uncategorized\ **Created:** [September 28, 2020, 3:43pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635 "2020-09-28T15:43:00Z")\ **Posts on this page:** 12\ **Page:** 1
**Author:** ![hutzlibu](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/hutzlibu/32/741_2.png) [@hutzlibu](https://discuss.codemirror.net/u/hutzlibu)\ **Post date:** [September 28, 2020, 3:43pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/1 "2020-09-28T15:43:00Z")
So basically I want CM to only create the html with syntax highlighting from a source string, but not invoke any editor functionality, as this would be overhead. (and performance is a factor, as the html then will be rasterized with the htmltocanvas libary and it can be lots of source code) Is there a simple way to do that? Or is the overhead of multiple CM-instances quite small, as long as they are not active? (one instance of CM will be in use) ---
**Author:** ![marijn](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/marijn/32/136_2.png) [@marijn](https://discuss.codemirror.net/u/marijn)\ **Post date:** [September 28, 2020, 7:11pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/2 "2020-09-28T19:11:56Z")
See the [runmode addon](https://codemirror.net/doc/manual.html#addon_runmode). ---
**Author:** ![hutzlibu](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/hutzlibu/32/741_2.png) [@hutzlibu](https://discuss.codemirror.net/u/hutzlibu)\ **Post date:** [September 28, 2020, 8:31pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/3 "2020-09-28T20:31:11Z")
Ah yes, thanks! ---
**Author:** ![justinfagnani](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/justinfagnani/32/755_2.png) [@justinfagnani](https://discuss.codemirror.net/u/justinfagnani)\ **Post date:** [October 3, 2020, 8:43pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/4 "2020-10-03T20:43:39Z")
Is there a way to do the same with CodeMirror 6? Edit: I should clarify - I’m trying to generate the highlighted markup in Node, not a browser. So far, I tried to get an EditorView up and running with domino in Node, but domino is missing too many APIs (MutationObserver, getSelection(), etc). Now I’m working on just forking Highlighter to not need an EditorView. Seems like that should ultimately work… ---
**Author:** ![marijn](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/marijn/32/136_2.png) [@marijn](https://discuss.codemirror.net/u/marijn)\ **Post date:** [October 4, 2020, 9:02am UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/5 "2020-10-04T09:02:49Z")
Not yet, but there’s no reason it should be difficult. This’d probably involve adding another export to the `highlight` module that just runs its highlighting logic over a tree and calls a function for each token. ---
**Author:** ![hutzlibu](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/hutzlibu/32/741_2.png) [@hutzlibu](https://discuss.codemirror.net/u/hutzlibu)\ **Post date:** [October 5, 2020, 7:38pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/6 "2020-10-05T19:38:45Z")
Sadly I cannot get him to run my prefered theme. (I want to use javascript and zenburn as the theme.) The options of the addon are somewhat confusing to me. Anyway, the addon seems to ignore any other options and just defaults by default? > ``` > CodeMirror.runMode = function(string, modespec, callback, options) { > var mode = CodeMirror.getMode(CodeMirror.defaults, modespec); > > ``` (the js syntax highlighting works, just not in my theme) ---
**Author:** ![justinfagnani](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/justinfagnani/32/755_2.png) [@justinfagnani](https://discuss.codemirror.net/u/justinfagnani)\ **Post date:** [October 5, 2020, 8:18pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/7 "2020-10-05T20:18:01Z")
I got something mostly working. I had to use a few internal APIs to get the syntaxes to register their rules against NodeTypes. I had to duplicate the default spec too to not trigger a code path that required an EditorView. If you’re interested in seeing what I did, I put up a rough gist here: [https://gist.github.com/justinfagnani/7d4a4acfc4dd00dde3c62db13731f68f](https://gist.github.com/justinfagnani/7d4a4acfc4dd00dde3c62db13731f68f) What’s left to do is serialize a StyleModule to CSS text. This will hopefully enable a nice workflow for us where we pre-build a code sample statically that’s upgraded to a full editor if the code loads on the client. ---
**Author:** ![hutzlibu](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/hutzlibu/32/741_2.png) [@hutzlibu](https://discuss.codemirror.net/u/hutzlibu)\ **Post date:** [October 8, 2020, 12:51pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/8 "2020-10-08T12:51:27Z")
I simply overwrote the codemirror.cscs stylesheet, as I am only using one style for now … ---
**Author:** ![borkdude](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/borkdude/32/614_2.png) [@borkdude](https://discuss.codemirror.net/u/borkdude)\ **Post date:** [November 6, 2021, 10:42am UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/9 "2021-11-06T10:42:10Z")
I wrote a blog post about how I used CodeMirror 6 to get better Clojure highlighting for my blog. The solution yields about 200kb of minified JS. I’m watching this space how to get it further down. [https://blog.michielborkent.nl/better-clojure-highlighting.html](https://blog.michielborkent.nl/better-clojure-highlighting.html) ---
**Author:** ![borkdude](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/borkdude/32/614_2.png) [@borkdude](https://discuss.codemirror.net/u/borkdude)\ **Post date:** [November 6, 2021, 3:27pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/10 "2021-11-06T15:27:38Z")
Btw, here is the JS code: [blog/main.js at main · borkdude/blog · GitHub](https://github.com/borkdude/blog/blob/main/src/clojure_highlighter/main.js) I suspect anything related to `Editor*` can be cut out somehow since the only thing I need to do is turn text into HTML with CSS. Any hints on how to do this will be helpful. ---
**Author:** ![blh](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/blh/32/4521_2.png) [@blh](https://discuss.codemirror.net/u/blh)\ **Post date:** [November 6, 2021, 7:13pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/11 "2021-11-06T19:13:21Z")
Import wise you only need the highlight module but that does have editor state and view as dependencies [Static highlighting using CM v6](https://discuss.codemirror.net/t/static-highlighting-using-cm-v6/3420) ---
**Author:** ![borkdude](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/borkdude/32/614_2.png) [@borkdude](https://discuss.codemirror.net/u/borkdude)\ **Post date:** [November 6, 2021, 8:23pm UTC](https://discuss.codemirror.net/t/only-syntax-highlighting/2635/12 "2021-11-06T20:23:33Z")
Thank you! I followed your approach [here](https://github.com/borkdude/blog/blob/50f0f0434b4a17cc2edfbf41332e53da8df5c8b4/src/clojure_highlighter/main.js). It doesn’t do the highlighting yet, but it renders back span elements with some classes attached to the DOM. The text looks black, but this just something to figure out (EDIT: I figured it out, you need to include the CodeMirror CSS). However, the bundle size is still pretty much the same: 200kb.