Hero Image Loading Twice

Greetings,

We are finally live. Thanks to the tech support team for helping us get there!

We are now optimizing and I noticed that our hero image, as displayed by Slider Revolution, is loading twice. It seems similar but different to this article.

The page is ergoarchitecture.com. You can see the double-load here:

Very odd to load the same image on consecutive requests! I checked this with our caching and optimization off (it is back on now) and it did not resolve. Is there a way to prevent this?

Thanks!

Hi Ergo,

Thanks for writing in.

What browser are you using? It seems to load once in Chrome and in Internet Explorer but it does load twice in Firefox.

Have you tried turning the lazy load and see if the issue is still happening?

Hi Albrechtx,

The screen shot is from Chrome on a PC. I have only check this on Chrome because I am using developer tools as my primary debugging tool, but I guess I can find waterfalls anywhere…

I will do more investigating, but the first thing I tried was disabling lazy load, because I read that the Slider Revolution for our hero image executes last anyhow, effectively meaning that all images load before our hero anyhow! I was sure that this would fix the problem, but the screen shot I sent was right after I disabled it and to my dismay the problem still existed.

Another mystery is after I change optimization settings I clear the caches, load a page once on my browser, then re-test the page on the speed metric sites. Oddly, there seems to be a time lag on some of the pages which are reporting clearly false results. For example, Page Speed will report a 30-day expiry on a particular image right after I have changed it. I will inspect that image’s return header in Chrome and see that that image has an expiration set 1 year from now. Is it possible that there is some other caching going on that I am not aware of or that I am somehow getting cached results from developer tools (I have the disable caching checked under the network tab)?

Thanks!

Steve

Hi again,

I have disabled lazy loading and the problem persists. I also removed the hero image and the offending image did not load at all (to confirm that it is not coming from another part of the page).

I also went into Slider Revolution to confirm that it is not saved as the background image or anything that might cause it to load twice.

Next I compared the headers on the images and both are identical. As I toggle back and forth the only difference it the time stamp which differs by a second.

Finally, I deselected “Save aggregated script/css as static files?” and it still double-loads.

One possible clue: if I uncheck “Disable Cache” in Chrome Developer Tools the image only loads once.

Any ideas?

Steve

Hello Steve,

Thanks for updating in!

I have checked your page and I only see one image. No duplicates.

You can chcek it out here:

Hope this helps.

Hi RuNel,

Yes, as I mentioned above, if you enable the cache it only loads once. I can see from your screen shot that you have the cache enabled in Chrome Developer Tools. If you disable the cache does it still only load once?

Also, I may be misunderstanding, but I thought that check box on the network was to disable the browser cache to simulate a first load of the site by a user?

Steve

Hey Steve,

Yes, the checkbox is to disable the browser cache for troubleshooting.

In my test, I’m getting mixed results. It looks like you are configuring your optimization plugins at this time.

Here are the details of my test. First, whether the browser cache is enabled or not, the image is still called twice.

Under the Initiator tab, you see that at first, it looks like Autoptimize calling the image but It’s actually a Slider Revolution script that does that. It’s only combined with other scripts by Autoptimize.

I double-checked if I could replicate the above results again and this time, the image is loaded once whether the cache is disabled or not. If cache is disabled though, the image doesn’t show up but it’s still loaded or called by Slider Revolution’s script. It’s actually the script that is the source of the loading problem. At first we thought it’s lazy loading.

Would you mind deactivating all optimizations (i.e. minification, concatenation, caching) so we could see if the issue is coming from Slider Revolution? Because if so, we will report it to ThemePunch.

Also, give us WordPress Admin access in a Secure Note so we could take a look at your setup.

Thanks.

Hey Steve,

The login credentials doesn’t work. Please check.

Thanks.

Hi Christian,

Thanks for your research. I agree that the “mixed results” are maddening! It seems that if we aren’t changing settings we should get consistent results, but I am also finding that this is not the case, particularly with the various speed metric sites.

Also, I checked our other pages with Slider Revolution hero images and… mixed results.

PAGES THAT LOAD TWICE WHEN CACHE DISABLED





Interestingly, as I was testing and re-testing the pages above, I found that at least once the contemporary-commercial page only loaded the image once. I reloaded the contemporary-home site 6 times and it double-loaded every time, but the fact that this behavior is not 100% consistent if very odd.

Also, I have checked the waterfalls at GTMetrix and Pingdom several times, so it may be possible that this is a glitch with Chrome Developer Tools and not actually happening in the real world? I would expect to see warnings/performance penalties for double-loading of images from the performance sites if they were seeing this?

I will check on the credentials…

Thanks!

Sorry, I had reused and email so the creation of the authentication failed. I fixed it and was able to login with the credentials above. It should work now.

I have disabled caching and optimization, but may need to re-enable temporarily in an hour as I will be at an event that we will need to have our site running smoothly for…

Steve

Hello Steve,

On my test, I do not see multiple image.
I even disabled browser caching and here is what I am seeing.

This issue seems to be intermittent as @Christian_y was able to replicate the issue. I did not encounter it and you sometimes see it and then you don’t. I would highly recommend that you stick to the 3rd party checkers like GTMetrix and Pingdom.

Hope this helps.

Yes, but the image did not load at all in your test!

See the blank gray box at the top of the screen where that image should be? That happened to me occasionally as well when the server timed out before the image was able to load the second time. The single load happens very rarely. It has only happened once in the last 30 tests. I would say that 29 out of 30 is more than intermittent.

That being said, if it is truly only occurring in Developer Tools, I don’t care. The only concern is that GTMetrix and Pingdom occasionally time out for no apparent reason when our times when cached and optimized are usually just 1.5 seconds in GTMetrix and less than 1 second in Pingdom. I’m afraid that this is the second image request failing to load for the same reason it fails in Developer tools.

This has happened occasionally on mobile or a tablet as well, and I have also had the page load except for the hero image in a desktop browser without Developer Tools open as apparently happened in your test above.

Steve

Steve

Hello Steve,

Can you please deactivate the Lazy loading in Slider Revolution plugin?
Once deactivated, we can do another round of test.

Kindly let us know how it goes.

That was it!

Not only does the hero image only load once now, it loads first instead of last which seems to speed up the first paint dramatically, at least in developer tools. For others with the same issue the problem was in Open Slide in Editor> Setting (gear icon in top bar)> General Module Options> Advanced> Loading Type> No Lazy Loading.

Also at the Slider Revolution Dashboard check Global Settings (gear at top bar)> Third Party Lazy Loading Data and make sure that it is blank.

Thanks for the help!

You’re welcome!
We’re glad we were able to help you out.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.