Anki-android: MathJax flickering

Created on 13 Jul 2019  Â·  9Comments  Â·  Source: ankidroid/Anki-Android

Reproduction Steps

I am testing the MathJax support requested in #4915 and added in #5285:

  1. Install the latest alpha.
  2. Create a card with a MathJax expression, such as \(\sin x\), using the standard Basic or Cloze template with no modifications.
  3. Open on mobile.
  4. Notice how the card renders.
Expected Result

No flickering.

Actual Result

The card flickers, momentarily displaying the raw markup before rendering. This happens both on showing the card and revealing the answer, and does not go away when the card is reviewed again.

Debug info
AnkiDroid Version = 2.9alpha80
Android Version = 9
Research

[x] I have read the support page and am reporting a bug or enhancement request specific to AnkiDroid

[x] I have checked the manual and the FAQ and could not find a solution to my issue

[x] I have searched for similar existing issues here and on the user forum

Most helpful comment

I confirmed--there is some code in
https://github.com/dae/anki/blob/b06b70f7214fb1f2ce33ba06d2b095384b81f874/web/reviewer.js
that
I can pull in and try to reduce this problem.

On Sat, Jul 13, 2019 at 2:14 PM Adam Wolf adamwolf@feelslikeburning.com
wrote:

IIRC, there's a render delay that I didn't bring over from Anki Desktop
per either Mike or Tim, because people are very picky about cards showing
fast (or something, I don't recall the details 100%). I can take a look,
and make a branch with it, if we want to see which one folks prefer.

On Sat, Jul 13, 2019 at 12:50 PM cazizen notifications@github.com wrote:

Reproduction Steps

I am testing the MathJax support requested in #4915
https://github.com/ankidroid/Anki-Android/issues/4915 and added in

5285 https://github.com/ankidroid/Anki-Android/pull/5285:

  1. Install the latest alpha.
  2. Create a card with a MathJax expression, such as (\sin x), using
    the standard Basic or Cloze template with no modifications.
  3. Open on mobile.
  4. Notice how the card renders.

Expected Result

No flickering.
Actual Result

The card flickers, momentarily displaying the raw markup before
rendering. This happens both on showing the card and revealing the answer,
and does not go away when the card is reviewed again.
Debug info

AnkiDroid Version = 2.9alpha80
Android Version = 9

Research

[x] I have read the support page https://ankidroid.org/docs/help.html
and am reporting a bug or enhancement request specific to AnkiDroid

[x] I have checked the manual https://ankidroid.org/docs/manual.html
and the FAQ https://github.com/ankidroid/Anki-Android/wiki/FAQ and
could not find a solution to my issue

[x] I have searched for similar existing issues here and on the user forum

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/ankidroid/Anki-Android/issues/5377?email_source=notifications&email_token=AAAIWYNFPHH556ZO5XN6RL3P7IIVJA5CNFSM4IC77S6KYY3PNVWWK3TUL52HS4DFUVEXG43VMWVGG33NNVSW45C7NFSM4G7BI4CQ,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAAIWYNMWQC3HNDMF4CIJV3P7IIVJANCNFSM4IC77S6A
.

All 9 comments

IIRC, there's a render delay that I didn't bring over from Anki Desktop per
either Mike or Tim, because people are very picky about cards showing fast
(or something, I don't recall the details 100%). I can take a look, and
make a branch with it, if we want to see which one folks prefer.

On Sat, Jul 13, 2019 at 12:50 PM cazizen notifications@github.com wrote:

Reproduction Steps

I am testing the MathJax support requested in #4915
https://github.com/ankidroid/Anki-Android/issues/4915 and added in #5285
https://github.com/ankidroid/Anki-Android/pull/5285:

  1. Install the latest alpha.
  2. Create a card with a MathJax expression, such as (\sin x), using
    the standard Basic or Cloze template with no modifications.
  3. Open on mobile.
  4. Notice how the card renders.

Expected Result

No flickering.
Actual Result

The card flickers, momentarily displaying the raw markup before rendering.
This happens both on showing the card and revealing the answer, and does
not go away when the card is reviewed again.
Debug info

AnkiDroid Version = 2.9alpha80
Android Version = 9

Research

[x] I have read the support page https://ankidroid.org/docs/help.html
and am reporting a bug or enhancement request specific to AnkiDroid

[x] I have checked the manual https://ankidroid.org/docs/manual.html
and the FAQ https://github.com/ankidroid/Anki-Android/wiki/FAQ and
could not find a solution to my issue

[x] I have searched for similar existing issues here and on the user forum

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/ankidroid/Anki-Android/issues/5377?email_source=notifications&email_token=AAAIWYNFPHH556ZO5XN6RL3P7IIVJA5CNFSM4IC77S6KYY3PNVWWK3TUL52HS4DFUVEXG43VMWVGG33NNVSW45C7NFSM4G7BI4CQ,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAAIWYNMWQC3HNDMF4CIJV3P7IIVJANCNFSM4IC77S6A
.

I confirmed--there is some code in
https://github.com/dae/anki/blob/b06b70f7214fb1f2ce33ba06d2b095384b81f874/web/reviewer.js
that
I can pull in and try to reduce this problem.

On Sat, Jul 13, 2019 at 2:14 PM Adam Wolf adamwolf@feelslikeburning.com
wrote:

IIRC, there's a render delay that I didn't bring over from Anki Desktop
per either Mike or Tim, because people are very picky about cards showing
fast (or something, I don't recall the details 100%). I can take a look,
and make a branch with it, if we want to see which one folks prefer.

On Sat, Jul 13, 2019 at 12:50 PM cazizen notifications@github.com wrote:

Reproduction Steps

I am testing the MathJax support requested in #4915
https://github.com/ankidroid/Anki-Android/issues/4915 and added in

5285 https://github.com/ankidroid/Anki-Android/pull/5285:

  1. Install the latest alpha.
  2. Create a card with a MathJax expression, such as (\sin x), using
    the standard Basic or Cloze template with no modifications.
  3. Open on mobile.
  4. Notice how the card renders.

Expected Result

No flickering.
Actual Result

The card flickers, momentarily displaying the raw markup before
rendering. This happens both on showing the card and revealing the answer,
and does not go away when the card is reviewed again.
Debug info

AnkiDroid Version = 2.9alpha80
Android Version = 9

Research

[x] I have read the support page https://ankidroid.org/docs/help.html
and am reporting a bug or enhancement request specific to AnkiDroid

[x] I have checked the manual https://ankidroid.org/docs/manual.html
and the FAQ https://github.com/ankidroid/Anki-Android/wiki/FAQ and
could not find a solution to my issue

[x] I have searched for similar existing issues here and on the user forum

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/ankidroid/Anki-Android/issues/5377?email_source=notifications&email_token=AAAIWYNFPHH556ZO5XN6RL3P7IIVJA5CNFSM4IC77S6KYY3PNVWWK3TUL52HS4DFUVEXG43VMWVGG33NNVSW45C7NFSM4G7BI4CQ,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAAIWYNMWQC3HNDMF4CIJV3P7IIVJANCNFSM4IC77S6A
.

Huh - people are very picky about fast rendering, but I could see why a render delay in this case might make sense - rendering fast is great but rendering correctly first time is likely better. I think that was my counsel originally and I might be wrong here

Sounds good, let's try it

Sorry if the original message of mine sounded blamey, I didn't mean
anything negative by it at all! My main computer is being repaired for a
few more days, but I should be able to get to this this week. We will see
how it looks!

On Sat, Jul 13, 2019, 8:00 PM Tim Rae notifications@github.com wrote:

Sounds good, let's try it

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/ankidroid/Anki-Android/issues/5377?email_source=notifications&email_token=AAAIWYINGCC73L26VDWUZHLP7J3DTA5CNFSM4IC77S6KYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODZ34BXY#issuecomment-511164639,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAAIWYK3U5YFZ6DUO5YLSI3P7J3DTANCNFSM4IC77S6A
.

No worries at all! I just read it as correct attribution - I'm wrong all the time and even admit it occasionally ;-)

Ah, this was a "my bad". I have a preliminary PR I'm setting up, but there's some room for improvement still. I'll move discussion to that PR.

I think this is now solved. Mathjax won't reflow after rendering as it will delay showing the content to the user until Mathjax has finished rendering--but that whole conditional only happens if there is Mathjax on the card. If there isn't, it shoots right past it and doesn't add any render flicker or delay.

Good job, thank you!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

mikehardy picture mikehardy  Â·  4Comments

homocomputeris picture homocomputeris  Â·  5Comments

david-allison-1 picture david-allison-1  Â·  4Comments

kanjieater picture kanjieater  Â·  4Comments

mikehardy picture mikehardy  Â·  5Comments