Using HTML 5 and the Web API for AJAX file uploads with image preview and a progress bar

AJAX file uploads used to be a client / server process in HTML 4. They required a round trip to a server side module, usually using an IFRAME and constant querying of the number of bytes uploaded, then reloading a progress bar inside the IFRAME with the current progress value. Luckily HTML 5 has a level 2 XMLHttpRequest object that natively support file uploads. This makes it a breeze to give your users a great experience when uploading files to your application.