mercredi 27 avril 2016

Chrome HTML5 file input type memory leak (Ember.js)

In a mobile web application that heavily uses chrome's local storage I noticed I ran out on space too quickly after a while while taking pictures and storing them. I set up a barebone Ember application with a single file input type to narrow the problem:

index.hbs

<form>
  <input id="file" type="file" accept="image//*" capture="camera">
</form>

<button id="clear" >
  Clear File input
</button>

index.js (controller)

import Ember from 'ember';

export default Ember.Controller.extend({
  actions: {
    reset: function(){
      Ember.$('#file').wrap('<form>').closest('form').get(0).reset();
      Ember.$('#file').unwrap();
    }
  }
});

When accessed from a tablet it will display three options to upload a file: Documents, Camcorder and Camera. When files are uploaded from the first two the Data of Chrome app won't increase as it is temporarily stored until further operations (e.g. storing it locally via the Local Storage API).

enter image description here

However, when pictures are uploaded using the Camera, the Data memory will increase and will never be released, even if for example we take another picture or upload another file. Each picture taken increases memory that will never be freed, not even refreshing or closing & reopening the browser, the only way is to Clear Data.

Logic in the controller was in hope of when clearing the input field memory would be released but it is not the case.

Chrome version is 49.0.2623.105 (Official Build) (32-bit)




Aucun commentaire:

Enregistrer un commentaire