Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Picture loaded twice in lottie-web #1317

Open
wrbing728 opened this issue Oct 19, 2018 · 7 comments
Open

Picture loaded twice in lottie-web #1317

wrbing728 opened this issue Oct 19, 2018 · 7 comments

Comments

@wrbing728
Copy link

wrbing728 commented Oct 19, 2018

I change the pictures in json file from base64 to cdn url, then strange things happened: all the pictures load twice.

image

@bodymovin
Copy link
Collaborator

Hi, how are you changing them?

@wrbing728
Copy link
Author

I edit the content manually.

@bodymovin
Copy link
Collaborator

lottie preloads images before starting the animation.
But I'm not sure if this is the reason why you see the image loaded twice.
Can you share some more info or a link?

@wrbing728
Copy link
Author

Here is an example https://codepen.io/wrbing/pen/VEzYBd
You can see the image request twice like this:
image

@bodymovin
Copy link
Collaborator

bodymovin commented Oct 24, 2018

Yes, it's normal that it loads twice using the svg renderer.
One is triggered by the preloader before the elements are added to the DOM.
The second is loaded by the ImageElement when it adds the tag to the
It's an intended behavior so every element is ready and cached before starting the animation.

@flowke
Copy link

flowke commented Jan 21, 2019

Yes, it's normal that it loads twice using the svg renderer.
One is triggered by the preloader before the elements are added to the DOM.
The second is loaded by the ImageElement when it adds the tag to the
It's an intended behavior so every element is ready and cached before starting the animation.

In Android webview load a html page . when lottie-web preload a image , it may just load a half and then turn fail, in this circumstance, android device will cache the broken image(it just load a half).

in the second time load image (code: this.innerElem.setAttributeNS('http://www.w3.org/1999/xlink','href',assetPath);) it will load the braken cached image. how could i disable preload

@ktut
Copy link

ktut commented Apr 23, 2020

Bringing this back - this causes extra problems when using elements like sliders, which need to make copies of the containing components to allow for infinite scrolling. This could mean assets being loaded up to six times (!!) instead of the two described here.

How might one disable preloading so the image is only loaded once, and then cached properly by the browser?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants