Fast as f**k boi🏃‍♂️‍➡️

Hi there 👋! Recently, I discovered some 💎 gems that can optimize your website's images and videos without compromising quality!

Why Should We Optimize Images? 🤔

Small image size = ⚡ Faster website load times.

🏞️ AVIF Format

If you're already familiar with image compression, you probably know about the WebP format, which is optimized for the web. Recently, I came across the AVIF format, and the results after compression are insane.

There’s a huge difference in image size after compression, with no noticeable loss in quality. Here are a couple of tools you can use for compression 👇:

Squoosh Tool

Squoosh is an open-source image compression tool by Google that supports a lot of formats. You can check it out here.

Here are the results of compressing an image:

• Before compression: 2.92 MB
• After compression: 190 KB 🔥
• Browser support: 92% (Check it at Can I use)
• AVIF format doesn’t support animated image compression (e.g., GIFs).

Sharp JS

Sharp is a popular image compression library for JavaScript. Here's an example of how you can compress an image to AVIF format using it:

import sharp from "sharp";
import path from "path";
import process from "process";
 
const rootDir = process.cwd();
const inputImagePath = path.join(rootDir, "/images/profile.jpg");
const outputImagePath = path.join(rootDir, "/images/compressed/profile.avif");
 
try {
  const response = await sharp(inputImagePath).avif().toFile(outputImagePath);
  console.log({ response });
} catch (error) {
  console.log({ error });
}

🎥 Handbrake

Handbrake is a video compression tool that I found when trying to embed a video into my company’s website. It compressed a video from 22 MB to less than 1 MB—without sacrificing quality!

Handbrake is free, open-source, and available for macOS, Windows, and Linux. You can get it here.

It comes with a lot of features:

• Resizing
• Web optimization

Give these tools a try! Fun fact: The thumbnail for this blog was generated using ChatGPT.

That’s it for this blog! Thanks for reading. Stay tuned, and peace ✌️!