Just another WordPress site

MathJax to the rescue!

For a long time, one of the biggest problems with web design has been the proper display of mathematical markup. For a few decades scientists have used and developed LaTeX to write papers and articles. LaTeX is extremely powerful, sometimes to the point of frustration, and without it science journals would be very primitive. LaTeX was so successful that its ancestor, TeX, actually developed into HTML. Given this, it’s quite surprising that HTML has not supported decent mathematical typesetting until very recently. This has lead to all sorts of plugins and kludges as people have tried various ways to enable web developers to embed mathematics, using any means necessary.

Most of these solutions were insufficient in some respect. The beautiful methods were not standards compliant or did not support all browsers. The ones which were standards compliant were ugly. The ones that used images were bandwidth intensive and didn’t support scaling. And most of them were awful to type, often losing the semantics of their LaTeX source code. In frustration I was moved to write my own LaTeX interpreter, which I subsequently broke and never got around to fixing. When I decided to brush off the cobwebs and get it working again, I discovered the problem had finally been solved! MathJax is an open source, Javascript based, standards compliant, cross browser LaTeX interpreter. Even better, it leaves the source code intact so that you can simply cut and paste equations from LaTeX source, let the browser render it beautifully, and still have it in the HTML source code! It’s a perfect solution that should be around for many years to come. Eventually, I can see this being part of the standard for HTML 5 or even HTML 6. After many years of waiting, the mathematical internet has finally arrived!

Here are some examples of what it can do:

Shrödinger’s equation
\[
i\hbar\frac{\partial}{\partial t}\Psi(\vec{r},t) = \left( -\frac{\hbar^2}{2m}\nabla^2+V(\vec{r})\right)\Psi(\vec{r},t)
\]

Maxwell’s equations:

\[
\begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\ \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} & = 0 \end{aligned}
\]

It even handles inline expressions such as Einstein’s \(E=mc^2\) properly.

The next step is, of course, decent graphical displays. Once again, there is help at hand. HTML 5 supports canvas drawing. Combing the two of these should lead to much richer web content when it comes to mathematics and science. It will take a while to permeate to all the major browser, but eventually this will change the internet forever, allowing people to access more useful information than ever before.

Leave a comment for: "MathJax to the rescue!"