[storborg]

This is a really cool performance hack. However, doesn't this restrict the effectiveness of the browser cache to just the exact set of images requested at one time? For example:

  - On page load 1, I request images A.png, B.png, and C.png.
  - The JSON for [A, B, C] is returned and cached.
  - On page load 2, I request image B.png.

I can't use the original file, since it was cached for [A, B, C]. So I have to re-request just B.

Is there something I'm missing? Otherwise, it looks really cool.

[yaix]

Yes, caching is only for the exact subset.

But you could do your own little client side cache. When receiving the url/img-data pairs, just store them in the HTML5 browser storage database, as key:url/value:img-data pairs. Then you are independent from the grouping into subsets.

And before requesting your next image sprite, just check with the client side data storage what images you already have and which you need to request.

[wladimir]

Indeed, they'd cache the [A,B,C] case as well as the [B] one separately, which does reduce the effectivity of caching if there are many common assets and combinations. However in their case the set of images is (supposedly) wildly different per page, so I guess this is not much of a problem.