mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2024-11-21 17:26:29 -05:00
Lazy-load highlight.js
This commit moves the import of highlight.js into a `require.ensure` block, that is only executed when a code-block is actually present in a note. Webpack automatically splits the library into a separate chunk and loads that on demand. The call to `hljs.listLanguages()` in `index.js` is also replaced by a static list. This is important, as `index.js` would otherwise need to import highlight.js, which would cause the quite big library to be included into nearly every entrypoint, needlessly increasing the transferred code size. Signed-off-by: David Mehren <git@herrmehren.de>
This commit is contained in:
David Mehren
parent
5b8b76135b
commit
7ff685933e
3 changed files with 201 additions and 39 deletions
|
|
@ -3,7 +3,6 @@
|
|||
/* global moment, serverurl */
|
||||
|
||||
import Prism from 'prismjs'
|
||||
import hljs from 'highlight.js'
|
||||
import PDFObject from 'pdfobject'
|
||||
import S from 'string'
|
||||
import { saveAs } from 'file-saver'
|
||||
|
|
@ -525,13 +524,19 @@ export function finishView (view) {
|
|||
value: Prism.highlight(code, Prism.languages.makefile)
|
||||
}
|
||||
} else {
|
||||
code = S(code).unescapeHTML().s
|
||||
const languages = hljs.listLanguages()
|
||||
if (!languages.includes(reallang)) {
|
||||
result = hljs.highlightAuto(code)
|
||||
} else {
|
||||
result = hljs.highlight(reallang, code)
|
||||
}
|
||||
require.ensure([], function (require) {
|
||||
const hljs = require('highlight.js')
|
||||
code = S(code).unescapeHTML().s
|
||||
const languages = hljs.listLanguages()
|
||||
if (!languages.includes(reallang)) {
|
||||
result = hljs.highlightAuto(code)
|
||||
} else {
|
||||
result = hljs.highlight(reallang, code)
|
||||
}
|
||||
if (codeDiv.length > 0) codeDiv.html(result.value)
|
||||
else langDiv.html(result.value)
|
||||
})
|
||||
return
|
||||
}
|
||||
if (codeDiv.length > 0) codeDiv.html(result.value)
|
||||
else langDiv.html(result.value)
|
||||
|
|
|
|||
|
|
@ -18,7 +18,6 @@ import { ot } from '../vendor/ot/ot.min.js'
|
|||
import { saveAs } from 'file-saver'
|
||||
import randomColor from 'randomcolor'
|
||||
import store from 'store'
|
||||
import hljs from 'highlight.js'
|
||||
import url from 'wurl'
|
||||
import { Spinner } from 'spin.js'
|
||||
|
||||
|
|
@ -106,36 +105,198 @@ const cursorActivityDebounce = 50
|
|||
const cursorAnimatePeriod = 100
|
||||
const supportContainers = ['success', 'info', 'warning', 'danger']
|
||||
const supportCodeModes = [
|
||||
'javascript',
|
||||
'typescript',
|
||||
'jsx',
|
||||
'htmlmixed',
|
||||
'htmlembedded',
|
||||
'css',
|
||||
'xml',
|
||||
'clike',
|
||||
'1c',
|
||||
'abnf',
|
||||
'accesslog',
|
||||
'actionscript',
|
||||
'ada',
|
||||
'angelscript',
|
||||
'apache',
|
||||
'applescript',
|
||||
'arcade',
|
||||
'arduino',
|
||||
'armasm',
|
||||
'asciidoc',
|
||||
'aspectj',
|
||||
'autohotkey',
|
||||
'autoit',
|
||||
'avrasm',
|
||||
'awk',
|
||||
'axapta',
|
||||
'bash',
|
||||
'basic',
|
||||
'bnf',
|
||||
'brainfuck',
|
||||
'cal',
|
||||
'capnproto',
|
||||
'ceylon',
|
||||
'c',
|
||||
'clean',
|
||||
'c-like',
|
||||
'clojure',
|
||||
'ruby',
|
||||
'python',
|
||||
'shell',
|
||||
'php',
|
||||
'sql',
|
||||
'haskell',
|
||||
'coffeescript',
|
||||
'yaml',
|
||||
'pug',
|
||||
'lua',
|
||||
'clojure-repl',
|
||||
'cmake',
|
||||
'nginx',
|
||||
'perl',
|
||||
'sass',
|
||||
'r',
|
||||
'coffeescript',
|
||||
'coq',
|
||||
'cos',
|
||||
'cpp',
|
||||
'crmsh',
|
||||
'crystal',
|
||||
'csharp',
|
||||
'csp',
|
||||
'css',
|
||||
'dart',
|
||||
'delphi',
|
||||
'diff',
|
||||
'django',
|
||||
'd',
|
||||
'dns',
|
||||
'dockerfile',
|
||||
'tiddlywiki',
|
||||
'mediawiki',
|
||||
'dos',
|
||||
'dsconfig',
|
||||
'dts',
|
||||
'dust',
|
||||
'ebnf',
|
||||
'elixir',
|
||||
'elm',
|
||||
'erb',
|
||||
'erlang',
|
||||
'erlang-repl',
|
||||
'excel',
|
||||
'fix',
|
||||
'flix',
|
||||
'fortran',
|
||||
'fsharp',
|
||||
'gams',
|
||||
'gauss',
|
||||
'gcode',
|
||||
'gherkin',
|
||||
'glsl',
|
||||
'gml',
|
||||
'go',
|
||||
'gherkin'
|
||||
].concat(hljs.listLanguages())
|
||||
'golo',
|
||||
'gradle',
|
||||
'groovy',
|
||||
'haml',
|
||||
'handlebars',
|
||||
'haskell',
|
||||
'haxe',
|
||||
'hsp',
|
||||
'htmlbars',
|
||||
'http',
|
||||
'hy',
|
||||
'inform7',
|
||||
'ini',
|
||||
'irpf90',
|
||||
'isbl',
|
||||
'java',
|
||||
'javascript',
|
||||
'jboss-cli',
|
||||
'json',
|
||||
'julia',
|
||||
'julia-repl',
|
||||
'kotlin',
|
||||
'lasso',
|
||||
'latex',
|
||||
'ldif',
|
||||
'leaf',
|
||||
'less',
|
||||
'lisp',
|
||||
'livecodeserver',
|
||||
'livescript',
|
||||
'llvm',
|
||||
'lsl',
|
||||
'lua',
|
||||
'makefile',
|
||||
'markdown',
|
||||
'mathematica',
|
||||
'matlab',
|
||||
'maxima',
|
||||
'mel',
|
||||
'mercury',
|
||||
'mipsasm',
|
||||
'mizar',
|
||||
'mojolicious',
|
||||
'monkey',
|
||||
'moonscript',
|
||||
'n1ql',
|
||||
'nginx',
|
||||
'nim',
|
||||
'nix',
|
||||
'node-repl',
|
||||
'nsis',
|
||||
'objectivec',
|
||||
'ocaml',
|
||||
'openscad',
|
||||
'oxygene',
|
||||
'parser3',
|
||||
'perl',
|
||||
'pf',
|
||||
'pgsql',
|
||||
'php',
|
||||
'php-template',
|
||||
'plaintext',
|
||||
'pony',
|
||||
'powershell',
|
||||
'processing',
|
||||
'profile',
|
||||
'prolog',
|
||||
'properties',
|
||||
'protobuf',
|
||||
'puppet',
|
||||
'purebasic',
|
||||
'python',
|
||||
'python-repl',
|
||||
'q',
|
||||
'qml',
|
||||
'reasonml',
|
||||
'rib',
|
||||
'r',
|
||||
'roboconf',
|
||||
'routeros',
|
||||
'rsl',
|
||||
'ruby',
|
||||
'ruleslanguage',
|
||||
'rust',
|
||||
'sas',
|
||||
'scala',
|
||||
'scheme',
|
||||
'scilab',
|
||||
'scss',
|
||||
'shell',
|
||||
'smali',
|
||||
'smalltalk',
|
||||
'sml',
|
||||
'sqf',
|
||||
'sql',
|
||||
'sql_more',
|
||||
'stan',
|
||||
'stata',
|
||||
'step21',
|
||||
'stylus',
|
||||
'subunit',
|
||||
'swift',
|
||||
'taggerscript',
|
||||
'tap',
|
||||
'tcl',
|
||||
'thrift',
|
||||
'tp',
|
||||
'twig',
|
||||
'typescript',
|
||||
'vala',
|
||||
'vbnet',
|
||||
'vbscript-html',
|
||||
'vbscript',
|
||||
'verilog',
|
||||
'vhdl',
|
||||
'vim',
|
||||
'x86asm',
|
||||
'xl',
|
||||
'xml',
|
||||
'xquery',
|
||||
'yaml',
|
||||
'zephir'
|
||||
]
|
||||
const supportCharts = ['sequence', 'flow', 'graphviz', 'mermaid', 'abc']
|
||||
const supportHeaders = [
|
||||
{
|
||||
|
|
|
|||
|
|
@ -248,7 +248,6 @@ module.exports = {
|
|||
'bootstrap-validator',
|
||||
'expose-loader?exposes=jsyaml!js-yaml',
|
||||
'expose-loader?exposes=moment!moment',
|
||||
'expose-loader?exposes=hljs!highlight.js',
|
||||
'expose-loader?exposes=emojify!emojify.js',
|
||||
'expose-loader?exposes=LZString!lz-string',
|
||||
'flowchart.js',
|
||||
|
|
@ -279,7 +278,6 @@ module.exports = {
|
|||
'babel-polyfill',
|
||||
'expose-loader?exposes=jsyaml!js-yaml',
|
||||
'expose-loader?exposes=moment!moment',
|
||||
'expose-loader?exposes=hljs!highlight.js',
|
||||
'expose-loader?exposes=emojify!emojify.js',
|
||||
'flowchart.js',
|
||||
'js-sequence-diagrams',
|
||||
|
|
@ -312,7 +310,6 @@ module.exports = {
|
|||
'bootstrap-tooltip',
|
||||
'expose-loader?exposes=jsyaml!js-yaml',
|
||||
'expose-loader?exposes=moment!moment',
|
||||
'expose-loader?exposes=hljs!highlight.js',
|
||||
'expose-loader?exposes=emojify!emojify.js',
|
||||
'flowchart.js',
|
||||
'js-sequence-diagrams',
|
||||
|
|
@ -342,7 +339,6 @@ module.exports = {
|
|||
'socket.io-client': 'io',
|
||||
'jquery': '$',
|
||||
'moment': 'moment',
|
||||
'highlight.js': 'hljs',
|
||||
'select2': 'select2'
|
||||
},
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue