IE10 in Windows 8 Release Preview adds support for a Blob constructor. We earlier wrote about and demonstrated IE10’s support for a BlobBuilder interface, an in-progress interface in the File API: Writer W3C Working Draft. This interface enables developers to work with files on the client PC. Recently, the W3C working group deprecated the BlobBuilder interface in favor of a new Blob constructor. This post explains the differences between the two.
Comparing Blob Constructor and BlobBuilder Interface
Both the Blob constructor and the BlobBuilder interface enable Web developers to create files on the client. The difference is in the syntax. Whereas BlobBuilder requires each portion of the blob to be appended during a separate call to the append method, the Blob constructor can take an array of arguments. Here’s how to create a simple text file using both BlobBuilder and the Blob constructor:
// using the Blob constructor
var textBlob1 = new Blob(["Hello", " world!"], { type: "text/plain", endings: "transparent" });
// using the MSBlobBuilder interface
var bb = new MSBlobBuilder();
bb.append("Hello");
bb.append(" world!");
var textBlob2 = bb.getBlob("text/plain");
The Blob constructor takes two arguments, the array of content to put into the blob and an optional dictionary object which can include two members, type and endings. The array of content for the blob may contain blob objects, text strings or array buffers.
Recent versions of Firefox and Chrome also support the Blob constructor. IE10 still supports the prefixed MSBlobBuilder interface in addition to the new Blob constructor. At this time, Firefox and Chrome also support their vendor-prefixed BlobBuilder interface.
Feature Detecting the Blob Constructor
As with all new features, we recommend using feature detection to determine if the Blob constructor is available in the browser your code is running on. You can use something like this:
if (typeof Blob !== "undefined") {
// use the Blob constructor
} else if (window.MSBlobBuilder || window.WebKitBlobBuilder || window.MozBlobBuilder) {
// use the supported vendor-prefixed BlobBuilder
} else {
// neither Blob constructor nor BlobBuilder is supported
}
If you run the BlobBuilder Test Drive demo with the F12 developer tools console window open, it will log whether the blobs are being built via the Blob constructor or via BlobBuilder.
The addition of the Blob constructor to IE10 enables you to write standards-compliant code that works across browsers.
—Sharon Newman, Program Manager, Internet Explorer