Badass JavaScript

A showcase of awesome JavaScript that pushes the boundaries of what's possible on the web, by @devongovett.

Resumable.js: Fault Tolerant Resumable File Uploads in JavaScript

January 24th 2012

Ever had an experience on a website where you’re uploading a really big file and its taking a while, you’re not quite sure how much its uploaded, and then after a few minutes of uploading, something fails and you have to start over again?  With the new HTML5 file APIs and Resumable.js, this problem will be lessened thanks to our newfound ability to actually resume large file uploads where they left off if they fail rather than start over from the beginning.

Resumable.js works by splitting the file into multiple small chunks using the HTML5 file API and then uploads the chunks one at a time until the whole file has been sent.  If any of the chunks fail to upload correctly, only that chunk needs to be re-uploaded.  Additionally, it enables the user to pause and resume uploads without losing state, and even works if the user goes offline and then online again or even if the server crashes and restarts.  Pretty cool!  It supports both file inputs and drag and drop uploading, progress events, multiple simultaneous uploads and more.  And the best part is that it isn’t some terrible flash uploader like we’ve seen for years.  Awesome!

Here’s a video showing Resumable.js in use:

You can check out Resumable.js on Github here.  Enjoy!