Mathjax: Older versions of MathJax had less flickering when updating than the newest version

Created on 16 Sep 2016  路  10Comments  路  Source: mathjax/MathJax

If you look at the graph here:
http://jsxgraph.uni-bayreuth.de/wiki/index.php/Using_MathJax

If you drag the slider, there is not any flickering while updating MathJax. I think they use MathJax 1.0 there (if I log MathJax.version).

However, in the latest version, there is lot of flickering, see here for example:
http://jsbin.com/giwawij/edit?js,output

This is the same code, just different MathJax version.

With every update the math is visually refreshing, while you don't see anything in old versions.

Question

Most helpful comment

This is probably due to the processSectionDelay value, which adds a small pause between the input and output phase to allow the message area to refresh. This also causes the rest of the page to refresh, and so you see the preview when you might not have before. If you use

<script type="text/x-mathjax-config">
MathJax.Hub.processSectionDelay = 0;
</script>

that should return you to the pre-v2.5 behavior. See this post in the MathJax forum

All 10 comments

It seems to work fine in 2.4 as well. Since 2.5 it seems there is an increase of flickering.

The first thing I would do is disable the fast preview.

MathJax.Hub.Config({ 
  "fast-preview": {
    disabled: true
  }
});

But it's not as good as that v1.0 behavior.

Do you have a link to what jsxgraph is doing internally? They seem to inject TeX and render it instead of replacing the output. I would probably render in a detached node and inject the output.

Do you have a link to what jsxgraph is doing internally? They seem to inject TeX and render it instead of replacing the output. I would probably render in a detached node and inject the output.

I don't know how it works internally. I'm not really sure what you are suggesting here.

Here is a jsbin with 2.4, where it also works without flickering (at least on my laptop):
http://jsbin.com/ditodix/edit?html,js,output

This is probably due to the processSectionDelay value, which adds a small pause between the input and output phase to allow the message area to refresh. This also causes the rest of the page to refresh, and so you see the preview when you might not have before. If you use

<script type="text/x-mathjax-config">
MathJax.Hub.processSectionDelay = 0;
</script>

that should return you to the pre-v2.5 behavior. See this post in the MathJax forum

I'm not really sure what you are suggesting here.

Instead of adding TeX to the SVG and calling MathJax, create a node, add the TeX, run MathJax on the node and copy the output to the SVG. That way, no visual jitter occurs.

@dpvc I had tried processSectionDelay as well but didn't see an improvement.

It actually seems to work great for me, with:
MathJax.Hub.processSectionDelay = 0;

http://jsbin.com/bizixu/edit?html,js,output

At my laptop there is no visual flickering anymore with MathJax latest. Awesome that is what I really need while updating parameters in those interactive graphs.

Great. I must have done something wrong then.

@pkra, note that processSectionDelay is not a configuration parameter, so you have set it directly on the MathJax.Hub object. Perhaps you included it in MathJax.Hub.Config() instead?

This line code actually helpe me MathJax.Hub.processSectionDelay = 0;

Thanks a lot!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

dpvc picture dpvc  路  3Comments

lk-geimfari picture lk-geimfari  路  5Comments

memakura picture memakura  路  5Comments

geajack picture geajack  路  6Comments

albertodiazdorado picture albertodiazdorado  路  6Comments