Chrome caching CSS but not loading images inside CSS file

Question

We're having a weird problem at work that happens only in chrome. It looks like the css file is getting cached and the content of this file isn't getting re-downloaded.

The problem is that when using a fresh session for example "private session", the image "mainSprite.png" isn't getting displayed.

After some tests, I believe the problem is related to us doing redirects at the beginning if the user isn't authenticated. From what I understand, it might not complete the download of the sprites linked inside the css files. It will cache an invalid object as soon as the redirect starts and then on the following pages, it will fail to display a correct image since it cached something wrong.

The strange thing is that it actually loads the image completely at some point. But it looks like it's not refreshing it in memory...

I did a timeout of one second before starting redirects on first load and images correctly display. This is a quick fix and I can't expect every computer to load in 1 second every images contained in the css.

edit

As far as I can say, it really looks like a race condition. I changed the order of loading. We use require.js. Instead of loading js after css, I start js loading before. And images are getting loaded correctly now on my local server.

if someone is interested to look into it:

http://api.checklist.com

edit 2

When images aren't visible, opening new tabs will have the same problem. Closing the browser and reopening it will work on first load and images isn't being downloaded but loaded from Cache which means that before closing the browser, the image was indeed downloaded.

Answer 1

It looks like the problem coming from your redirects unfortunately i couldn't see your example ( link won't open ). Google chrome has indeed issues with caching it's annoying during development time ( clear up the cache, load new image, do the same for new image..), if you need to clear your cache try the folowing:

try to go to

chrome://chrome/settings/clearBrowserData

in your chrome browser and check the options:

Empty the Cache( i have also Clear download history and Delete cookies and other site and plug-in data )

click on 'Clear Browsing Data' button it should