Image loading jellypotato (missing: less)



  • http://what.thedailywtf.com/topic/19454/nodebb-updates/29

    Okay, per the linked post, now it appears that images load as you read.

    I'm guessing this fixes the problem where links took you to a completely wrong location, but now when I hit Page Down, if an image loads in the post it bumps the page up by the image's height. So instead of going Page Down by 1 page, I go down by 1 page plus the height of the image(s). So I have to scroll back up to find where I was reading.



  • ...okay, it only appears to happen sometimes. Maybe only if the image is sufficiently high up in the viewport?

    Images near the bottom of the viewport don't move the page when they load, but ones near the top of the viewport do.



  • Yes, I do some voodoo shenanigans to determine whether or not to push the viewport down or not. It doesn't always work 100%, but in general, the cutoff is the top of the post you're loading.

    If scrolling, the cutoff is near the top of the post closest to the center... sort of.



  • @julianlam Can you just load images ~1.5 viewports in advance and avoid the whole set of shenanigans?



  • @julianlam do we check after the image is ready to display? Checking before loading is good, but it seems to me you want to check, load the image, then check again.
    The last check obviously preventing the display of an image we've scrolled past in the time it took to load the image.



  • @julianlam Oh, also, if you're scrolling through a really long post (so the top of the post is near / off the top of the viewport) and an image loads anywhere in it, the page jumps.

    It'd be better if it looked at the image's position instead of the top of the post.



  • My old logic had the cutoff (or threshold) sent in on scroll, but that cutoff could change rapidly. e.g. if we expose the top of a post and trigger image load, and then managed to scroll down past the post before that image had loaded, you get jellypotato since on load, the image was below the threshold and triggered the "push everything down" logic. Likewise going upwards, except you'd get incorrectly relocated.

    The new logic now still triggers image load if I scrolls into view, but doesn't do the viewport and threshold calculations until the window has ceased scrolling for at least 250ms.

    Honestly the last niggling bug is the cutoff when you're scrolling... and that one is frankly impossible to fix unless we install eye tracking software on all user machines :wink:

    Let's say you are viewing a topic and post indices 5, 6, and 7 are in view. If post 6 is closest to the center, we take the top of that as the cutoff. If index 5 has an image, then we load it and adjust the user scroll position so you don't perceive any jellypotato. HOWEVER, if you had actually been reading post index 5, then the expected behaviour is "push everything down".

    All I can do is take a stab at where you're most likely to be reading, and it's a safer bet that your eyes are reading the center of the screen.



  • @julianlam okay, now I'm noticing that when I edit a post that had images, they vanish when I submit the edit and don't reappear until a reload.



  • @anotherusername I logged that on our tracker as I wasn't sure if it was something we'd messed with or a core bug.

    https://what.thedailywtf.com/topic/19515/images-not-shown-after-editing-post

    (cc @ben_lubar)




Log in to reply
 

Looks like your connection to What the Daily WTF? was lost, please wait while we try to reconnect.