I am in the process of writing an advanced image upload feature for a site. In an attempt to allow all image configuration to be performed BEFORE wasting time and both client and server resources uploading the images to the server, I am trying to use HTML 5 features to support a fully client-side featureset with bulk upload after all image cropping and other editing has been performed.
I have a drop region on my page to allow multiple file drag/drop to actually select the images to be edited. On drop, I create a list of image editors (using window.URL.createObjectURL
), with some form fields, simple metadata extraction preview, and I attach Jcrop to each image. The problem I am having is when I attach Jcrop. Despite the fact that I am attaching the cropping faciltiy before I revoke the url with a call to window.URL.revokeObjectURL
, Jcrop does not seem to try accessing the URL until too late, and I end up with missing images.
I've resorted to not calling revokeObjectURL at all, and that allows everything to work...however I am not sure what the implication of not revoking does on resource usage. Does that allow for the potential of a memory leak? Does refreshing the page result in unrevoked object URLs being released and their resources reclaimed?
Assuming the drag/drop function implemented here only acquires a pointer to the local file, not revoking the URL isn't much of an issue.
On the other hand, if a blob of the image is created then memory does to be considered if the URL isn't revoked.