Why chose client-side code highlighting over builtin server-side func?

[jostyee]

Hugo does support code highlighting since version 0.28 adopted from Chroma, by which we don't need the highlight javascript library to do the job, I wonder why @xianmin chose not to use it?

Some other themes for comparison:

• beautifulhugo: server/client side options
• hugo-nuo: Chroma
• hugo-kiera: Chroma

[xianmin]

Thanks for your feedback! This project Initial version is olOwOlo/hugo-theme-even. Hugo-theme-even use highlight.js library, and for me, the style of the show is not bad. So I did not modify it.

I haven't tested the Chroma yet. Maybe we can try it? :smile:

[jostyee]

Yeah, I guess it’s not complicated to add Chroma support.

Sent from my iPhone

On Apr 8, 2018, at 7:52 PM, Chen Xianmin notifications@github.com wrote:

Thanks for your feedback! This project Initial version is olOwOlo/hugo-theme-even. Hugo-theme-even use highlight.js library, and for me, the style of the show is not bad. So I did not modify it.

I haven't tested the =Chroma= yet. Maybe we can try it? 😄

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or mute the thread.

[jostyee]

IMHO server-side highlighting pros:

1. faster loading time
2. less 3rd-party dependencies, make it easier to maintain
3. friendly to some readability services(e.g. Instapaper cannot parse highlight.js code block properly)

while client-side highlighting can:

1. render more language syntaxes for now.

[xianmin]

Yes, less 3rd-party dependencies is better. If we choose Chroma finally, and if anyone still want use highlight.js , I think he could use custom head and custom.js do it.

The highlight.js works fine for now. If you are interested in switch to Chroma, maybe you could try it first, and I am very supportive. :smile:

[jostyee]

@xianmin You've hardcoded highlight invocations in main.js , which cannot be changed by config checks.

[xianmin]

If Chroma works fine, maybe we could remove all highlight.js related code. Or put it on hold first, wait for me to deal with this later.

[Zebradil]

I'd like to have this migration done. Tell me if anybody is working on this. If not, I can do it.

[jostyee]

@Zebradil I'm currently busy at my work, please give it a go if you have time, thanks.

[Zebradil]

@jostyee, I'll go for it this week then.

[Zebradil]

@xianmin, what is the highlight style used? It looks like solarized-light, but it's not the same.

Current style:

Solarized-light from https://github.com/john2x/solarized-pygment/:

[xianmin]

@Zebradil This highlight style is good! If anyone wants change the style, I think they could use custom css.

[jostyee]

@Zebradil great work, thanks. @xianmin Chroma has multiple syntax highlighting presets itself, see: https://help.farbox.com/pygments.html with pygmentsUseClasses = false

[Zebradil]

Another way to change style is to use hugo's gen command:

hugo gen chromastyles --style=native > style.css

With this approach it's possible to tune highlight style manually.