A Comparison of Mathematics Tags

Note: although important, this section is somewhat technical compared to the other introductory tutorial pages. If you’re just getting started, it’s fine to scan through this page quickly, continue on to the next pages, and come back here as a reference when needed!

Sometimes it can be confusing to decide whether you should use <m> or <math>. Roughly speaking, use <m> if all you want to do is display a mathematical expression; use <math> if your expression will be used in later computations, or might need to be simplified. That sounds simple but, as we’ll see, sometimes the differences can be subtle.

To start, here’s a review of the two tags:

• <m> takes expressions such as x^3-x (or LaTeXcode, like \sqrt{a^2+b^2}) and simply renders them nicely on-screen. The <m> tag does no simplifications or computations; DoenetML essentially treats the contents of an <m> object as a string of characters.

• The contents of a <math> tag are also displayed nicely on the screen, but internally, a <math> object is much more complicated than an <m> object. The contents of a <math> object could be used in computations, so Doenet keeps track of a lot of additional information.

In practice, the behavior of <m> and <math> can look very similar. Consider the following example.

Although using <m> or <math> results in the same display: there’s a crucial, invisible difference. As described above, $abSum is just a string of characters, with no mathematical meaning or value. Conversely, $xySum is a mathematical object, with a value which could be simplified, and used in later computations.

To drive this point home: the following code adds simplify to the definition of xySum, and also uses the result in a subsequent calculation.

Those calculations would not be possible with the <m> tag. In the following code, $abSum^2 results in _^2, which is Doenet-speak for “the square of some unknown value.” Because $abSum is a string of characters, not a number or mathematical expression, Doenet does not know how to square it.

With the above example in mind, it’s tempting to “play it safe” and use <math> tags everywhere. But the extra “internal machinery” associated with <math> objects means that <m> tags are more efficient with resources, and it’s a good idea to use them when possible.

Unexpected Consequences

Sometimes it seems like <m> will suffice for your purposes, but it’s worth planning ahead to think about whether your expression needs to be in a <math> tag instead!

Consider the following example, which uses three numbers to create and solve a quadratic equation. (Later in this tutorial you’ll learn how to let the user provide these coefficients; for now we’ll just define them in the code.)

Everything seems to be working! We’ve used <m> tags to display the quadratic equation, because we’re not doing any computations there; we’re just copying the coefficients into the expression. By contrast, we used <math> tags to do the computations with the quadratic formula. (To verify that Doenet is doing the computations, try removing simplify from one of the <math> tags and click Update.)

As it turns out, however, there’s a subtle issue with our code. Check out what happens with the <m> tag with different coefficients:

Why does the quadratic equation look so strange? The <m> tag does no simplifications. It doesn’t know (or care) about mathematical conventions such as:

• We typically write $x^2$ instead of $1x^2$.
• We usually write $+ -3$ as $-3$.

How can we ensure that the quadratic equation will always be rendered nicely? It turns out to be trickier than expected. A natural first thought is to use <math> instead of <m>:

That’s an improvement; when displaying a <math> object, Doenet makes some straightforward adjustments such as writing $-3 x$ instead of $+ -3x$, but we still have $1x^2$ at the beginning of the equation. Perhaps we can fix that issue by adding simplify to the tag defining the equation?

We’re definitely getting closer! Doenet now displays $x^2 - 3x + 2$ as expected, but the equation still looks a little odd, with $0 =$ at the beginning. That happened because we asked Doenet to simplify the entire equation, and not just the quadratic polynomial. Doenet’s simplification routines decided that the simpler, constant side of the equation should come first. Mathematically that’s fine, but it looks odd to our eyes.

To fix that remaining issue, we should use <math> to simplify just the quadratic polynomial, and display the rest of the equation with <m>. We could use side-by-side <math> and <m> tags, or nest them, as shown below. Nesting the tags is preferred, because it ensures the spacing is correct throughout the equation. (In the side-by-side example below, $=$ is too close to the $2$. You could manually leave a space between the side-by-side tags, but experienced HTML users know that it’s dicey to expect that blank spaces or lines will be preserved.)

The moral of the story: when choosing between <m> and <math>, it’s worth thinking about all the possible values your code might have to deal with, and whether simplifications will ever be necessary!

Final Note

For convenience, we focused on comparing the <m> tag to <math>, but everything we’ve said about <m> on this page also applies to the <me> tag.