Spade shape with cobalt blue background

Performance Newsletter

Archives
Calibre Monitoring
Free Speed Tools
Log in
Subscribe
20 September 2023

⚡ 135: Web sustainability guidelines

͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏
 
Performance Newsletter
[issue 135 ]()
 
#### Editor’s note
 
It’s highly relevant to feature a guide to web sustainability just days after [a research paper outlining how six out of nine planetary boundaries are now exceeded](https://www.stockholmresilience.org/research/research-news/2023-09-13-all-planetary-boundaries-mapped-out-for-the-first-time-six-of-nine-crossed.html), jeopardising all life on Earth. I’m writing this from Australia, where it’s only the beginning of spring, yet the temperature averages align with summer. Total fire bans and fire danger alerts already raised—the living proof of where we’re at.
 
As Web Sustainability Guidelines (and other similar projects) outline, performance is an integral part of building a resilient, sustainable web. Legislation to highlight how critical sustainability is isn’t far behind. From 2024, in the European Union, many companies will start reporting on sustainability due to the [Corporate Sustainability Reporting Directive (CSRD)](https://finance.ec.europa.eu/capital-markets-union-and-financial-markets/company-reporting-and-auditing/company-reporting/corporate-sustainability-reporting_en).

Business reasons and legislation aside, we simply cannot afford not to do absolutely everything to reduce carbon emissions, which includes what and how we build for the web.
 
Karolina
 
 
 
 
#### What’s Performance newsletter?
 

Performance Newsletter is a fortnightly mailing by [Calibre](https://calibreapp.com), featuring web performance tools, talks and resources.

Don’t worry—we don’t spam. If you’d like to leave, [unsubscribe]() at any time. Suggest content [here. ](mailto:[email protected])

 
 
 
# Articles  
 
Code example of setting Lighthouse performance budgets
 
### [Web Sustainability Guidelines (WSG) 1.0](https://w3c.github.io/sustyweb/)
 
[Alexander Dawson](https://alexanderdawson.com/) & [Tim Frick](https://www.linkedin.com/in/timfrick/)

This community report group focuses on defining and actioning sustainability principles on the web, including a heavy emphasis on web performance. Find out how we all should contribute to a more clean, efficient, open, honest, regenerative and resilient web.

 

 
Code example showing conditional loading of CSS for a section
 
### [Announcing new Liquid features for better web performance](https://performance.shopify.com/blogs/blog/announcing-new-liquid-features-for-better-web-performance)
 
[Sia Karamalegos](https://sia.codes/)

Shopify added default lazy loading to images down the page, as well as new section properties to fine-tune performance. Check out this walkthrough with code examples on how to tweak your themes.
 

 
 
 
# Case Studies  
 
Table showcasing metrics for mobile and desktop and their changes caused by the web performance work
 
### [How prefetching helped Terra increase ads click-through rate by 30% and speed up Largest Contentful Paint](https://web.dev/terra-prefetching-case-study/)
 
[Guilherme Moser de Souza](https://github.com/gui-poa) & [Thierno Thiam](https://github.com/thierhost)
When used with care, prefetching can have a tremendous impact on page load. Learn how Terra carefully implemented this fetching technique to improve business and performance metrics.
 
 
 
# Browsers  
 
### [Release notes for Safari Technology Preview 178](https://webkit.org/blog/14435/release-notes-for-safari-technology-preview-178/)
 
[Jon Davis](https://mastodon.social/@jondavis)

A few performance-oriented changes landed in Safari: fetch priority is now enabled by default, and responsive images are enabled in <link rel=preload>.

 
### [Largest Contentful Paint change in Chrome 116 to better handle animated content](https://chromium.googlesource.com/chromium/src/+/refs/heads/main/docs/speed/metrics_changelog/2023_08_lcp.md)
 
Videos and animated images can be the Largest Contentful Paint candidates with Chrome 116. If you’re using those elements, find out how this change will affect your metrics.
 
 
 
# Courses, Talks & Podcasts  
 
### [Exploring the true measure of user experience: Core Web Vitals & beyond](https://redcircle.com/show/a4faed6e-afe0-4a65-b4e7-de790ee67d4b/ep/50b62d02-2caa-4bb0-8c08-3488390f9ece)
 
[Barry Pollard](https://www.tunetheweb.com/), [Dan Shappir](https://www.linkedin.com/in/dshappir/?originalSubdomain=il) & [Charles Wood](http://charlesmaxwood.com/)
Tune in to understand the importance of Core Web Vitals, the influence of location and device speed, the challenges in presenting aggregated data on performance and much more.
 
 
Calibre
 
This email is brought to you by the team at [Calibre](https://calibreapp.com). We automate web performance testing, reporting and alerting, so you don’t have to.
 
 

Performance Newsletter is sent from the traditional lands of the Wurundjeri people of the Kulin nation. We acknowledge that sovereignty was never ceded and pay respects to the Elders past and present.

Send your suggestions, links and feedback to [[email protected]](mailto:[email protected]).

[View or share this email →]()
[Quickly unsubscribe →]()
[Browse older issues →]()

**Sent by**
Calibre Analytics

V119 / 425 Smith Street
Ngár-go
Fitzroy VIC 3065
Australia

 
Don't miss what's next. Subscribe to Performance Newsletter:
← Newer ⚡ 136: Low-quality image placeholders for performance Older → ⚡ 134: Layout positioning and web performance
perf.email
Bluesky
LinkedIn