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

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

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



    Ключевое преимущество KaTeX — скорость. По результатам тестов 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.

    Нордавинд
    0,00
    Компания
    Поделиться публикацией
    AdBlock похитил этот баннер, но баннеры не зубы — отрастут

    Подробнее
    Реклама

    Комментарии 31

      +17
      Даёшь TeX на Хабре!

      Нет, серьёзно. Большинство технических сайтов избегает MathJax из-за того, что это слишком тяжёлая зависимость. Но если KaTeX избавит от этой тяжести, то почему бы нет?!
        +12
        Я наверное не единсвенный кто засылал админам реквест по поддержке TeX, но как-то безрезультатно :(
        0
        А данная библиотека для локальных файлов будет работать или нет?
          0
          Эта библиотека берет на вход формулу и дает на выход красивое хтмл-представление. Т.е. грубо говоря «строка -> строка». О каких файлах идет речь?
            +1
            Наверное человек спрашивал, можно ли ее встроить в html-файл и просто открыть в браузере, чтобы увидеть результата. Если так — можно.
              0
              Для локальных html файлов. В свое время в одном проекте у меня была идея использовать какой-нибудь рендер для LaTeX формул в автоматически генерируемых локальных html файлов. И я не смог найти нормальной библиотеки. Находил либо те, которые для локальной работы требовали копирование нескольких тысяч файлов, либо которые требовали онлайн подключение. Хотя возможно я просто что-то не знал тогда.
                +3
                Конечно можно, это же JavaScript, он работает в первую очередь внутри браузера.
                Я подобный подход использую чтобы строить отчеты по результатам работы консольной утилитой. Вывод утилиты оформляется в html файл, который строит график анализируемой зависимости.
                Довольно удобно.
                И кстати, лучший способ ответа на подобные вопросы — это самому попробовать :-)
                  0
                  Отлично! Это хорошая новость)
                  0
                  В простейшем случае это реализуется элементарным баш-скриптом CGI! На вход дается латеховский код, на выходе имеем png. Все равно на компьютере уже установлен texlive.
                    0
                    Как я понимаю, для этого нужен вебсервер внешний или внутренний. Ну, и зачем мне целый вебсервер для программы, которая генерирует отчеты с формулами?
                      –2
                      Можно подумать, тяжело поставить nginx. Там настроек-то по умолчанию — на пару минут! И жрет nginx не так уж и много!!!
                        0
                        Как бы сказать… Да, поставить nginx сложно для пользователя. Просить пользователя ставить целый вебсервер?) Пользователь пройдет мимо и всё. Автоматически? Во-первых, это моветон создавать свои вебсервера всякими небольшими программками. Во-вторых, пойдут проблемы с правами доступа и так далее. А оно надо? Это как забивать гвозди экскаватором. Можно. На нафиг надо?
                          0
                          Как-то совершенно неюниксвейно!
                            0
                            А надо делать только юниксвейно?)
                              0
                              Естественно. Неюниксвейность — это велосипедостроение и монструозность.
                                0
                                «юниксвейно» — а, что это слово означает? Я как понял, что это значит в стиле юникс систем. Верно?
                                  0
                                  man UNIX way
              –4
              Очередной неправильный подход. Не нужно на жабоскрипт перекладывать рендеринг латеха! Из-за такого подхода каждый раз как открываешь SO с кучей формул, ждешь какое-то время, пока тормозной жабоскрипт их отрендерит.
              Правильный подход — один раз откомпилировать формулы в векторный SVG (pdflatex→inkscape) и уже в текст вставлять ссылку на изображение!

              P.S. Лучше дедушки Кнута все равно никто TeX не реализует!!!
                +1
                есть куча задач (например, локальные html файлы), когда нужно именно при открытии страницы в браузере отрендерить формулы.
                  –2
                  Достаточно один раз прогнать через скрипт и не париться!
                  А вообще, я не встречал локальных html-файлов с латеховскими формулами. Это что за извращение? Неужто сразу в латеховский файл нельзя поместить.

                  Ну и еще про компиляцию на каждое открытие файла: представьте, что у вас абсолютно вся литература хранится в латеховских исходниках. И перед тем, как открыть какой-нибудь даташит, надо его сначала скомпилировать. И так каждый раз!
                    0
                    Я где-то сказал, что нужно все LaTeX файлы компилировать на лету? О_о Разумеется нет! Основная масса LaTeX кода должна компилироваться заранее.

                    Но это не отменяет того факта, что есть задачи, где требуется компиляция при открытии файла. Например, есть простая программа, которая генерирует отчеты в html виде, и где используются LaTeX формулы для красивого представления математических формул. При этом формулы каждый раз разные. И мне нужно ставить вебсервер для решения такой задачки, как генерация картинки для LaTeX формул? Или обязательно требовать онйлайн подключение? Или просить пользователя установить MikTEX? Это просто усложнит программу и ее использование на порядок.
                      0
                      В корне неверный подход. Если программа генерирует html-отчеты, она сразу и формулы должна прогонять через латеховский компилятор. Картинки-то она сразу рисует гнуплотом! Или у вас и гнуплот реализуется на жабоскрипте?

                        0
                        Нафига небольшой программе тащить кучу ненужного для генерации каких-то нескольких картинок? Когда можно все быстро скомпилировать онлайн. Если компиляция онлайн происходит быстро и не требовательно по ресурсам, то нужно делать онлайн, особенно, если это минимизирует действия от пользователя. Если компиляция онлайн происходит не быстро или очень долго, то тогда используется предкомпиляция. Это стандартный подход.

                        Да, там я графики делал через javascript библиотеку. У меня там не километровые отчеты, так что рисунки генерировать мне было не надо.
                          0
                          Ничего тащить не нужно! texlive и так уже установлен, если, конечно, ваш компьютер — не игровая приставка!
                            0
                            > texlive и так уже установлен

                            Э… Даже у меня не установлен. У меня стоит MiKTeX. И неужели ты думаешь, что у всех пользователей должно стоять TeX Live по умолчанию? О_о У единиц только стоит такая система. И зачем рядовому пользователю ставить себе мощный, абсолютно ему не нужный пакет TeX Live, если ему нужна программа, в которой генерируются какие-то html отчеты, и он даже понятия не имеет, что такое LaTeX, и зачем он вообще нужен?
                              0
                              Если человеку не нужно верстать тексты с формулами, то на кой черт ему формулы в отчетах?
                                +1
                                То есть красивые формулы и красиво записанные математические расчеты хотят видеть только люди, которые верстают тексты с формулами? Открою тебе секрет. Есть куча людей, которые сами формулы никогда не верстает и не будет верстать, но которые хотят видеть в отчетах всё красивенькое и гладенькое.

                                А среди тех, кто верстает тексты с формулами, все должны пользоваться LaTeX? Открою тебе секрет. LaTeX среди математиков, ученых знает очень малое количество людей. А среди тех, кто знает, мало кто верстает. А среди тех, кто верстает, далеко не все пользуются TeX Live. И уж точно не стоит надеяться на то, что пользователь программы, в которой в отчетах используются красивые математические формулы, будет по умолчанию иметь установленный TeX Live.
                      +2
                      > А вообще, я не встречал локальных html-файлов с латеховскими формулами.
                      IPython Notebook и rmarkdown как раз такие и генерируют.
                  • НЛО прилетело и опубликовало эту надпись здесь
                  • НЛО прилетело и опубликовало эту надпись здесь
                      0
                      Я думаю этот пост будет не полон, если не упомянуть в нем о Mathapedia. И в частности о LaTeX2HTML5.

                      Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

                      Самое читаемое