Squoosh grows up: new codecs, a fresh UI, and a CLI

When the Squoosh team introduced the image compression app at Chrome Dev Summit in 2018, the idea was to give developers a simple way to experiment with codecs and see what the modern web could do. Today the project is shipping a major update: new codec support, a redesigned interface, and a command-line companion called Squoosh CLI.

Beyond browser-native codecs

Squoosh has always leaned on WebAssembly to make codecs available even when a browser hasn't implemented them natively. That approach now covers OxiPNG, MozJPEG, WebP, and AVIF alongside whatever encoders and decoders your browser ships with. By compiling codecs to WebAssembly modules, the app lets users try current and emerging formats without waiting on browser releases.

Squoosh, sans UI

From the start, users asked for a way to drive Squoosh programmatically. The team was hesitant at first since the app wrap a UI around codec tools that already had command-line interfaces. But bundling all those codecs into one tool has its own appeal, and Squoosh CLI is the result.

Squoosh CLI is currently in beta. Install it with npm i @squoosh/cli or run it on the fly with npx @squoosh/cli [parameters]. It's written in Node and reuses the exact same WebAssembly modules as the PWA. Workers handle decoding, processing, and encoding in parallel, while Rollup bundles everything into one JavaScript file to keep npx installs fast. There's also an auto compression mode that lowers image quality as far as possible without visible degradation, judged by the Butteraugli metric.

The CLI opens up workflow options that the PWA can't. For example, you can compress the same image into multiple formats and let the <picture> element choose the right one at render time. The roadmap includes Webpack, Rollup, and other build-tool plugins so image compression could slot into existing build pipelines.

Why the build changed

Squoosh started on Webpack in 2018, in part because the team wanted hands-on experience with it and it gave them the control the project needed. After spending much of this year studying bundlers for Tooling Report, the team decided to shift Squoosh's build from Webpack to Rollup. Rollup's plugin system and simpler ESM handling made it the better fit for an app already structured around modules.

A clearer, more playful design

The updated UI introduces blobs as a motif, doubling as a nod to the way Squoosh passes image data internally. Color is used more deliberately now: beyond decoration, it helps distinguish which image is active in the editing view. The result is a more vibrant homepage and a tool that reads more cleanly once you're in an editing session.

What's on the horizon

Squoosh's purpose remains constant: when a new image format lands, there should be a low-effort place to try it. The team also wants to see Squoosh CLI integrate more deeply into application build processes.

The project has been open source since day one, but community growth wasn't a priority. That's changing in 2021, with plans to build better contributor onboarding and expand the contributor base. Feature ideas can go to the GitHub issue tracker, though the team is heading into an extended winter vacation and won't respond until the new year.