fabriceleal/urweb-mathjax

Room for improvement

Opened this issue · 3 comments

ashalkhakov commented

Hi Fabrice! Unfortunately, I don't have your email so here it goes.

Propose to do:

  • add package.json so that this package will also ship mathjax
  • mathjax seems to require a script tag in the body of the document, right? seems like just the time to open an issue in ur/web (I also recently got into a similar issue with pushy, and arrived to the same workaround as you did here with the dynamic script tag...)
  • hide the mathjax plumbing into a primitive "typeset : string -> transaction xbody" kind of client-only operator (BTW we could ask for ids internally, so that this detail doesn't clutter the user code)

Not sure the third point will work out, though; but trying it anyways should be fine.

ashalkhakov commented

For reference there is urweb/urweb#85 (similar issue of putting a script tag in the body).

fabriceleal commented

Hi!

  • Do you have any example or clarification of package.json? Not sure what you mean in particular (surely not a npm package.json?)

  • This was a bit annoying, and made me realize something: I'm not 100% sure, but I think if I set a script x.js in a .urp file, then every single page seems to import that file, even if no functions from the module are called in the client side. I will test this assumption and maybe create an issue with a optimization suggestion in this regard. In this case this seems to me quite necessary since mathjax loads a lot of resources (.js, ...), so it's not ideal to include it in every page. Also mathjax seems to configure itself with a weird <script type="weird type">seems javascript to me</script>. These script tags can be added in the <head> o the doc btw. But the official docs seemed to feature some "mathjax.js?someopt=x" in the url which I don't know how to do in ur/web. So bottom line, my dynamic script loading looks clumsy, but don't know how to improve it. Other than that also maybe I should ask for some way to encode a promise in ur/web so that I don't have to make that weird clumsy deferred implementation (https://github.com/fabriceleal/urweb-mathjax/blob/master/mathjax.js#L60)

  • Yeah at first I assumed that I could have something like that, but turns out mathjax likes to typeset html nodes. Maybe I can create a virtual node and typeset there and then get the innerHtml (I'm already doing this here https://github.com/fabriceleal/urweb-mathjax/blob/master/mathjax.js#L51, some mathjax demo implemented this double-buffering, and I noticed that real-time in-place typesetting is noticeable gitchy)

ashalkhakov commented

Do you have any example or clarification of package.json? Not sure what you mean in particular (surely not a npm package.json?)

I meant the npm package.json so that we can save the user the hassle of manually installing mathjax. I'm not advocating usage of package.json in Ur/Web libraries.

This was a bit annoying, and made me realize something: I'm not 100% sure, but I think if I set a script x.js in a .urp file, then every single page seems to import that file, even if no functions from the module are called in the client side. I will test this assumption and maybe create an issue with a optimization suggestion in this regard. In this case this seems to me quite necessary since mathjax loads a lot of resources (.js, ...), so it's not ideal to include it in every page.

I think it's true: since the compiler produces only one app, it will concatenate all scripts into a single one. You are probably right then about the dynamic load of mathjax.

Also mathjax seems to configure itself with a weird <script type="weird type">seems javascript to me</script>. These script tags can be added in the o the doc btw. But the official docs seemed to feature some "mathjax.js?someopt=x" in the url which I don't know how to do in ur/web. So bottom line, my dynamic script loading looks clumsy, but don't know how to improve it.

Yes, I was unaware of these details, your reasoning is spot on.

Yeah at first I assumed that I could have something like that, but turns out mathjax likes to typeset html nodes. Maybe I can create a virtual node and typeset there and then get the innerHtml (I'm already doing this here https://github.com/fabriceleal/urweb-mathjax/blob/master/mathjax.js#L51, some mathjax demo implemented this double-buffering, and I noticed that real-time in-place typesetting is noticeable gitchy)

What about adding another function that, given a CSS class, will search for all tags marked with it and typeset them all, using the document.getElementsByClassName() function?

If you have a webpage where you write static HTML, then it's way easier for the client to mark all occurrences of mathjax markup with specially-marked tag then with dynamic IDs. OTOH, we still might have to reapply this function when we use dyn tags...