Question

Our web app is built entirely in JS.
To make it snappy we cache resources (models) between page views and reload the resource when you view a page.

Our flow is like this:

1. The user is in ViewA
2. The user switches to ViewB
3. We use the cached resource to render ViewB
4. We start a fetch for resource
5. When the resource is fetched we render again

This has a nasty drawback of causing <img> tags to flicker, ever if they are the same.
The problem is that Backbone.js, which we use, doesn’t tell us if anything changed when fetching a collection, just that it was fetched.

Here’s a quick demo of what I mean: http://jsfiddle.net/p7DdG/
It only happens in webkit and with <img> tags, not with background images as you can see.

We think it’s kinda ugly to use background-image instead of a proper img tag.

Is there any solution to this?

Answer 1

The problem is gone in Chrome 19, problem solved 🙂