search

sirxemic / jquery.ripples

Add a water ripple effect to your background using WebGL.
https://sirxemic.github.io/jquery.ripples/
MIT License
1.07k stars 418 forks source link

with background-image set, image is being requested twice #43

Closed js-d-coder closed 7 years ago

js-d-coder commented 7 years ago

I am setting ripples effect on body and setting background-image on the same using in CSS file.
But I am observing that the image is being requested twice in network tab of chrome devtools. First time it is requested by html document via css (of course) and second one is being requested by ripples.js.
I don't think this is a good thing, requesting same file twice at same time could slow the webpage loading, right?
Should I be concerned about it? Can you please do something about it, to fix the problem?
btw, thanks a lot for this library, extremely useful :-)

sirxemic commented 7 years ago

I'm afraid I can't do anything about that. If you set up your caching settings properly, and if the images are small (as they should be :wink: ) it shouldn't be an issue, though.

If you really want to prevent this behaviour though, you could load the effect on an element without a background image and use the imageUrl property instead (el.ripples({ ... imageUrl: ... })). This way it will only do 1 request. Note that this has the disadvantage that there will be no background image until javascript is loaded.

js-d-coder commented 7 years ago

That is what I did... thanks.