No construyas BLOB, sí los construyas

Eric Bidelman

A todos los fans de BlobBuilder, les informamos que se despedirá.

BlobBuilder es una API práctica para crear blobs (o archivos) en JavaScript. Existe desde Chrome 8, FF 6 y IE 10, pero nunca se envió en Safari y es probable que nunca lo haga. Los cambios recientes en la especificación de la API de File incluyen un nuevo constructor para Blob, lo que, en esencia, hace que BlobBuilder sea irrelevante. De hecho, las versiones nocturnas de Safari ya lo inhabilitaron, y Chrome pronto comenzará a advertirte en la consola.

A modo de comparación, a continuación, se muestra el mismo código que usa el BlobBuilder obsoleto y el nuevo constructor Blob. El fragmento crea una hoja de estilo y la agrega al DOM.

BlobBuilder():

window.BlobBuilder = window.BlobBuilder || window.WebKitBlobBuilder ||
                        window.MozBlobBuilder || window.MSBlobBuilder;
window.URL = window.URL || window.webkitURL;

var bb = new BlobBuilder();
bb.append('body { color: red; }');
var blob = bb.getBlob('text/css');

var link = document.createElement('link');
link.rel = 'stylesheet';
link.href = window.URL.createObjectURL(blob);

document.body.appendChild(link);

Blob():

window.URL = window.URL || window.webkitURL;

var blob = new Blob(['body { color: red; }'], {type: 'text/css'});

var link = document.createElement('link');
link.rel = 'stylesheet';
link.href = window.URL.createObjectURL(blob);
document.body.appendChild(link);

¡Muy útil! Por lo tanto, ahora, en lugar de agregar a un BlobBuilder, podemos simplemente crear el Blob a partir de un array de partes de datos. Las partes de datos pueden ser de diferentes tipos (DOMString, ArrayBuffer, Blob) y en cualquier orden. Por ejemplo:

var blob = new Blob(['1234567890', blob, arrayBuffer]);

Ten en cuenta también que el segundo parámetro de objeto es opcional. Para obtener más información sobre estos cambios, consulta los documentos de MDN sobre Blob.