Better Form Uploads

by , June 25, 2013

Old Form Uploads

Our existing web applications have used a solid "form upload" mechanism for years, which serves as a fallback for people who cannot (or choose to not) use our Java applets for accelerated uploads. However, as more time goes by, the more it is showing its age. Here are the current limitations:

  • HTTP POST (used for the upload) is a "blocking" call. The user interface becomes frozen during the upload.
  • Because of the above, progress updates are sent from the server and displayed in a small separate window
  • Files are chosen one at a time
  • Files are sent as a single serialized stream

Better Form Uploads with XHR2

In imminent releases of our web applications (as well as the servlet component of FileCatalyst Direct and the standalone version of the HTTP Tunneling Servlet) we have implemented completely revised mechanisms based on XHR2. Without boring you with the technical details (if you are a developer, click here for those: xhr2-uploads-intro) what it boils down to is that our problems are solved with newer APIs that come with modern browsers:

  • Although POST is still used, the call is asynchronous and therefore is no longer "blocking". The user interface can be updated and remains interactive.
  • Because of the above, progress updates are derived from the client side and can be rendered directly in the main page. No separate window is required.
  • Multiple files may be selected either by drag-and-drop or using the operating system's filesystem browse dialog
  • Files can be sent as individual streams. This creates greater efficiencies in the transport.

During the development, we saw an opportunity to create a nice-looking "Drag and Drop" widget. Gone are the stacks of "choose a file" buttons. The new interface also provides visual cues for accepted or denied actions, and animations for elements that become usable or not. Everything is not only modernized in terms of the file mechanism, but also in terms of the user interface.

Beneficial Side Effects!

By exploring what was available for both legacy and XHR2 methods, we also discovered a way to improve the legacy method. By sending the files through an iFrame, the UI is no longer "blocked" and progress updates can occur in the main window now, even for legacy form transfers. However, the progress still comes from the server side in that case. Still, interesting to improve every aspect of the application, even those we anticipate will rarely be used or seen.

Conclusion

Look for the new mechanisms in FileCatalyst Webmail and Workflow v4.9, as well as FileCatalyst Direct v3.4 and beyond. They are an improvement in every way, and we hope they will serve you well!

Tags: , , ,

No Comments Yet

Be the first to respond!

Sorry, comments for this entry are closed at this time.