If you need to show an image from a file or a blob, don’t use FileReader.readAsDataURL
for this job. This method requires significant work to read the blob and convert it into data URL. And although it works asynchronously, which is good because it doesn’t block the main thread, in general it’s inconvenient.
URL.createObjectURL
is a better solution: it synchronously and in no time generates temporary URL and binds it to the blob. Generating such URL doesn’t require reading the blob, hence it is much faster and cheaper (see algorithm details in the specification).
The blob can’t be garbage collected while it has temporary URLs bound to it. So don’t forget to use URL.revokeObjectURL
to unbind URL after you’re done with it.