$cordovaFileTransfer is "blocking" the UI

cordova
1

Hello! I am working on an app (Ionic 1) where the users records multiple videos with the phone camera during a session and then wants to persist these videos by uploading them to our servers.

This is currently done by using $cordovaFileTransfer and the upload is working, but it is more or less blocking the UI because of heavy FPS drops, especially when uploading multiple videos simultaneously. Is there a solution to these FPS drops? The FPS drops makes the app unusable, and if you have a lot of videos it is unusable for a couple of minutes.

I’ve tried to implement a Web worker but I can’t figure out how to pass the $cordovaFileTransfer-plugin to the Web worker since it is not a “transferrable object”.

Best regards,
Macondele

2

Want to share some code? Also, have you tried using the plugin directly instead of using the ngCordova wrapper? If you can’t use $cordovaFileTransfer from ngCordova, maybe you can just do:

var ft = new FileTransfer();
ft.upload(fileURL, encodeURI("http://some.server.com/upload.php"), win, fail, options);

as described in the plugin docs: https://github.com/apache/cordova-plugin-file-transfer

3

I probably could. Have you used this cordova plugin before, did you experience any FPS drops?

4

Nope haven’t used it myself sorry. Just thought writing direct javascript might get you past the web worker issue.

I do find it surprising that you drop frames since this is an async call, but if you are uploading a very large file maybe Ionic just doesn’t handle that well.

5

I just checked some CPU metrics and it seems to go into almost 100% CPU load when uploading multiple files. Somehow I need to use a Web worker for this task or the app will become unusable for a couple of minutes…

6

Why don’t you just upload one file at a time. It’ll be the same speed as there’s only so much bandwidth, and it might not kill the cpu

7

Sorry for not replying back earlier. There was actually no problem with the plugin. The lag was caused because I updated the view with every progress-event, which means that I manipulated the DOM 130 times per second.

Not a great idea if you want 60 FPS :wink: