A Rant About Image Formats  [[3. Resources/Readwise/Full Document Contents/Articles/A Rant About Image Formats|Full Document Contents]] ## Document Notes --- tags: #ImageFormats #WebDevelopment #Webp #JpegXL Author: Theo - t3․gg Source: [YouTube Video](https://www.youtube.com/watch?v=pFNmS_HZ2Zs) Reference: [YouTube Transcript](https://merlin.foyer.work/) date created: 2024-09-12 15:45 --- # Title: My Hot Take on Image Formats: Why WebP Still Wins ## Table of Contents: - [[#📝 Summary:]] - [[#📖 Main Content:]] - [[#🗒️ Notes:]] - [[#📖 References:]] - [[#🗣️ Paraphrase:]] - [[#📰 Newsletter:]] - [[#✅ Action Items:]] - [[#🧪 Hypotheses:]] - [[#📊 Methodology:]] - [[#❓ Questions:]] - [[#🔮 Future Research:]] - [[#💡 Implications:]] - [[#🧠 Learning Styles Assessment:]] - [[#📊 Accessibility Assessment:]] - [[#🌍 DEIB (Diversity, Equity, Inclusion, and Belonging) Assessment:]] - [[#✅ Logical Validity]] - [[#🔍 SEO Evaluation]] - [[#🎯 Conclusion]] ## 📝 Summary: In this video, the creator explains the ongoing debate surrounding image formats, with a particular focus on WebP, JPEG XL, and AVIF. He advocates for WebP as a balanced option, offering transparency, lossless compression, and broad browser support, all while maintaining low CPU processing costs. Although JPEG XL and AVIF offer more advanced compression and quality options, their high CPU usage makes them less suitable for widespread use, especially for lower-powered devices. ## 📖 Main Content: ### 🗒️ Notes: - **WebP**: - Excellent compromise between file size, transparency, and CPU efficiency. - Widely supported (96.1% browser support). - Often faster to decode than alternatives like AVIF and JPEG XL. - **JPEG XL**: - Supports progressive loading, allowing images to render low-res versions while continuing to load in higher detail. - Higher compression ratios but much higher CPU demands. - Limited browser and software support, only supported in Safari. - **AVIF**: - Achieves significant file size reductions, but often at the cost of CPU efficiency. - Works best for small images, but lacks browser and software support for larger implementations. ## 📖 References: - [YouTube Video](https://www.youtube.com/watch?v=pFNmS_HZ2Zs) - [Can I Use? WebP](https://caniuse.com/webp) - [Web.dev](https://web.dev/) ## 🗣️ Paraphrase: 1. The creator emphasizes that WebP is an ideal middle-ground for web images, offering features like transparency and lossless compression at a low CPU cost. Its broad support across browsers makes it a practical choice, especially compared to newer formats like AVIF or JPEG XL, which may provide better compression but are CPU-intensive. 2. While AVIF and JPEG XL offer exciting capabilities, including higher compression and better progressive loading, their lack of support in mainstream software and browsers limits their current usefulness. WebP continues to strike a balance, making it the preferred choice for web developers focused on optimizing both performance and user experience. ## 📰 Newsletter: 🌐 **Image Format Showdown: WebP vs. AVIF vs. JPEG XL** – In this week’s issue, we take a deep dive into modern image formats and why **WebP** remains a top choice for developers. Despite the advanced compression capabilities of **JPEG XL** and **AVIF**, WebP strikes the perfect balance between CPU efficiency, file size, and browser support. Get insights on how each format stacks up and how to make the best choice for your next project. For more, [watch the video here](https://www.youtube.com/watch?v=pFNmS_HZ2Zs). ## ✅ Action Items: As a Developer Advocate focused on open source and WordPress, here’s how this content aligns with your goals: - **Advocacy**: Promote the use of efficient, open-source formats like WebP that reduce page load times without straining devices. Highlight WebP’s balance of performance and quality for web developers. - **Education**: Share insights with WordPress developers on how to implement WebP in their projects, optimizing image load times and reducing bandwidth usage. - **Contributor Engagement**: Leverage this discussion to encourage contributors to explore improving native WordPress support for progressive image formats like WebP and AVIF. ## 🧪 Hypotheses: 1. Implementing WebP across all websites could reduce average page load times by up to 25% compared to JPEG. 2. Devices with older CPUs may experience significant performance drops when decoding high-quality AVIF and JPEG XL images. ### 📊 Methodology: - **Data Source**: Website speed performance before and after switching to WebP, AVIF, and JPEG XL. - **Research Design**: Conduct A/B testing on websites with various image formats. - **Analysis Techniques**: Measure CPU load and page speed times across different devices and browsers. ### ❓ Questions: - What would the trade-offs be for developers if browsers widely adopted AVIF or JPEG XL as a standard? - How can WebP’s minor weaknesses, such as lack of progressive loading, be mitigated? ### 🔮 Future Research: - Explore the feasibility of integrating progressive image loading capabilities into WebP. - Investigate the CPU performance impacts of high-resolution AVIF images on mobile devices. ### 💡 Implications: Widespread research into image formats could significantly enhance web development practices. By optimizing image delivery, developers can reduce bandwidth usage and improve user experience, especially on low-powered devices and in regions with slower internet speeds. ## 🧠 Learning Styles Assessment: 1. **Visual Learners (Spatial)**: - **Present**: The video could use more infographics or comparisons between image formats. - **Improve**: Add charts showing compression vs. CPU trade-offs. 2. **Aural Learners (Auditory-Musical)**: - **Present**: The video format supports auditory learners. - **Improve**: Offer an audio summary or podcast version for auditory learners. 3. **Verbal Learners (Linguistic)**: - **Present**: The creator explains concepts well with detailed descriptions. - **Improve**: Include additional written resources or transcripts for deeper exploration. 4. **Physical Learners (Kinesthetic)**: - **Improve**: Suggest hands-on experiments, like optimizing images using WebP and comparing results in real-time. 5. **Logical Learners (Mathematical)**: - **Present**: The comparison of CPU usage and image quality appeals to logical thinkers. - **Improve**: Incorporate data graphs showing the performance impact of each format. 6. **Social Learners (Interpersonal)**: - **Improve**: Encourage discussions around preferred formats within development communities. 7. **Solitary Learners (Intrapersonal)**: - **Present**: Provides ample opportunity for reflection on image formats and choices. - **Improve**: Encourage individual projects testing different formats in web design. 8. **Naturalistic Learners**: - **Improve**: Draw parallels between digital efficiency (small file sizes) and environmental sustainability (reducing data transmission). ## 📊 Accessibility Assessment: - **Screen Reader Compatibility**: Ensure the video transcript is accessible for screen readers. - **Keyboard Navigation**: Verify the video player and any accompanying websites are fully navigable via keyboard. - **Contrast and Readability**: Ensure that any visual elements within the video use high-contrast colors. - **Text Resizing**: Ensure text in transcripts and summaries is scalable for readability. ## 🌍 DEIB (Diversity, Equity, Inclusion, and Belonging) Assessment: - **Cultural Relevance**: Include case studies or examples from diverse global regions, especially focusing on how different devices handle image formats. - **Inclusive Language**: Maintain gender-neutral, inclusive language throughout the video. - **Neurodiversity Support**: Break down complex ideas into smaller, more digestible chunks to support individuals with ADHD or other cognitive conditions. - **Representation**: Ensure the examples presented in the video reflect a wide range of user needs and experiences. - **Psychological Safety**: Present the information in a non-confrontationa > [!note]+ Document Notes > tags: [ImageFormats, WebDevelopment, Webp, JpegXL] > Author: > Theo - t3․gg > Source: [YouTube Video](https://www.youtube.com/watch?v=pFNmS_HZ2Zs) > Reference: [YouTube Transcript](https://merlin.foyer.work/) > date created: 2024-09-12 15:45 > > # Title: My Hot Take on Image Formats: Why WebP Still Wins > <!-- deep-read:sections start --> ## Table of Contents: - [📝 Summary](#-summary) - [📖 Main Content](#-main-content) - [🗒️ Notes](#-notes) - [📖 References](#-references) - [🗣️ Paraphrase](#-paraphrase) - [📰 Newsletter](#-newsletter) - [✅ Action Items](#-action-items) - [🧪 Hypotheses](#-hypotheses) - [📊 Methodology](#-methodology) - [❓ Questions](#-questions) - [🔮 Future Research](#-future-research) - [💡 Implications](#-implications) - [🧠 Learning Styles Assessment](#-learning-styles-assessment) - [📊 Accessibility Assessment](#-accessibility-assessment) - [🌍 DEIB Assessment](#-deib-assessment) - [✅ Logical Validity](#-logical-validity) - [🔍 SEO Evaluation](#-seo-evaluation) - [🎯 Conclusion](#-conclusion) ## 📝 Summary: In this video, the creator explains the ongoing debate surrounding image formats, with a particular focus on WebP, JPEG XL, and AVIF. He advocates for WebP as a balanced option, offering transparency, lossless compression, and broad browser support, all while maintaining low CPU processing costs. Although JPEG XL and AVIF offer more advanced compression and quality options, their high CPU usage makes them less suitable for widespread use, especially for lower-powered devices. ## 📖 Main Content: ### 🗒️ Notes: - **WebP**: - Excellent compromise between file size, transparency, and CPU efficiency. - Widely supported (96.1% browser support). - Often faster to decode than alternatives like AVIF and JPEG XL. - **JPEG XL**: - Supports progressive loading, allowing images to render low-res versions while continuing to load in higher detail. - Higher compression ratios but much higher CPU demands. - Limited browser and software support, only supported in Safari. - **AVIF**: - Achieves significant file size reductions, but often at the cost of CPU efficiency. - Works best for small images, but lacks browser and software support for larger implementations. ## 📖 References: - [YouTube Video](https://www.youtube.com/watch?v=pFNmS_HZ2Zs) - [Can I Use? WebP](https://caniuse.com/webp) - [Web.dev](https://web.dev/) ## 🗣️ Paraphrase: 1. The creator emphasizes that WebP is an ideal middle-ground for web images, offering features like transparency and lossless compression at a low CPU cost. Its broad support across browsers makes it a practical choice, especially compared to newer formats like AVIF or JPEG XL, which may provide better compression but are CPU-intensive. 2. While AVIF and JPEG XL offer exciting capabilities, including higher compression and better progressive loading, their lack of support in mainstream software and browsers limits their current usefulness. WebP continues to strike a balance, making it the preferred choice for web developers focused on optimizing both performance and user experience. ## 📰 Newsletter: 🌐 **Image Format Showdown: WebP vs. AVIF vs. JPEG XL** – In this week’s issue, we take a deep dive into modern image formats and why **WebP** remains a top choice for developers. Despite the advanced compression capabilities of **JPEG XL** and **AVIF**, WebP strikes the perfect balance between CPU efficiency, file size, and browser support. Get insights on how each format stacks up and how to make the best choice for your next project. For more, [watch the video here](https://www.youtube.com/watch?v=pFNmS_HZ2Zs). ## ✅ Action Items: As a Developer Advocate focused on open source and WordPress, here’s how this content aligns with your goals: - **Advocacy**: Promote the use of efficient, open-source formats like WebP that reduce page load times without straining devices. Highlight WebP’s balance of performance and quality for web developers. - **Education**: Share insights with WordPress developers on how to implement WebP in their projects, optimizing image load times and reducing bandwidth usage. - **Contributor Engagement**: Leverage this discussion to encourage contributors to explore improving native WordPress support for progressive image formats like WebP and AVIF. ## 🧪 Hypotheses: 1. Implementing WebP across all websites could reduce average page load times by up to 25% compared to JPEG. 2. Devices with older CPUs may experience significant performance drops when decoding high-quality AVIF and JPEG XL images. ### 📊 Methodology: - **Data Source**: Website speed performance before and after switching to WebP, AVIF, and JPEG XL. - **Research Design**: Conduct A/B testing on websites with various image formats. - **Analysis Techniques**: Measure CPU load and page speed times across different devices and browsers. ### ❓ Questions: - What would the trade-offs be for developers if browsers widely adopted AVIF or JPEG XL as a standard? - How can WebP’s minor weaknesses, such as lack of progressive loading, be mitigated? ### 🔮 Future Research: - Explore the feasibility of integrating progressive image loading capabilities into WebP. - Investigate the CPU performance impacts of high-resolution AVIF images on mobile devices. ### 💡 Implications: Widespread research into image formats could significantly enhance web development practices. By optimizing image delivery, developers can reduce bandwidth usage and improve user experience, especially on low-powered devices and in regions with slower internet speeds. ## 🧠 Learning Styles Assessment: 1. **Visual Learners (Spatial)**: - **Present**: The video could use more infographics or comparisons between image formats. - **Improve**: Add charts showing compression vs. CPU trade-offs. 2. **Aural Learners (Auditory-Musical)**: - **Present**: The video format supports auditory learners. - **Improve**: Offer an audio summary or podcast version for auditory learners. 3. **Verbal Learners (Linguistic)**: - **Present**: The creator explains concepts well with detailed descriptions. - **Improve**: Include additional written resources or transcripts for deeper exploration. 4. **Physical Learners (Kinesthetic)**: - **Improve**: Suggest hands-on experiments, like optimizing images using WebP and comparing results in real-time. 5. **Logical Learners (Mathematical)**: - **Present**: The comparison of CPU usage and image quality appeals to logical thinkers. - **Improve**: Incorporate data graphs showing the performance impact of each format. 6. **Social Learners (Interpersonal)**: - **Improve**: Encourage discussions around preferred formats within development communities. 7. **Solitary Learners (Intrapersonal)**: - **Present**: Provides ample opportunity for reflection on image formats and choices. - **Improve**: Encourage individual projects testing different formats in web design. 8. **Naturalistic Learners**: - **Improve**: Draw parallels between digital efficiency (small file sizes) and environmental sustainability (reducing data transmission). ## 📊 Accessibility Assessment: - **Screen Reader Compatibility**: Ensure the video transcript is accessible for screen readers. - **Keyboard Navigation**: Verify the video player and any accompanying websites are fully navigable via keyboard. - **Contrast and Readability**: Ensure that any visual elements within the video use high-contrast colors. - **Text Resizing**: Ensure text in transcripts and summaries is scalable for readability. ## 🌍 DEIB (Diversity, Equity, Inclusion, and Belonging) Assessment: - **Cultural Relevance**: Include case studies or examples from diverse global regions, especially focusing on how different devices handle image formats. - **Inclusive Language**: Maintain gender-neutral, inclusive language throughout the video. - **Neurodiversity Support**: Break down complex ideas into smaller, more digestible chunks to support individuals with ADHD or other cognitive conditions. - **Representation**: Ensure the examples presented in the video reflect a wide range of user needs and experiences. - **Psychological Safety**: Present the information in a non-confrontational, inclusive manner that welcomes all viewers to engage in the discussion. ## ✅ Logical Validity: - **Sound Deductive Reasoning**: The argument for WebP being the best balance between file size, performance, and browser support is valid, backed by strong evidence. - **Causal Reasoning**: The creator effectively explains how CPU performance directly impacts image rendering. - **Appeal to Facts/Evidence**: The video uses data on compression and CPU performance to support the argument. ## 🔍 SEO Evaluation: 1. **Keywords**: - **Present**: Keywords like "WebP," "image format," and "JPEG XL" are used effectively. - **Improve**: Add more long-tail keywords like "WebP vs AVIF" or "best image format for websites." 2. **Meta Description**: - **Improve**: Ensure the video’s meta description includes the keywords "image formats," "WebP," and "compression." 3. **Title Tag**: - **Present**: Title is clear but could include keywords like "comparison of WebP, JPEG XL, AVIF." 4. **Headers (H1, H2, H3)**: - **Present**: Headers are clear but could incorporate keywords for SEO. 5. **Content Length**: - **Present**: The video and transcript are detailed, offering over 2,000 words of valuable content. 6. **Internal and External Links**: - **Improve**: Add links to external image format resources and internal links to related web development content. 7. **Mobile Optimization**: - **Present**: Ensure the transcript and video are optimized for mobile viewing. ## 🎯 Conclusion: This video highlights the ongoing debate over image formats, focusing on WebP as the ideal choice for most web developers. While formats like JPEG XL and AVIF offer better compression, they come at the cost of higher CPU usage and limited software support, making WebP a more balanced and efficient choice for the majority of use cases. Short Summary for [A rant about image formats](https://www.youtube.com/watch?v=pFNmS_HZ2Zs) by [Merlin](https://merlin.foyer.work/) Short Video Title: The Rant About Image Formats and AV1 - Theo's Take on WebP vs. AVIF [00:03](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=3) Defending the advantages of the WebP image format. [01:54](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=114) Comparison of different image formats [06:00](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=360) SVG is scalable but requires more CPU power for processing. [08:00](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=480) JPEG XL allows for extreme compression and efficient processing. [12:32](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=752) JPEG XL format offers progressive loading with immediate blurry image display [14:39](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=879) JPEG XL and AVIF offer better compression compared to JPEG with less data loss. [18:04](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1084) AVIF format has limitations in compression and color space compared to other image formats. [19:37](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1177) Smaller image formats lead to faster page loading [23:07](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1387) WebP and AVIF formats provide better color and shadowing compared to JPEG [24:57](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1497) JPEG rendering process leads to high CPU cost [28:24](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1704) JPEG XL could replace JPEG for standard web content. [30:19](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1819) Optimizing image formats for faster website loading [34:00](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=2040) JPEG 2000 and JPEG XL have good decoding behaviors. [35:43](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=2143) Convert new image formats to JPEG or PNG by default for user convenience. --------------------------------- Detailed Summary for [A rant about image formats](https://www.youtube.com/watch?v=pFNmS_HZ2Zs) by [Merlin](https://merlin.foyer.work/) Short Video Title: The Rant About Image Formats and AV1 - Theo's Take on WebP vs. AVIF [00:03](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=3) Defending the advantages of the WebP image format. - WebP offers smaller file sizes, higher quality images, and transparency. - Challenges faced with compatibility issues in various platforms with WebP usage. [01:54](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=114) Comparison of different image formats - Different image formats like jpeg, PNG, SVG, webp, avif, and jpeg Excel are discussed. - Details about lossless support, compression, alpha transparency, and browser support for each format. [06:00](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=360) SVG is scalable but requires more CPU power for processing. - SVG describes image shapes, so it can be scaled up or down dynamically, but it requires more CPU power to process than PNG or JPEG. - Webp format is more compressed, takes more CPU to process, but reduces data for download. AVIF and JPEG XL also require large CPU power for parsing due to heavy compression. [08:00](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=480) JPEG XL allows for extreme compression and efficient processing. - The format is capable of compressing an image to an unbelievable extent, as seen with a 218-byte image. - Different image formats like webp, avif, and JPEG XL vary in energy consumption and processing efficiency. [12:32](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=752) JPEG XL format offers progressive loading with immediate blurry image display - JPEG XL format loads one pixel from each chunk initially, then scales up resolution gradually - However, JPEG XL format is more complex CPU-wise and comes at a cost [14:39](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=879) JPEG XL and AVIF offer better compression compared to JPEG with less data loss. - Google's goal with JPEG XL is to make images load better and faster on the web. - Google prefers WebP not because they invented it but due to CPU performance concerns for older devices. [18:04](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1084) AVIF format has limitations in compression and color space compared to other image formats. - AVIF format focuses on progressively saving more data in each frame which results in larger file sizes and poorer color spaces. - AVIF and JPEG XL formats are not well supported by software and browsers, leading to slow loading times and low compatibility. [19:37](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1177) Smaller image formats lead to faster page loading - Different image formats have varying levels of storage savings - The encoding cost for each image format affects rendering speed [23:07](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1387) WebP and AVIF formats provide better color and shadowing compared to JPEG - WebP offers more even coloring and better shadows with less blockiness - AVIF shows significant improvement in sharpness compared to WebP [24:57](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1497) JPEG rendering process leads to high CPU cost - It renders images multiple times in different passes - JPEG XL and AVIF offer alternative approaches with trade-offs [28:24](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1704) JPEG XL could replace JPEG for standard web content. - JPEG XL offers benefits of the AVIF format without lossy compression. - Using JPEG XL or even standard JPEG can significantly reduce image file sizes for better web performance. [30:19](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=1819) Optimizing image formats for faster website loading - By using smaller image formats like jpeg XL or webp, website loading time can be reduced significantly. - Progressive decoding features of jpeg XL can provide different resolutions of images without separate versions, but the CPU cost may not be worth it. [34:00](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=2040) JPEG 2000 and JPEG XL have good decoding behaviors. - Alpha transparency is not supported except in JPEG 2000. - WebP format aims for fast loading, not compatibility with other programs. [35:43](https://www.youtube.com/watch?v=pFNmS_HZ2Zs&t=2143) Convert new image formats to JPEG or PNG by default for user convenience. - Suggests a Chrome extension to easily save images in desired format. - Discusses benefits and drawbacks of using webp format on web pages. <!-- deep-read:sections end --> ## Highlights - I defend webp if you've never seen a webp file before I don't know if you're actually online but in case you somehow haven't it's a new image file format that Google introduced long enough ago I shouldn't be calling it new anymore honestly it was made with the goal of doing a few things making images on the web smaller higher quality and allowing for transparency in places where you couldn't before because before webp you basically had two options the first was PNG which was lossless whatever you put in you get out and with a PNG you could have transparency so you can have pixels that aren't actually there so you can put an image on the bottom and have it overlaid and stuff like that transparency is really important and PNG supporting Alpha channels was huge your other option was jpeg which can be compressed massively so it's not going to be the exact same image that you exported from your program but it can be 10 plus times smaller but it also doesn't support transparency so there's a balance here pgs are really good quality and allow for transparency but they're massive or jpeg which doesn't allow for those things but is much much smaller webp was a fantastic solution cuz it fit right in the middle but people hate it because it doesn't work in all of the places that they want it to when they drag and drop it into word it doesn't show up properly if they try to send it as an email attachment it is a file instead of an image these types of things are real complaints and they make a lot of sense but the Alternatives I've seen people propose make none another way to look at this video isn't so much a rant about why I love webp rather this is a rant but why I hate av1 yes I'm going to come out and say it the avif standard is it is really really bad and we're going to break down why so let's get started before yall spam my goddamn comment section yes I've seen the two clicks fill up video it's pretty good but it misses a lot of important pieces that we need to discuss which is why we're going to break this all down and I'm afraid this is one of those videos where I'm going to have to make a chart on the top we're going to have the different image formats we'll have jpeg PNG SVG is going to be weird to put in here but I'll do my best webp avif which is the av1 image format and jpeg Excel and there's a lot of different things we have to think about as we talk about these so the first question does it support lossless PNG does SVG does but in a weird way webp Believe It or Not does also pretty sure avf does jpeg does not and I'm pretty sure Excel does not as well but now for more importantly compression so can you compress the image can you make it smaller this is going to be basically inversed where jpeg yes webp yes avf yes and jpeg XL yes but PNG and SVG cannot be compressed in any meaningful way now jxl does do lossless cool I was not sure if they had a quality 100 option that actually was lossless good to know next we have Alpha which is transparency as we mentioned before jpeg does not and thankfully basically everything else does so that's huge we don't have to worry about that as much anymore all modern formats support Alpha channels but here is where we get to start being spicy and people are going to start being mad and that's fine we're all mad sometimes it's usually about things we're wrong about so let's cover those things the next one greater than 90% browser support obviously jpeg has this obviously PNG has this thankfully SVG has this it wasn't easy to get there but we are there today however webp is there too can I use is a great resource for checking these types of things if we take a look at webp 96.1% of global users have a browser that supports webp so that's in a really good spot can I use for avf is also very close here if you want to use the av1 image format you can use that on almost every browser and it will work so we go back here put the check there but here is where things start to fall apart for jpeg XL there was a thing that two click said in this video that is so wrong that ([View Highlight](https://read.readwise.io/read/01j7kp74xyka9w9xtj9q74c84g))