What is AVIF?

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • WorkOS - The modern identity platform for B2B SaaS
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • av1-avif

    AV1 Image File Format Specification - ISO-BMFF/HEIF derivative

  • Created by Alliance for Open Media and worked on by Netflix, Microsoft, and Google developers, AVIF is open source - you can even weigh in on image processing and spec issues.

  • image_compression_comparison

    Image Compression Comparison Framework

  • Netflix wanted to use HDR images. HDR uses software to increase the light and color in a photograph, producing larger images with large ranges of color. This meant they also needed to improve their image hosting. AVIF is a tool they're favoring. They have even documented their reasoning and testing, and you can clone their repo comparing different types of image compression.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • libavif

    libavif - Library for encoding and decoding .avif files

  • The Alliance for Open Media's AVIF encoding and decoding library is also in a Github repo. Sharp, a Node module, has AVIF support. To make AVIF images, you can use avif.io, Squoosh, and the Squoosh command line tool aimed at supporting Node.js apps. GIMP and Paint.net support AVIF and there are Photoshop plugins. Mac has no plans to support AVIF, but you can easily install a codec plugin on Windows 10 for native support.

  • avif.js

    :shipit: AVIF polyfill for the browser

  • The main downside is the lack of browser and CDN support. To use AVIF in your website today, you'll have to employ progressive enhancement, the type of which depends on how you're hosting your images. Another option is a polyfill. The other downside is the slow encoding speed and higher CPU requirements, which make dynamically creating images harder. However, the team has already made massive strides in speed in the short time AVIF has been around.

  • squoosh

    Make images smaller using best-in-class codecs, right in the browser.

  • The Alliance for Open Media's AVIF encoding and decoding library is also in a Github repo. Sharp, a Node module, has AVIF support. To make AVIF images, you can use avif.io, Squoosh, and the Squoosh command line tool aimed at supporting Node.js apps. GIMP and Paint.net support AVIF and there are Photoshop plugins. Mac has no plans to support AVIF, but you can easily install a codec plugin on Windows 10 for native support.

  • sharp

    High performance Node.js image processing, the fastest module to resize JPEG, PNG, WebP, AVIF and TIFF images. Uses the libvips library.

  • The Alliance for Open Media's AVIF encoding and decoding library is also in a Github repo. Sharp, a Node module, has AVIF support. To make AVIF images, you can use avif.io, Squoosh, and the Squoosh command line tool aimed at supporting Node.js apps. GIMP and Paint.net support AVIF and there are Photoshop plugins. Mac has no plans to support AVIF, but you can easily install a codec plugin on Windows 10 for native support.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts