Posts with large number of pictures have some of them fail to load

[Pil0tXia]

Describe the bug

This bug was originally issued by jerryc127/hexo-theme-butterfly#1201

I have a page with a lot of images, and some of the images don't load, but they display normally with the click of the mouse, and they also display after refreshing the page. What might be the reason?

The imgs tagged （已取消） are loaded properly and appears to be NS_BINDING_ABORTED. However, after unchecking deactivate cache(enable cache) in F12 and cleaned browser cache, a large number of CORS errors occurred, and the corresponding images could not be loaded. Is it a script loading logic error?

It shows up at local Hexo server and CDN.

To Reproduce
Steps to reproduce the behavior:

1. Go to https://www.pil0txia.com/post/2020-10-01_tenki-no-ko-4k-hdr-wallpaper/
2. Scroll down fast
3. See error

Expected behavior
pic loaded normally

LazyLoad version

• Butterfly 4.6.1 https://github.com/jerryc127/hexo-theme-butterfly/releases/tag/4.6.1

Desktop (please complete the following information):

• win11
• chrome 102

Screenshots

local:

[flowan]

I had the same issue. I fixed it by adding a placeholder image to the images that are lazy loaded. Maybe this helps in your case as well.

<img src="/product/placeholder.jpg" data-src="/product/image.jpg" class="lazy">

[verlok]

It looks like you're not setting the width and the height attributes on your images before they are loaded. Therefore, the browser can't know upfront how much space they should take. If this is the case, please set the width and the height attributes in the HTML of the images, and that should fix your problem without needing to use a placeholder image.

[Pil0tXia]

Thanks a lot! I will give feedback to hexo's theme developer.

[verlok]

Hey @Pil0tXia,
I’m glad you solved, and thank you for reporting back to the theme developer.

If you’re happy with my support, the documentation and the effort I’ve been putting on this project in the latest years, I hope you might want to buy me a coffee to show your appreciation. Or sponsor me, if you're a fan.

Open-source software is great for everyone, but it takes passion and time (and coffee!) to grow and evolve.

Thank you for thinking about it.
Have a wonderful day!