Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Updated sandbox link #25

Merged
merged 1 commit into from
Apr 29, 2024
Merged

Updated sandbox link #25

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions blog/2023-10-11-avif-webp-lands-in-editor.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ JPGs and PNGs have served us well. They're reliable and you can use them everywh
_Take a look at the following images:_

<iframe
src="https://codesandbox.io/embed/react-compare-image-forked-myp5cp?fontsize=14&hidenavigation=1&theme=dark"
src="https://codesandbox.io/embed/vmg4g3?fontsize=14&hidenavigation=1&theme=dark&hidedevtools=1"
style={{
width: "100%",
height: "500px",
Expand All @@ -33,7 +33,7 @@ _Take a look at the following images:_
sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
></iframe>

They look strikingly similar, but the file size tells a different story. The AVIF image on the left has a file size of just 276Kb, almost half the size of its JPG counterpart at 508Kb! This level of compression is not just impressive on its own. When you're working on a project with multiple textures, switching to AVIF and WebP formats could considerably reduce your overall load time.
They look strikingly similar, but the file size tells a different story. The AVIF image on the left has a file size of just 18Kb, and the JPG counterpart over 4 times larger at 74Kb! This level of compression is not just impressive on its own. When you're working on a project with multiple textures, switching to AVIF and WebP formats could considerably reduce your overall load time.

What does this mean for you? Well, that's simple: it's all about efficiency and speed without sacrificing quality. Textures are one of the biggest assets in a 3D project and AVIF and WebP significantly reduce image sizes compared to traditional JPEGs and PNGs and that means faster load times and happier users. 🙌

Expand Down