If you happen to already possess a byte-array from the WebSocket, there is a more refined solution available using Blobs:
// assuming `byteArray` was received from the websocket
var texture = new THREE.Texture();
var imageBlob = new Blob([byteArray.buffer], {type: "image/png"});
var url = URL.createObjectURL(imageBlob);
var image = new Image();
image.src = url;
image.onload = function() {
texture.image = image;
texture.needsUpdate = true;
};
Now, you will have a valid URL (similar to blob:http://example.com/$uuid) that can be utilized anywhere you need it. The major advantage of this approach is that it eliminates the time required for converting data to base64 and prevents crashing devtools when attempting to display lengthy base64-url strings.
Additionally, there is another option available (although not widely supported yet): createImageBitmap(). If used, it simplifies the process even further:
var texture = new THREE.Texture();
var imageBlob = new Blob([byteArray.buffer], {type: "image/png"});
createImageBitmap(imageBlob).then(function(imageBitmap) {
texture.image = imageBitmap;
texture.needsUpdate = true;
});