Jwrede / Anki-KaTeX-Markdown

Creates a new Basic and a new Cloze Note Type that support Markdown and KaTeX
75 stars 5 forks source link

Flickering when reviewing. #5

Closed huandney closed 3 years ago

huandney commented 3 years ago

The screen flashes when reviewing, curious that it is not always. Maybe it would be a problem related to the transition time to render, something related, for example: fadeIn () Another assumption may be that the type of font (letter) that is used in the script is different from the style. flicker

The curious thing is that this occurs even without Katex element, as below: test2

Jwrede commented 3 years ago

I think the flash is caused by the render time of KaTeX and Markdown, in the script I hide the text of the cards until it's finished rendering because else you'd see the unrendered card for 0.1s which looks really ugly imo. I added a short transition to make it a little bit easier on the eyes, please tell me what you think about it!

huandney commented 3 years ago

I understand, so this must be a difficult problem to solve, since rendering takes a while. Perhaps a possible solution but difficult to implement would be to render the entire card on the front and hide it until the back is triggered, but I think the anki doesn't work like that. About the transition, how would I go about controlling it? maybe a very fast computer doesn't need it.

Jwrede commented 3 years ago

Later this day I'll do some tests, I've got a few ideas on how to how I could implement this.

If you want to change the transition time now please copy the card template into a new Card Type, then change transition: color 0.1s ease-in; in CSS to what ever time you want, else if I update the Add-on it'll overwrite your changes.

Jwrede commented 3 years ago

Okay I tried doing that and it worked partly but tbh the improvement is really minor and the script I made would be too hacky to publish it, it would probably introduce alot of new problems. Also if you look into the "Basic" card type you can see that Anki also has this flickering if I'm not mistaken, so there is not really alot I can do against it, Anki just renders each card side again on changing sides :/

I changed the transition time to 0.025s because you're right 0.1 is a little to slow, now it's almost not noticable but it feels a little bit smoother than without a transition, do you think the transition is okay like that or would you change it?

huandney commented 3 years ago

I changed the transition time to 0.025s because you're right 0.1 is a little to slow, now it's almost not noticable but it feels a little bit smoother than without a transition, do you think the transition is okay like that or would you change it?

It seems to be a good value, although on my computer it still works best by setting it to 0. But don't worry about that, as a slower computer will possibly need the transition. What I find intriguing is that in many cases the flicker does not appear everything works perfectly, out of nowhere it comes.

See a comparison on my computer:

https://user-images.githubusercontent.com/19948348/113454926-66fc6200-93d7-11eb-8bfe-42200d3cf9ff.mp4

https://user-images.githubusercontent.com/19948348/113454932-695ebc00-93d7-11eb-9a19-d97e0314c974.mp4

Jwrede commented 3 years ago

Mhm thats weird, can you please download this add-on: https://ankiweb.net/shared/info/31746032 and then do the same as me in this video: b5thd-ac5oo Then see if there are any errors in the console

huandney commented 3 years ago

Mhm thats weird, can you please download this add-on: https://ankiweb.net/shared/info/31746032 and then do the same as me in this video: b5thd-ac5oo Then see if there are any errors in the console

I made the test no mistake.

Jwrede commented 3 years ago

I'm pretty sure that it's either Anki's / Markdown-it or KaTeX fault then because my script mainly just combines these 3 things, there is not alot of room for error on this add-ons side if you get no Error in the console, hope it doesn't disturb you too much, sorry!

huandney commented 3 years ago

No problem, thanks for making your time available with this project!