Squio.blog

Remotely extracting image thumbnails with Binary-Ajax

Now retrieving binary data through XHR is possible, I started working on a proof of concept: a remote Exif data loader.

The idea is simple: if you have your original digicam photos online, just bulk downloaded from the camera, you only have very non-descriptive names for reference. Was that one interesting image called IMG_1234.jpg, or was that the blurry one and are you looking for IMG_2345.jpg? Your only option seems to download the whole blob, easily several MBytes per image for contemporary multi Mega Pixel camera.

Now there is hope for a smarter solution.
Most digicam images have embedded meta data in the Exif format, often including a nice little thumbnail.

Wouldn’t it be nice to retrieve this embedded data over the network to preview a photo by thumbnail?

I haven been working on this problem and have a proof of concept ready, coded as Greasemonkey user script for Firefox (1.5 and 2.0).

From a very high level the working principle is:

For each image,
    •    Open a binary clean XHR connection
    •    Retrieve the first one K of image data (using HTTP 1.1 Byte Ranges)
    •    Find embedded Exif data; if found
    •    Retrieve the rest of the Exif header
    •    Extract the embedded thumbnail
    •    Append a new image, set source to thumbnail data (hex-encoded as data:xxx/yyy URL).

All in all, the savings in bandwidth are at least some 90%, as the embedded Exif data with thumbnail seldom exceed 60k, and even significantly less for older camera models.

Now this works, but it is still very rough around the edges.
Firefox gets completely locked up during data retrieval and parsing, I suspect that this is due to the CPU intensive exif parsing and synchronous XHR data retrieval.

I’ll be polishing and optimizing the script, planning a next post in a few days….