Skip to content

Guide: reducing size of a mathjax installation

Jump to bottom Edit New page
pkra edited this page Jul 17, 2013 · 8 revisions

While the complete MathJax installation is rather large, the MathJax footprint can be reduced for "local" installations of MathJax, e.g., for inclusions in apps or when targeting specific browsers.

Even though every app will have it's own needs, the basic process remains the same.

The goal of this documentation is to allow developers to include MathJax efficiently in their projects.

Getting the code from github.

To start from scratch, we grab a fresh MathJax copy from github; at time of writing this is the v2.2-latest branch.

git clone https://github.com/mathjax/MathJax/tree/v2.2-latest
git checkout -b v2.2latest origin/v2.2-latest

The directory structure

In your clone you should expect the following content:

config/
docs/
extensions/
fonts/
images/
jax/
localization/
test/
unpacked/
LICENSE
MathJax.js
README.md

The size of the folder should be around 22MB.

Let's go through the folders.

  • config -- this folder contains combined configuration files such as TeX-AMS-MML_HTMLorMML-full.js
  • docs -- this folder contains information on the MathJax documentation
  • extensions -- this folder contains the MathJax extensions
  • fonts -- this folder contains MathJax fonts in multiple formats
  • images -- this folder contains two small images
  • localization -- this folder contains locales in different languages
  • jax -- this folder contains the heart of MathJax, the javascript files for processing input and output.
  • test -- this folder contains a series of test files and samples (not to be confused with the MathJax test suite
  • unpacked -- this folder contains the uncompressed originals of the core MathJax files (config, extensions, jax and of course MathJax.js)

The three files are

  • README.md
  • LICENSE -- a copy of the Apache license
  • MathJax.js -- the core JavaScript file

Trimming I -- removing files unnecessary for deployment

First, we remove those parts that are not relevant to the functionality of MathJax.

  • docs
  • test
  • unpacked
  • README.md, LICENSE

Without these folders, the functionality of MathJax is not limited in any way -- and we're saving 4.5MB of space.

Trimming II -- things that you probably won't need

There are a few components that you probably won't require in your project.

  • configurations in config

Since you most likely want to write your own configuration anyway, you can remove the content of config. To compare, config folder is 2.9MB in size, whereas a single (minified) configuration file might be a few hundred bytes.

  • PNG-fonts in fonts/HTML-CSS/TeX/png/

Most likely, you're using a modern browser engine that supports webfonts. Therefore, the PNG-fonts are not necessary -- at 29,000 files and 9.3MB this is the biggest reduction.

Note If you remove the PNG fonts, you should also include imageFont:null in your configuration to prevent font warning messages if you remove the fonts (cf. the HTML_CSS configuration documentation).

Note The MMLorHTML.js configuration might still be useful, cf. its documentation. If you are working on a web application, the combined configuration files will be more efficient than a regular configuration. If you can use one of these configuration file, keep it. You can also build your own combined file with the MathJax Dev Tools.

Note For Gecko with local files, make sure to work around the same-origin policy, see the docs.

Trimming III -- removing parts recent browsers won't need

Depending on your platform or your project's preference, you can remove some of the functionality of MathJax that your platform does not require.

  • Deleting more fonts.

Most likely, fonts in the Web Open Fonts Format will be sufficient since WOFF is supported by all major rendering engines. The folder fonts/woff contains the MathJax fonts in WOFF. Removing the other font folders will save ~2MB.

Trimming IV -- reducing input and output options

  • Reducing input options.

Depending on your project it might make sense to reduce the input options. For example, an epub3 reader application such as Readium might restrict the input method to MathML since MathML is part of the epub3 standard. If you're working on something more interactive you might want to allow LaTeX or AsciiMath input. In any case, the savings are jax/input/AsciiMath 31.7kb, jax/input/MathML 65.2kb, jax/input/TeX 49.9kb.

  • Reducing output options.

Similarly, it might make sense to reduce the output options depending on your platform. Essentially there are two choices, HTML-CSS and SVG. Either of them can be used and will save you approximately 1.3MB. If you disable HTML, then you can delete the WOFF fonts as well.

Note NativeMML might be an option if you're using gecko. However, as pointed out Gecko is still missing some MathML features so your content might not display correctly.

To sum up

We started at ~22MB.

Trimming I: ~17.5MB Trimming II: ~5.3MB
Trimming III: ~3.2MB Trimming IV: ~1.7MB (1 Input + 1 Output)

If you compress this, you'll end up with 600-650KB.

Add a custom sidebar
Clone this wiki locally