Trending

#ImagePerf

Latest posts tagged with #ImagePerf on Bluesky

Latest Top
Trending

Posts tagged #ImagePerf

Preview
Practical guide to the <img> element: from the basics to LCP | Joan León The <img> element has attributes that make a real difference in performance: loading, decoding, fetchpriority, srcset and sizes. A practical guide to using them well.

Practical guide to the <img> element: from the basics to LCP

joanleon.dev/en/guia-prac...

#WebPerf #ImagePerf #Performance #LCP #CoreWebVitals

10 2 0 0
Preview
Guía práctica del elemento <img>: de lo básico a LCP | Joan León El elemento <img> tiene atributos que marcan una diferencia real en rendimiento: loading, decoding, fetchpriority, srcset y sizes. Una guía práctica para usarlos bien.

Guía práctica del elemento <img>: de lo básico a LCP

joanleon.dev/posts/guia-p...

#WebPerf #ImagePerf #Performance #LCP #CoreWebVitals

2 2 0 0
Preview
How to optimize SVG files: A complete guide for beginners SVG files use mathematical formulas to create graphics, allowing infinite scaling without losing quality, and making them perfect for high-res displays and responsive design.

How to optimize SVG files: A complete guide for beginners

penpot.app/blog/how-to-... by @laurakalbag.bsky.social

#WebPerf #ImagePerf #SVG #Image

1 2 1 0
Web Sustainability Guidelines (WSG)

Optimize images for sustainability

"Ensure images, if required, are optimized, correctly formatted, and sized, with lazy loading as appropriate, and are managed effectively." - via @inesakrap.bsky.social's talk at @perfnow.nl

w3c.github.io/sustainablew...

#PerfNow #WebPerf #ImagePerf

12 3 0 0
Preview
Image format comparison: JPEG vs. PNG vs. WEBP vs. AVIF Discover the optimal image format for images. I compare JPEG, PNG, WebP, and AVIF in terms of file size, quality, and compression for photos and text images.

Image format comparison: JPEG vs. PNG vs. WEBP vs. AVIF

Great deep-dive into how image formats stack up — JPEG, PNG, WebP & AVIF — comparing size, quality & compression efficiency. 📸📊

A must-read for designers & web devs!

photutorial.com/image-format...

#Image #Performance #ImagePerf

2 2 0 0
GitHub Actions bot comment showing that images were automatically compressed by Calibre’s image-actions. The comment reports a 47.1% reduction in image size, saving 104.46 KB. A table displays one example file (‘Screen Shot 2020-09-17 at 3.29.33 pm.png’) reduced from 221.87 KB to 117.41 KB. It notes that 348 images did not require optimisation, and includes a ‘View diff’ link for visual comparison.

GitHub Actions bot comment showing that images were automatically compressed by Calibre’s image-actions. The comment reports a 47.1% reduction in image size, saving 104.46 KB. A table displays one example file (‘Screen Shot 2020-09-17 at 3.29.33 pm.png’) reduced from 221.87 KB to 117.41 KB. It notes that 348 images did not require optimisation, and includes a ‘View diff’ link for visual comparison.

#WebPerfTip

If you need a GitHub Action to automatically compresses JPEGs, PNGs and WebPs in pull requests, IMHO this is the best option

#WebPerf #ImagePerf #PerfTools #Image

1 0 1 0
Screenshot of an SVG file that includes an embedded image using base64 encoding. The image is inserted directly within the <image> tag using the xlink:href attribute, rather than linking to an external file. This means the entire image is stored inside the SVG as base64 data.

Screenshot of an SVG file that includes an embedded image using base64 encoding. The image is inserted directly within the <image> tag using the xlink:href attribute, rather than linking to an external file. This means the entire image is stored inside the SVG as base64 data.

#WebPerfTip Avoid embedding raster images directly in SVGs

ℹ️ In this case, the image is a vector graphic

#WebPerf #Perfomance #WPO #ImagePerf

0 0 1 0
Spectral images have a significant memory footprint because they store a large number of spectral bands. In this paper, we propose a lossy compression scheme that significantly reduces their file size with a negligible loss in quality. We use a cosine transform and separate overall brightness from the shape of the spectrum. The resulting channels are stored using JPEG XL, which provides state-of-the-art lossy compression.

Spectral images have a significant memory footprint because they store a large number of spectral bands. In this paper, we propose a lossy compression scheme that significantly reduces their file size with a negligible loss in quality. We use a cosine transform and separate overall brightness from the shape of the spectrum. The resulting channels are stored using JPEG XL, which provides state-of-the-art lossy compression.

Compression of Spectral Images using Spectral JPEG XL

jcgt.org/published/00...

#Image #ImagePerf #WebPerf #JpegXL

2 0 0 0
LinkedIn This link will take you to a page that’s not on LinkedIn

Looking how browsers choose the right image to load with srcset, dpr, and sizes

iankduffy.com/articles/loo... bu @duffeh.bsky.social

#WebPerf #Performance #ImagePerf #Image #Web #WPO

3 1 1 0
Preview
Squish - Batch Browser-based Image Compression Fast, efficient batch image compression right in your browser. Supports AVIF, JPEG, JXL, PNG, and WebP formats with adjustable quality settings.

Squish

Compress and convert your images to AVIF, JPEG, JPEG XL, PNG, or WebP

A great tool (by @addyosmani.bsky.social ) to optimize images in your browser.

squish.addy.ie

#WebPerf #Image #ImagePerf

8 1 2 0
Preview
Contemplating Codec Comparisons Cloudinary Senior Image Researcher Jon Sneyers offers his thoughts on latest codec comparison data from Google's AVIF Team.

Contemplating Codec Comparisons

cloudinary.com/blog/contemp...

#Image #WebPerf #Optimization #ImagePerf

3 0 1 0
580K Sites load images from S3 instead of a CDN, 
200K Sites load more than 1MB from S3

Source: HTTP Archive, October 2024

580K Sites load images from S3 instead of a CDN, 200K Sites load more than 1MB from S3 Source: HTTP Archive, October 2024

“580K Sites load images from
S3 instead of a CDN

200K Sites load more than
1MB from S3”

Great talk by Paul Calvano at @perfnow.bsky.social

#perfnow #WebPerf #ImagePerf

13 4 4 0