BT

Facilitating the Spread of Knowledge and Innovation in Professional Software Development

Write for InfoQ

Topics

Choose your language

InfoQ Homepage News Google Labs Announces Squoosh: Image Compression PWA

Google Labs Announces Squoosh: Image Compression PWA

This item in japanese

At the 2018 Google Chrome Developer Summit, Google announced Squoosh, an open source image compression Progressive Web App (PWA) that doubles as a practical demonstration of modern web technologies.

Squoosh provides a quick and easy mechanism for leveraging many image compression formats. Users may browse Squoosh.app, drag and drop an image into a browser tab, and experiment with many image optimization and conversion settings. The app displays before and after views side by side for the selected image compression settings.

Squoosh in its current form is likely not meant as a competitor to the numerous image compression apps, ranging from traditional image editing tools as Photoshop and Sketch.app to web-based services like TinyPNG, ImageResize.org, and Compressor.io, to various desktop apps.

Google Labs' primary objective with Squoosh is to demonstrate how advanced web apps can leverage modern technologies to deliver a high-performance experience in today's web browsers.

Squoosh leverages numerous technologies to deliver a solid experience:

Squoosh follows many modern patterns, including:

  • async/await
  • Canvas for image drawing
  • Decorators (currently the early draft version supported by TypeScript
  • meta, popularized by Dojo and others, for making a variety of properties available in a reactive architecture
  • Progressive Web Apps and service workers for offline usage
  • Reactive, virtual DOM architecture with JSX, popularized by React

Squoosh supported a variety of image compression formats including BMP, GIF, JP2, JPEG, MozJPEG, PDF, PNG, TIFF, and WebP. Support for image compression varies by browser. For example, Firefox supports encoding to BMP, and Safari defers encoding to the OS and supports more formats, whereas Chrome natively supports fewer formats. WebAssembly gets used by Squoosh for working with some image codecs not included in various browsers, and for the eonciding and decoding process.

Squoosh is available under the Apache 2 open source license. Contributions are welcome via the Squoosh GitHub project and should follow the Squoosh contribution guidelines.

Rate this Article

Adoption
Style

BT