Reducing SVG file size in JSXGraph

By Murray Bourne

Following on from the Point animations efficiency page, I believe the board construction and point movement for those examples would be faster if the resulting file sizes (and number of empty elements) were reduced.

This page illustrates the original output, then a stripped down version keeping all the empty DIVs, and then finally the slimmest version with a suggestion for points using classes.

Consult the page source to see the differences.

Original: 872 kB

Number of elements:

Number of characters:

Number of empty tags:

Non-essential style attributes removed and/or replaced with classes (494 kB)

Number of elements:

Number of characters:

Number of empty tags:

Non-essential elements removed; and attributes and styles removed and/or replaced with classes (14 kB)

Number of elements:

Number of characters:

Number of empty tags:

I've removed all invisible elements, like point labels.

Also in this case, I've reduced the (unnecessary) number of decimal characters (15 places) for the <path> element, from (.e.g.)

d="M 0 0 L 302 0 M 0 11.615384615384613 L 302 11.615384615384613 M 0 23.23076923076924 L 302 23.23076923076924 M 0 34.846153846153854...

... to 2 decimal places ...

d="M0 0L302 0M0 11.62L302 11.62M0 23.23L302 23.23M0 34.85...