Comparison of math Web publishing options

By Murray Bourne, 01 Dec 2014

Comparison of ASCIIMathML, PHPMathPublisher, MathJax, KaTeX, MathTeX and images for math publishing

Updated: Dec 2014

The following chart compares various math Web publishing options. Any of these can be used in blogs and forums (with some setup), and some can be used for sending math in an email.

Note

  1. "Ease of setup" refers to what the Webmaster needs to do.
  2. "Ease of use" refers to how easy it is for math publishers and students to use
  3. The green marker indicates a "pass" for that criterion.

1. Math in Images

Rendered math equation - image
Math rendered using an image. Note the TImes New Roman font.
Description Traditional Web development - create images on local computer, include in HTML file, upload the lot to server
Ease of set up Create images and HTML, upload everything to the server.
Ease of use Fiddly - need to create images locally and then upload to server
Cross-browser? Yes (because the math is in images)
Mobile? Yes (but slow)
Works in blog feeds (RSS)? Yes (because the math is in images)

Example page

Equivalent Fractions (mobile version)

(The mobile version of IntMath mostly uses images for math, created in an external application and uploaded to a server. Relatively fast on mobile, as it doesn't involve heavy scripting.)

2 ASCIIMathML

Description

One script resides on server. User inputs (simple and easy) code. Browser processes code and displays math using text.

Ease of set up Very easy and light - just needs one JS file on your server (or you can just insert a link)
Ease of use
(for math author or student)
Very easy to use - entering math is like calculator input (and you can use HTML symbols). Realistic to get students to use this solution.
Cross-browser?

Only works on Firefox (or IE with a plugin). Rendering in other browsers is poor, because it gives MathML output.

But when used with MathJax (see below), ASCIIMathML is a good cross-browser solution.

Mobile? Slow to render - doesn't render properly (this is similar to non-Firefox desktop browsers)
Works in blog feeds (RSS)? No

Example page

Enter math in emails, forums and Web pages using ASCIIMathML

(Relatively slow on mobile, and may not render well.)

Further reading

Send an email containing math symbols and equations!

Syntax for entering math using ASCIIMathML

ASCIIMathML input, MathJax output

3. PHP Math Publisher

Description Scripts, fonts and images reside on server. User inputs LaTeX into HTML file. Browser processes code and displays math as images.
Ease of set up Easy set up on server (just a few files). Caches images after creating them.
Ease of use Fiddly - requires LaTeX input
Cross-browser? Yes (because images)
Mobile? Yes (because images)
Works in blog feeds (RSS)? Yes (because images)

Example page

Math rendering in WordPress using WPMathPub

(Any browser. Relatively slow on mobile.)

4. MathJax

Rendered math equation - image
Screen shot of math rendered using MathJax
Description

Scripts, fonts and images reside on server. User inputs LaTeX into HTML file. Browser processes code and displays math using text and images.

Allows for "copy-paste math", where you can copy equations from (say) Wikipedia.

Now that MathJax allows ASCIIMathML input, it's very easy for students to use.

Ease of set up Easy - just call the MathJax script at the top of the page
Ease of use

Can input math using MathML or LaTeX.

Cross-browser? Yes
Mobile? Yes, but slow
Works in blog feeds (RSS)? No

Example page

MathJax – render math on the Web on all browsers

(Best in Chrome, Firefox, Safari. Relatively fast on mobile, but KaTeX is faster.)

Further reading

Easy math input and nice output using ASCIIMathML and MathJax

Using MathJax fonts outside of MathJax

5. KaTeX

Rendered math equation - image
Screen shot of math rendered using KaTEX
Description

Similar approach to MathJax, in that scripts, fonts and images reside on server. User inputs LaTeX into HTML file. Browser processes code and displays math using text and images.

Much faster than MathJax, as it's simpler and doesn't try to do as much.

Is still under development, so does not provide all the functionality of MathJax (yet). For example, it doesn't display matrices, split functions and many math symbols.

Ease of set up Easy - just call the KaTeX script at the top of the page
Ease of use

Requires LaTeX input, so not so easy for students to cope with. (But it can be made to work with ASCIIMathML.)

Cross-browser? Yes (but some small issues where older mobile browsers don't play well)
Mobile? Yes, quicker than MathJax
Works in blog feeds (RSS)? No

Example page

Equivalent Fractions (desktop version)

Most of the desktop version of IntMath now uses KaTeX.

Further reading

KaTeX - a new way to display math on the Web

KaTeX and MathJax Comparison Demo

KaTeX with ASCIIMathML input and MathJax fallback

6. MathTeX

Description LaTeX processor on server. User inputs source code for image in LaTeX format. Image is created by server, on the fly.
Ease of set up Very troublesome to set up LaTeX on server.
Ease of use
(for math author or student)
Fiddly - requires LaTeX input.
Cross-browser? Yes (because images)
Mobile? Yes (because images)
Works in blog feeds (RSS)? Yes (because images)

Example page

Quadratic formula by completing the square – easier method

(Any browser. Math on this page was processed on the server by MathTeX. Relatively fast on mobile.)

Conclusion

While there are some very good attempts at solving the problem of getting math onto a Web page in the above applications, none of them really solves all the following requirements:

  1. Easy to install
  2. Easy to use (especially for students)
  3. Cross-browser
  4. Mobile-friendly (small file sizes, low CPU requirements)

MathTeX would be a winner if there was an easy to use WYSIWYG editor. While there are various LaTeX editors, they all require a 2-step process (create the code in one application, then copy it to somewhere else for the Web).

KaTeX comes close, but it's not advanced enough yet for general use (it cannot display a lot of math objects and symbols). Using KaTeX with ASCIIMathML input is the best solution so far (and tha's what I am using throughout most of IntMath now).

I hope this comparison has been of some use to you.

See the 3 Comments below.

3 Comments on “Comparison of math Web publishing options”

  1. Duke says:

    The source codes would have been better. An inclusive keypad/board would help. i.e. One with the math symbols or maybe a shift-type key to change 'modes'

  2. bersling says:

    Thank you for your evaluation. In your conclusion, I do not understand why you do not favour Mathjax? Because of the slow mobile loading times? I would use Mathjax over Katex any day since Katex lacks important core features.

  3. Murray says:

    @bersling: I updated the comparison page just now: http://www.intmath.com/cg5/katex-mathjax-comparison.php

    You can see KaTeX handles all but 2 of the expressions, (overrightarrow and the one with underset, overset and rightleftarrows).

    It certainly handles just about all the expressions I need on IntMath. KaTeX is still under development (as is Mathjax) and they both have their place.

Leave a comment


Comment Preview

HTML: You can use simple tags like <b>, <a href="...">, etc.

To enter math, you can can either:

  1. Use simple calculator-like input in the following format (surround your math in backticks, or qq on tablet or phone):
    `a^2 = sqrt(b^2 + c^2)`
    (See more on ASCIIMath syntax); or
  2. Use simple LaTeX in the following format. Surround your math with \( and \).
    \( \int g dx = \sqrt{\frac{a}{b}} \)
    (This is standard simple LaTeX.)

NOTE: You can't mix both types of math entry in your comment.

Search IntMath, blog and Forum