Why a JQuery File Upload Solution Is Unsustainable

Image from Wooden Earth Ltd

 

A jQuery file upload solution is a generic fix for small sites, but it tends to unravel at scale. The cause of this can be found where three key trends have collided at a massive intersection:

1. Content is growing at an exponential rate: Content used to be curated and created by enterprises and uploaded for users to consume across the globe. However, within the last decade the content creation model has been inverted. Content creation has been decentralized and everyone is a content creator and consumer.  Content is now created at the “edges”, and applications have an ever growing problem of seamlessly integrating rich content within their application.
2. Mobile adoption has skyrocketed: With over 4 billion mobile users, a large proportion of the content created is on mobile devices. Mobile networks, while greatly improved over the last decade, pose a huge problem to transfer the content created on mobile devices.
3. Businesses are looking to connect with their users more than ever: In a cut throat competitive world where the barrier to inception of a business from an idea to a competing business is at an all time low, businesses are looking at ways to connect with their users. Leveraging content is a great way to achieve this, and intelligence derived from content is a necessity for businesses to succeed.

Courses of Action

So how does a business succeed in capitalizing on these trends and overcoming the problems that content explosion, unreliable networks and content intelligence pose to its success? One may say that businesses need to focus on their secret sauce of creating a differentiated offering and winning customers over. Completely agreed! But in order to focus on the secret sauce of differentiation, any time spent on handling content within your application will take your eye off the ball from creating that differentiation. In a world where moving fast is a prerequisite, many businesses fall in the trap of quickly integrating with many open source DIY file upload frameworks like jQuery File Upload, Plupload, Uppy and others. The barrier to using these tools may be low; however, would you risk your business in doing so?

The Filestack Alternative

Building a content ingestion stack yourself is diluting your focus from your core business, especially when there is a world class product that solves this problem for you. In the evolution curve of your software stack, it is very likely that you have (or will very soon), reach the OMG! point, where you realize that the open source tool that worked for very small file sets just does not scale well. Don’t scare away customers with an unreliable upload solution: adapt and integrate the Filestack API within minutes to take your business to the next level.

Where a jQuery File Upload falls short

Let’s see a few key use cases where an open source tool like jQuery or AJAX file upload falls terribly short of what a scalable offering should be.

Unreliable Network Connections:

Mobile networks are notoriously unreliable. Customers have grown to expect file uploads to work seamlessly. With resolutions of images and videos increasing with each passing day, the size of these files also keeps increasing. An average image clicked with a mobile device is approximately 3 MB and the average video is approximately 50 MB. Uploading these images over a mobile network, which typically have high packet loss and latency, is hoping against hope that the file will make it through. This experience is less than optimal for the users of your application. What is required is intelligent software that learns about the network conditions around the user and optimizes the upload process in a way that guarantees a successful transfer of the file.  Ask yourself whether you want to build and manage this or adapt and integrate with a world class API that already does this for you.  

File Uploads, no matter where the files reside:

A decade or so ago, content was localized to your desktop (and some on the mobile device). Fast forward to the present day and content has exploded. No longer does the content reside only on the desktop or mobile device, but it now is splintered across multiple cloud storage platforms. To deliver the optimal user experience, you have to enable your users to upload their content, regardless of where it resides. Dropbox, Box, Amazon S3, Microsoft Azure Blobs, Google Cloud Storage, Facebook, Instagram and many other social platforms must be integrated into your application to provide the ultimate experience. And while it sounds daunting from the get go, it gets worse once you have to consider authentication models, security, session management, cloud platform idiosyncrasies like file sizes and timeouts, and many other considerations. Ask yourself whether you want to build and manage this or Adapt and Integrate with a world class API that already does this for you.

Content Transformation and Intelligence:

To be impactful, effective and useful, content undergoes a journey of transformations. One example is document transformations. Today, content is created in many forms with software that is specialized for specific needs. Very often there is a single source of truth for a document, but the content of that document is consumed in many different ways. Content that is created in Microsoft Word, may have to be published as a pdf or an html file. Seamless transformations of document formats is something that content creators and consumers require.

Another example: images often have to be transformed to meet a certain size, a certain resolution, a certain degree of rotation, cropped to a certain size, “upscaled” to meet high resolution criteria, have red-eye removed for the portraying the true emotion behind a look, transformed to gray-scale or sepia, or transformed via compression to ensure that the image is of optimal size for delivering through a blazing fast CDN.

These image transformations are necessary to connect with your users – to provide them with an experience that leaves them immersed and engaged. Anything short of a stellar experience is a recipe to lose your user. If you can derive intelligence from the content that is uploaded by your users, you could use that insight to align your effort to attract more users that you can monetize. With advanced AI/ML techniques, wouldn’t it be great if you could always have your finger on the pulse of your users? Ask yourself whether you want to build and manage a software stack to provide this experience for your users or adapt and integrate with Filestack’s world class API.

 

Feature Comparison

