I don't know why the author did wrap his Uint8Array in a new one... note that I don't really know either the deprecated BlobBuilder API, but one typo I can see in your code is that you need to wrap your TypedArray in a normal Array:

new Blob([new Uint8Array(buffer, byteOffset, length)]);

The Blob() constructor takes a blobParts sequence as first parameter, and then searches for BufferSource, USVStrings and Blob elements in this sequence. So when you pass a TypedArray, it will actually iterate over all the entries of this TypedArray and treat these as USVString (and thus convert their numerical value to UTF-8 strings in the Blob). That's rarely what you want, so better always pass an Array in this constructor.

Note that if you don't need to slice the buffer, it's probably better to directly pass it instead of using an intermediary Uint8Array (but still in a normal Array):

new Blob([buffer]);

You can use FileReader to read the Blob as an ArrayBuffer.

Here's a short example:

var arrayBuffer;
var fileReader = new FileReader();
fileReader.onload = function(event) {
    arrayBuffer = event.target.result;
};
fileReader.readAsArrayBuffer(blob);

Here's a longer example:

// ArrayBuffer -> Blob
var uint8Array  = new Uint8Array([1, 2, 3]);
var arrayBuffer = uint8Array.buffer;
var blob        = new Blob([arrayBuffer]);

// Blob -> ArrayBuffer
var uint8ArrayNew  = null;
var arrayBufferNew = null;
var fileReader     = new FileReader();
fileReader.onload  = function(event) {
    arrayBufferNew = event.target.result;
    uint8ArrayNew  = new Uint8Array(arrayBufferNew);

    // warn if read values are not the same as the original values
    // arrayEqual from: http://stackoverflow.com/questions/3115982/how-to-check-javascript-array-equals
    function arrayEqual(a, b) { return !(a<b || b<a); };
    if (arrayBufferNew.byteLength !== arrayBuffer.byteLength) // should be 3
        console.warn("ArrayBuffer byteLength does not match");
    if (arrayEqual(uint8ArrayNew, uint8Array) !== true) // should be [1,2,3]
        console.warn("Uint8Array does not match");
};
fileReader.readAsArrayBuffer(blob);
fileReader.result; // also accessible this way once the blob has been read

This was tested out in the console of Chrome 27—69, Firefox 20—60, and Safari 6—11.

Here's also a live demonstration which you can play with: https://jsfiddle.net/potatosalad/FbaM6/

Update 2018-06-23: Thanks to Klaus Klein for the tip about event.target.result versus this.result

Reference:

• https://developer.mozilla.org/en-US/docs/Web/API/FileReader#readAsArrayBuffer()
• https://www.w3.org/TR/FileAPI/#dfn-readAsArrayBuffer

In Node.js, crypto.randomBytes returns a Buffer. This is the correct type to use for sending raw data to the client.

When using Express, it is important to set the correct content-type of the response using res.type(). However, when sending a Buffer, if the content-type header is not set in any other middleware, then express will use application/octet-stream by default.

When the parameter is a Buffer object, the method sets the Content-Type response header field to "application/octet-stream", unless previously defined.

router.get('/test/*', function(req, res, next) {
  ...
  let data = myFunctionThatGeneratesData();
  res.type('application/octet-stream').send(data);
  // ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ might not be necessary
});

And lastly in Angular, using the responseType: 'blob' is correct:

this.http.get('/test/random-bytes-array', {
  responseType: 'blob'
}).subscribe(data => {
  console.log(data);
});

Summary

Unless you need the ability to write/edit (using an ArrayBuffer), then Blob format is probably best.

Detail

I came to this question from a different html5rocks page., and I found @Bart van Heukelom's comments to be helpful, so I wanted to elevate them to an answer here.

I also found helpful resources specific to ArrayBuffer and Blob objects. In summary: despite the emphasis on Blob being immutable/"raw data" Blob objects are easy to work with.

Resources that compare / contrast ArrayBuffer vs Blob:

• Mutability
  • an ArrayBuffer can be changed (e.g. with a DataView)
  • a Blob is immutable
• Source / Availability in Memory
  • Quoting Bart van Heukelom:

  • An ArrayBuffer is in the memory, available for manipulation.
  • A Blob can be on disk, in cache memory, and other places not readily available

• Access Layer
  • ArrayBuffer will require some access layer like typed arrays
  • Blob can be passed directly into other functions like window.URL.createObjectURL, as seen in the example from OP's URL.
    • However, as Mörre points out you may still need File-related interfaces and API's like FileReader to work with a Blob.
• Convert / Generate
  • You can generate Blob from ArrayBuffer and vice versa, which addresses the OP's "Aren't both containers comprised of bits?"
  • ArrayBuffer can be generated from a Blob using the FileReader's readAsArrayBuffer method , or the async method const arrayBuffer = await blob.arrayBuffer() (thanks to @Darren G)
  • Blob can be generated from an ArrayBuffer as @user3405291 points out new Blob([new Uint8Array(data)]);, shown in this answer
• Use in Other Libraries
  • jsZip; (new JSZip()).loadAsync(...) accepts both ArrayBuffer and Blob: String/Array of bytes/ArrayBuffer/Uint8Array/Buffer/Blob/Promise
• How does protocol handle ArrayBuffer vs Blob
  • Websocket (aka WS / WSS)
    • Use the webSocket's binaryType property (could have values "arraybuffer" or "blob") to "control the type of binary data being received over the WebSocket connection."
  • XmlHttpRequest (aka XHR)
    • Use the xhr's responseType property to "to change the expected response type from the server" (valid values include "arraybuffer", "blob", and others like "document", "json", and "text")

    • the response property will contain the entity body according to responseType, as an ArrayBuffer, Blob, Document, JSON, or string.

Other helpful documentation:

• ArrayBuffer

The ArrayBuffer object is used to represent a generic, fixed-length raw binary data buffer. You cannot directly manipulate the contents of an ArrayBuffer; instead, you create one of the typed array objects or a DataView object which represents the buffer in a specific format, and use that to read and write the contents of the buffer.

• Blob

A Blob object represents a file-like object of immutable, raw data. Blob represent data that isn't necessarily in a JavaScript-native format. The File interface is based on Blob, inheriting blob functionality and expanding it to support files on the user's system.