This Github repo is the source code behind the website avif.io. You can use avif.io to convert a wide variety of file formats into AVIF, directly inside your web browser.
- Converted files are never sent to the server
- The entire conversion process is performed locally
- Unlimited conversions, even in bulk
- Flexible and userfriendly interface
- Options to change quality and effort
We use Rust with wasm-pack
to compile a converter library into WASM and call the Rust code
in the browser, from a WebWorker. The program uses Rust's
image library to decode files,
and for encoding to AVIF we use a fork of rav1e
modified to allow for proper progress updates.
The Rust code is in conversion/
.
The root of the project is a Next.js application
written in TypeScript, based on React and Preact.
You can run the application via npm start
, and watch and reload the
files via npm develop
. The wasm-pack
ed Rust code ends up in public/dist
.
Building Rust requires cargo
and make
. To build the wasm
code for release, use:
cd conversion/
make wasm
This will also run webpack to move the produced WASM and JS
files to public/dist
. Keep in mind that when you clone the repository
the Rust code will already have been compiled, so you don't have to
do this step yourself.
Using make, you can use make wasm-debug
to build the WASM code
for debugging, or use make demo-debug
to build a demo binary
to test out the Rust code in a non-WASM environment.
At the time of writing, the image
library hasincomplete
support for the WebP format. Instead, we use a special build of
libwebp called webp_js,
which allows us to decode WebP files in the browser using the
canvas web API. This is important to keep in mind — WebP handling
is a special case at the moment, so don't be surprised that some
of the code is explicitly checking whether it's working with WebP.
You can find the related commands in the package.json file.
- ennmichael / Nikša
- mikqi / Muhammad Rivki
- ageofadz / Sam Robertson
- styfle / Steven