Uppy 2.4-2.7: Image Compressor, Transloadit Rate Limiting, ESM
We’re always looking for opportunities to teach Uppy cool new tricks, and the past few months have been no exception. Since our most recent post in December, Uppy has continued to receive a steady stream of updates. This post covers all the improvements made in Uppy versions 2.4 through 2.7. Changes and additions include: image compression, improved Transloadit rate limiting and a lighter Dashboard plugin. We’ve also moved our end-to-end tests to Cypress, and are slowly converting plugins to ES modules (ESM).
Compressor
Some of the most commonly uploaded files on the internet are images — photos,
stock images, screenshots, and documents scans. Uppy now includes a new plugin
called @uppy/compressor
that optimizes images (JPEG, PNG), saving on average
up to 60% in size (roughly 18 MB for 10 images). It uses
Compressor.js under the hood.
Read the docs and try Compressor in action.
import Uppy from '@uppy/core';
import Compressor from '@uppy/compressor';
const uppy = new Uppy();
uppy.use(Compressor);
@uppy/compressor
is also the first plugin that we are releasing as ESM,
backwards compatible as CJS, to test out how this works. Please report any
issues.
Hosted Companion custom credentials
It cannot be overstated that our
Transloadit-hosted
Companion Plugin is the easiest secure way to
allow your users pick files from cloud sources like Google Drive, Instagram,
Box, etc. via Uppy. Up until now, however, that meant your users had to
authenticate their cloud account with Transloadit, preventing you from showing
your own logo instead. That has now been fixed! Head to Transloadit Console
/
Credentials
, scroll down to Third-party Credentials
, click on
Add new Credentials
, select Companion OAuth
, and voilà!
Try it out with the free Transloadit Community Plan — 5GB / month and access to Companion.
Transloadit rate limiting
We’ve added rate limiting to Transloadit assembly creation and status polling, and tus retries:
When the remote server responds with HTTP 429, all requests are paused for a while in the hope that it can resolve the rate limiting. Failed requests are now also queued up after the retry delay. Before, they were scheduled for retry without being queued up, which would sometimes end up overflowing the limit option.
As a result of this change, uploading many files at once has become even more robust.
Move to ESM
The JavaScript ecosystem is moving towards ESM, and we want to follow suit. We are slowly starting to adopt ESM in Uppy packages. To do so, we integrated a plugin into our build system that transpiles ESM source code to CommonJS syntax, which is distributed with the npm package. Nothing will change on your end, though – we know that not everyone is using tooling that support ESM, so we’re holding on to CommonJS for the time being. Our plan is to refactor all official Uppy plugins to ESM before Uppy 3.0 is released, and drop CommonJS in favor of ESM in the npm packages at that point.
For details, see PR 3468.
End to end: move to Cypress
Uppy has had end to end from the start, but the developer experience was less than ideal with custom Webdriver.io + Selenium. The transition to Cypress allows us to write tests with ease and comfort, backed by great documentation.
Lighter Bundle
We continue to look for ways to reduce Uppy’s bundle size and modernize our build toolchain. This time, we ’ve replaced the Exifr.js legacy bundle with the modern one without IE polyfills. Our Browserify bundler has been replaced with a modern and more efficient ESBuild.
Companion improvements
- Improved private IP check (#3403)
- Implement periodic ping functionality (#3246)
- Fix broken thumbnails for Box and Dropbox (#3460)
- Fix unpslash author meta, sanitize metadata to strings and improve Companion tests (#3478)
That’s it for today! See the full changelog for more details.