Question

I have an app in which user uploads images from computer and then draw images on the canvas.

In chrome and firefox i’m using filereader. But if user uploads a very large image, it doesn’t load properly or doesn’t load and can’t be drawn onto the canvas.

I have tried it by accessing the same file direct from computer and it works fine. So is there any way to increase the browser memory so that large images load properly?

Or there is some other problem!!!

Answer 1

In my experience you can reliably bet on 5MB minimum for the platforms you mention above. Keep your data below that level and you should be pretty safe.

Read this article. http://diveintohtml5.ep.io/storage.html it has some nice nuggets of info, but it’s not all accurate, especially the part that says you cant up the limit.
I know for a fact that on iPhone once you reach the limit the phone will ask the user if they want to allow more space. (Sort of accurate, but not entirely)

On Android platforms the heap memory limit is set at 12MB. Not sure about the other platforms. Since you are going to be running in some kind of webcontainer (Webkit or other) I wouldn’t worry too much about it. The containers themselves are pretty good at managing memory and implementing file caches to minimize their footprint.

I recommend you leave the memory optimizations and such for last. Who knows, you might not even need it. Dont optimize prematurely.

PS:
Look at Phonegap: http://phonegap.com/