What is the fastest way to deliver binary data to browser?

Question

I'd like to deliver custom binary data to browser. They are actually images, but I need to deliver multiple versions of the same image + some metadata. Network performance should be achieved by using just a single GET request, and it should unpack fast in the browser. So far I could think of these solutions:

• image sprite (what about the metadata?)
• ZIP
• msgpack
• JSON + base64 encoding

I don't care about < IE8. I think avoiding XHR is not possible in my case, but same origin policy is making it even worse as I need to load from different (sub) domain. That could be worked around though by server routing, on the other side that prevents using CDN.

Answer 1

That depend on data structure, but if you need do something with this data in JavaScript - there are two (three) ways to achieve this

• JSON + base64 or escaping special characters
• XML + base64 or escaping ( Choosing between one of them depend on preferences )
• Harder one, but most effective - plain text with escaped 0 char and special marks (make three special codes - 0x20 0x40 for 0x00 char, 0x20 0x41 as mark and 0x20 0x42 for 0x20)

Answer 2

It turned out today's (and near future - IE9) browsers have very poor support for binary data, so whatever you decide to use, it has to be encoded (encodeable?) into a Javascript String, ie. JSON+base64.

For curious minds: http://status-501.tumblr.com/post/20293218962/delivering-binary-data-to-browser