Now that you have context of the magnitude of this problem and understand why building and maintaining a home-grown solution for content ingestion is significantly impactful to your business, let’s compare Filestack’s offering against jQuery-file-upload.

---

 

	jQuery-file-upload	Filestack
Content Uploads
Upload single file	✓	✓
Upload multiple files	✓	✓
Drag and Drop support	✓	✓
Upload progress bar	✓	✓
Cancelable uploads	✓	✓
Resumable uploads	✓	✓
Multipart uploads	✓	✓
Upload from URL	X	✓
Built-in image search for uploads	X	✓
JS assets served from CDN	X	✓
Upload content from cloud storage (AWS, Azure, Google Cloud, Box, Dropbox)	X	✓
Upload content from social media networks (Instagram, Facebook, Twitter, etc)	X	✓
Webcam support	X	✓
Audio recording	X	✓
Video recording	X	✓
Store content in leading cloud platforms (AWS, Azure, Google Cloud, Rackspace, Box)	X	✓
Intelligent Ingestion to guarantee uploads on unreliable networks (especially mobile)	X	✓
Ingestion Network (backend global network of nodes to speed uploads 10x by uploading to closest point of presence)	X	✓
Content Security
Security: Client side security	X	✓
Security: Direct to S3 uploads without interfacing with backend infrastructure	X	✓
Security: Encryption (in flight and at rest)	X	✓
Security: Data Segregation	X	✓
Security: Strong checks to ensure content integrity is maintained	X	✓
Content Transformation
Built in crop user interface	X	✓
Manually rotate files	X	✓
Document conversion	X	✓
Image borders and effects – rounded corners, vignette, polaroid, torn edges, shadows.	X	✓
Image filters – sharpen, blur, monochrome, black and white, sepia, pixilate, oil paint, negative, modulate, partial pixilation, partial blur	X	✓
Conversion pipeline	X	✓
Image compression	X	✓
Image conversion caching	X	✓
Audio transcoding	X	✓
Video transcoding	X	✓
Responsive images	X	✓
Watermark images	X	✓
Collage images	X	✓
Content Intelligence
Intelligence: AI/ML based Image object recognition	X	✓
Intelligence: AI/ML based Not Safe For Work (NSFW) image detection	X	✓
Intelligence: Insightful analytics on user behavior (uploads, bandwidth used, storage consumed)	X	✓
Content Delivery
Deliver: Deep Integration with Fastly	X	✓
Deliver: Integration with any CDN of choice	X	✓
Deliver: Instant access to CDN urls upon upload initiation	X	✓
Deliver: Instant access to content transformation before content is uploaded to target storage	X	✓
Content Integration at scale
Flexible integration via SDKs: Javascript, Ruby, PHP, Python	X	✓
iOS Native SDK	X	✓
Android Native SDK	X	✓
Webhooks	X	✓
Multi-threaded architecture	X	✓
Load-balanced, autoscaling, redundant infrastructure backend	X	✓
Customer-obsessed support
Dedicated world-class support	X	✓

 

---

Real World Test

To demonstrate the impact to your business, we performed some tests that simulate real-world scenarios. Content is often uploaded in less than optimal network conditions. The following shows the results of our tests in various network scenarios:

Quality of Service (QoS) on networks

It is common to find networks configured with quality of service constraints. These constraints are designed to throttle bandwidth.

---

 

	42 MB	6 MB	3 MB
Filestack	~100s	~21s	~10s
jQquery-file-upload	Upload failed	Upload failed	Upload failed

 

---

Bad network conditions

Testing a network with big request loss where loss is random 0-90% (common for mobile devices or faulty hardware).

---

 

	42 MB	6 MB	3 MB
Filestack	~17s	~11s	~7s
jQquery-file-upload	Upload failed	Upload failed	Upload failed

---

Adapt and Integrate

Building a modern application has evolved over the last few decades. What helps a business thrive is the differentiating value it offers. The need of the hour is for businesses to focus on the secret sauce that helps them differentiate and then tell a story to their users that really connects with them. In order to focus on your business, you need to be laser-focused on where you spend your time and money – now and in the future. Modern applications are built by integrating and assimilating the best in class API, each being the best at solving a specific problem.  Any modern application would integrate Twilio for communications, Stripe for payments, Algolia for site search. It is time to adapt and integrate with the leading API platform for Content Ingestion.

Filestack is the leader in content ingestion network services and seamlessly integrates edge content – reliably, scalably and quickness. With over 900 million files uploaded using the Filestack Content Ingestion API, a vibrant developer community of over 75,000, over 100,000 awesome applications built leveraging the Filestack API, a 99.999% reliability measure of file uploads and a world-class customer obsessed support organization, Filestack is here to help you focus on your business by taking care of all your content ingestion needs. Integrate the API within minutes and see your business thrive.  Adapt and Integrate! Don’t DIY … API!

What are you waiting for? Sign-up for free today and put uploading, cloud integration, and data intelligence pains to rest forever.

Read More →