Highlight.js is slow

[tommy351]

Highlight.js is slow. After turning off the highlighting, the loading speed dropped from 46s to 16s. Maybe we should change another highlighting library or use SyntaxHighlighter or Prism to let browsers do this job.

[Xuanwo]

From my point of view, it is worthwhile sacrificing some loading time for a quicker open in browser.
And I don't know how much time browsers do this job will take, can you give out some data?

[tommy351]

Actually it's fast to do highlight on browsers, since browsers only need to render a page at a time and Hexo has to render hundreds of pages in a few seconds. It takes lots of CPU time to do this.

[Xuanwo]

OK, I will support your idea.

Since I use Travis CI to do this, so I'm not care about the time highlight.js used, hahaha

[iissnan]

Is there any other lib which has high performance than highlight.js on rendering pages?

[iissnan]

I mean rendering pages in command line, not in browsers.

[tommy351]

@iissnan Maybe we can give highlights a try. It's used by atom.

[iissnan]

@tommy351 Executed a simple performance test with hexo-util and highlights.

highlights spends only 1469, while hexo-util spends 3793.

LGTM.

[iissnan]

By the way, if this change has effect on theme highlight styles?
If yes, than this may be a breaking change, should be highlighted in release notes.

[tommy351]

hexo-util may run slow at the first time because it needs to load highlight.js. The speed may be faster after the first run.

The styles may need changes if we change the library.

[iissnan]

Sorry for the incorrect testing.
Using highlight.js instead of hexo-util, time drops to 3215.

[tommy351]

Thanks for the testing. I'll try to optimize that function.

[tommy351]

I just made a benchmark and this is the result:

[00:38:28]    highlight.js - auto detect x 33.79 ops/sec ±1.83% (61 runs sampled)
[00:38:34]    highlight.js - language set x 1,092 ops/sec ±1.46% (90 runs sampled)
[00:38:39]    util.highlight - auto detect x 34.44 ops/sec ±1.12% (62 runs sampled)
[00:38:45]    util.highlight - language set x 1,100 ops/sec ±1.54% (92 runs sampled)
[00:38:45] Fastest tests are util.highlight - language set,highlight.js - language set at 1.01x faster than highlight.js - language set

There's no large differences between them. Here's the source code: https://gist.github.com/tommy351/48401ae93dbf6aa2e94d

[tommy351]

And this is the test for highlights.

[00:46:25]    highlight.js - auto detect x 35.18 ops/sec ±2.72% (56 runs sampled)
[00:46:31]    highlight.js - language set x 1,042 ops/sec ±9.13% (77 runs sampled)
[00:46:37]    util.highlight - auto detect x 34.77 ops/sec ±1.15% (56 runs sampled)
[00:46:42]    util.highlight - language set x 1,162 ops/sec ±1.37% (89 runs sampled)
[00:46:48]    highlights x 2,098 ops/sec ±1.57% (87 runs sampled)
[00:46:48] Fastest test is highlights at 2.0x faster than highlight.js - language set and util.highlight - language set

P.S. highlights detects languages automatically.

[Xuanwo]

WOW, it's sound like highlights is good.

[zphj1987]

I tell the md the tab text what it is,like bash ,like raw ,the highlight make it so fast

[leesei]

Any plan to move to highlights?

Also see #1543.

[tommy351]

Remove highlight.js may need to update the stylesheet of all curernt themes.

[curbengh]

@hexojs/core
Continuing from hexojs/hexo-util#19 (comment).

What do you think of atom highlights? feasible?