͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏
|
#### Editor’s note
|
| |
|
The truth is, we can game some speed metrics. But what might result in meeting a goal doesn’t translate to a better experience. In an ideal world, we should trust tools that claim to bring improvements. Speed gains should be genuine and demonstratable.
Sadly, [this isn’t always true](https://twitter.com/geekybiz/status/1429746730258427911). We can make an honest effort but fall for an empty promise because of marketing or lack of resources or skills to verify a claim. It’s hard!
Ultimately, while metrics are necessary, we need to remember what’s most critical is how well something works and feels.
|
| |
|
|
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
|
|
|
|
| |
 |
| |
|
### [Why lab and field data can be different (and what to do about it)](https://web.dev/lab-and-field-data-differences/)
|
| |
|
[Philip Walton](https://twitter.com/philwalton)
|
|
Lab and field speed testing are both invaluable but can yield different results. Variance then reduces trust in monitoring. Learn why those two settings differ.
|
|
|
| |
|
 |
| |
|
### [HTTP/3: Performance Improvements (Part 2)](https://www.smashingmagazine.com/2021/08/http3-performance-improvements-part2/)
|
| |
|
[Robin Marx](https://twitter.com/programmingart)
|
|
Are you feeling like reading a detailed deep dive? Learn how exactly QUIC and HTTP/3 improve web performance.
|
|
|
| |
|
 |
| |
|
What’s better than a thorough explanation of the AVIF image format usage and benefits that include cats? Find out how to implement AVIF today with an open source tool, imgproxy.
|
|
|
| |
|
 |
| |
|
### [Does shadow DOM improve style performance?](https://nolanlawson.com/2021/08/15/does-shadow-dom-improve-style-performance/)
|
| |
|
[Nolan Lawson](https://github.com/nolanlawson)
|
|
Why would shadow DOM could improve style performance? Is the speed gain worth using shadow DOM in your daily work?
|
|
|
| |
|
|
### [Building a resilient frontend using progressive enhancement ](https://www.gov.uk/service-manual/technology/using-progressive-enhancement)
|
| |
|
[GOV.UK](https://twitter.com/govuk)
|
|
While it’s not a performance-oriented resource, building front-ends with resilience in mind improves user experience, accessibility and speed—a great list to live by.
|
|
|
| |
|
|
|
|
|
| |
|
# Tools
|
|
|
|
| |
 |
| |
|
### [Vue Lazy Load Image Component](https://github.com/alexjoverm/v-lazy-image)
|
| |
|
[Alex Jover](https://twitter.com/alexjoverm)
|
|
Are you using Vue.js? Use this component to lazy load an image automatically when it enters the viewport using the [Intersection Observer API](https://developer.mozilla.org/docs/Web/API/Intersection_Observer_API).
|
|
|
| |
|
|
|