- PVSM.RU - https://www.pvsm.ru -

Khan Academy разработала быструю JavaScript-библиотеку для работы с математическими формулами

Фактическим стандартом для работы с математическими формулами в вебе, записанными в формате TeX, является библиотека MathJax. Платформа онлайн-обучения Khan Academy имеет в своём арсенале множество курсов, посвящённых математике. Один из важных пунктов миссии академии — сделать качественное образование доступным всем, независимо от географического и материального положения, поэтому для Khan Academy очень существенна быстрая работа сайта на слабых старых компьютерах и мобильных устройствах. Именно поэтому разработчики академии решили написать собственную библиотеку для рендеринга TeX в HTML, которая в перспективе могла бы полностью заменить MathJax и работала бы гораздо быстрее.

Библиотека KaTeX [1] пока ещё довольна молода (текущая версия — 0.1.0) и пока ещё не может сравниться с MathJax по функциональности. Текущий список поддерживаемых функций [2] доступен в вики проекта. KaTeX поддерживает меньше выходных форматов по сравнению с MathJax, которая умеет рендерить формулы в HTML+CSS, SVG и MathML. В КаТеХ реализован вывод в HTML, поддержка MathML планируется в будущем. KaTeX не поддерживает старые (старше 8.0) версии IE.

Khan Academy разработала быструю JavaScript библиотеку для работы с математическими формулами

Ключевое преимущество KaTeX — скорость. По результатам тестов [3] KaTeX опережает MathJax в 10-50 раз. Такого ускорения удалось добиться в основном благодаря тому, что при рендеринге широко используются возможности современного CSS, тогда как MathJax вычисляет позиции большинства символов «вручную», средствами JavaScript. Это компромисс, так как в разных браузерах формулы KaTeX иногда могут выглядеть не совсем одинаково, однако с учётом многократного выигрыша в скорости, компромисс вполне разумный — сейчас браузеры поддерживают стандарты намного лучше, чем 10 лет назад, когда началась разработка MathJax.

Подключение и использование библиотеки очень просто. В код страницы надо включить файлы katex.min.js и katex.min.css:

<link rel="stylesheet" type="text/css" href="/path/to/katex.min.css">
<script src="/path/to/katex.min.js" type="text/javascript"></script>

Кроме того, стоит помнить, что KaTeX, использует множество специальных шрифтов для отображения математических символов. Собственно, как и у MathJax, именно файлы шрифтов составляют львиную долю объёма.

Для рендеринга форму служит функция katex.render, которая принимает строку в формате TeX и ссылку на элемент DOM, в которому будет отображена формула:

katex.render("c = \pm\sqrt{a^2 + b^2}", element);

Для рендеринга HTML на стороне сервера можно использовать вывод в строку:

var html = katex.renderToString("c = \pm\sqrt{a^2 + b^2}");

Библиотека KaTeX распространяется под лицензией MIT.

Автор: ilya42

Источник [4]


Сайт-источник PVSM.RU: https://www.pvsm.ru

Путь до страницы источника: https://www.pvsm.ru/javascript/69871

Ссылки в тексте:

[1] Библиотека KaTeX: http://khan.github.io/KaTeX/

[2] список поддерживаемых функций: https://github.com/Khan/KaTeX/wiki/Function-Support-in-KaTeX

[3] По результатам тестов: http://jsperf.com/katex-vs-mathjax/

[4] Источник: http://habrahabr.ru/post/237265/