Skip to content
GitLab

Shrinking MathJax for "local" installation · Changes

Page history
Created Shrinking MathJax for "local" installation (markdown) authored by pkra's avatar pkra
Show whitespace changes
Inline Side-by-side
Shrinking-MathJax-for-"local"-installation.md 0 → 100644
View page @ 3bc9cfef
A topic that has come up multiple times on the MathJax User Group is how to reduce the MathJax footprint for "local" installations of MathJax, e.g., for inclusions in apps.
Even though every app will have it's own needs, we would like to document the process we went through for the [recent](http://www.mathjax.org/2012/03/20/news/readium-adds-mathml-support-via-mathjax/) inclusion of MathJax into [Readium](http://readium.org/).
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](https://github.com/mathjax/MathJax/); at time of writing this is the `v2.0-latest` branch.
```
git clone https://github.com/mathjax/MathJax/tree/v2.0-latest
git checkout -b v2.0latest origin/v2.0-latest
```
### The directory structure
In your clone you should see the following content:
`drwxrwxr-x 3 user user 4096 2012-03-28 09:57 config`
`drwxrwxr-x 4 user user 4096 2012-03-28 09:57 docs`
`drwxrwxr-x 4 user user 4096 2012-03-28 09:57 extensions`
`drwxrwxr-x 3 user user 4096 2012-03-28 09:57 fonts`
`drwxrwxr-x 2 user user 4096 2012-03-28 09:57 images`
`drwxrwxr-x 5 user user 4096 2012-03-28 09:57 jax`
`drwxrwxr-x 2 user user 4096 2012-03-28 09:57 test`
`drwxrwxr-x 5 user user 4096 2012-03-28 09:57 unpacked`
`-rw-rw-r-- 1 user user 11358 2012-03-28 09:57 LICENSE`
`-rw-rw-r-- 1 user user 49592 2012-03-28 09:57 MathJax.js`
`-rw-rw-r-- 1 user user 2146 2012-03-28 09:57 README.md`
The size of the folder should be around **26.8MB**.
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 the MathJax documentation in html and RestructuredText
* `extensions` -- this folder contains the MathJax extensions
* `fonts` -- this folder contains the MathJax fonts in multiple formats
* `images` -- this folder contains two small images
* `jax` -- this folder contains the heart of MathJax, the javascript files processing input and output.
* `test` -- this folder contains a series of test files and samples
* `unpacked` -- this folder contains the unminified 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
### Shrinking 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 **6.2MB** of space right away.
### Shrinking 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.8MB** in size, whereas a single (minified) configuration file is might be a few hundred bytes.
* PNG-fonts in `fonts/HTML-CSS/TeX/png/`
Most likely, your project is using a modern rendering engine such as webkit or gecko. Therefore, the PNG-fonts are not necessary -- at *29,000* files and **12.5MB** this is the biggest reduction.
**Note** If you remove the fonts, you should also include `imageFont:null` in your configuration to prevent font warning messages if you remove the fonts (cf. [the documentation on font warnings](http://www.mathjax.org/docs/2.0/options/FontWarnings.html)).
**Note** The `MMLorHTML.js` configuration might still be useful, cf. [its documentation](http://www.mathjax.org/docs/2.0/options/MMLorHTML.html). If you are working on a web application, the [combined configuration files](http://www.mathjax.org/docs/2.0/config-files.html) will be more efficient than a regular configuration. If you can use one of these configuration file, keep it. (For local files, e.g. in a smartphone app, there is no real advantage though.)
**Note** For gecko with local files, you *may* need the png fonts, because of the same-origin policy that makes files outside the directory of the HTML file be in a different domain. This is one of the few remaining situations requiring image fonts.
### Shrinking III -- removing parts your platform doesn'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](http://en.wikipedia.org/wiki/Web_Open_Font_Format) will be sufficient since WOFF is [supported by all major rendering engines](http://en.wikipedia.org/wiki/Web_Open_Font_Format#Vendor_support). The folder `fonts/woff` contains the MathJax fonts in WOFF. Removing the other font folders will save **~2MB**.
If you're more radical, you can force SVG-output (<a href="#output">see 'reducing output options' below</a>) -- in this cae you can remove the entire `fonts` folder, saving **2.4MB**.
* 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**.
* <a name="output"></a>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**.
**Note** NativeMML might be an option if you're using gecko. However, [we have to point out](http://www.mathjax.org/2012/03/02/news/mathjax-2-0-and-the-default-rendering-in-firefox/) that gecko misses some MathML features such as equation numbering and automatic line-breaking in MathML so your content might not display correctly.
### To sum up
For Readium, we started at **~26.8MB**.
Shrinking I: **~6.2MB**
Shrinking II: **~15.3MB**
Shrinking II: **~3.8MB**
Leaving us at **~1.4MB**.
\ No newline at end of file