all articles

data-url has size limit about 2MB

2016-10-05 @sunderls

data-url 2mb filereader js


we can use file-reader to read in img, and create a data-url to preview. but data-url seems to have data limit about 2Mb, if overflows, the browser is gonna freeze. (this is tested on Chrome, haven't tested on other browsers)

And the size of data-url is larger than original img.


avoid use data-url if size is larger than 2MB. or use blob url which is much more useful.

if (reader.result.length < 2 * 1024 * 1024){
    // only use data-url as img src when data-url is smaller thatn 2MB
    img.src = reader.ressult;

// or use blob url
var blobUrl = URL.createObjectURL(input.files[0]);