Issue 16—Building performance culture, revenue impact calculator, lazy loading images and video, automating performance systems and more!
In February, [Allison McKnight](https://twitter.com/aemcknig), a Data Analytics engineer at Etsy, presented on building a performance culture at SmashingConf London. In her talk, Allison explains how to get business buy-in, prioritise, understand & scale performance-oriented approaches as a team.
If you prefer videos over slides, [head over to Vimeo](https://vimeo.com/254947097). 📺
| [Building performance for the long-term](https://speakerdeck.com/aemcknig/building-performance-for-the-long-term) |
[Eric Bidelman](https://twitter.com/ebidel), an engineer at Google, working on Lighthouse and headless Chrome, has been preparing amazing demos of [Puppeteer](https://github.com/GoogleChrome/puppeteer)[s'](https://github.com/GoogleChrome/puppeteer) (headless Chrome Node API) capabilities. Check out his example of analysing the percentage of CSS and JavaSCript resources used during the lifetime of a page load, split by URLs. Handy!
Did you know you can also [verify Service Workers are caching your content correctly](https://twitter.com/ebidel/status/969619593978245120) and much more? 👏🏻
| [Puppeteer examples](https://github.com/GoogleChromeLabs/puppeteer-examples) |
Google has been spearheading building performance awareness with a lot of their latest projects. With [Speed Scorecard](https://www.thinkwithgoogle.com/feature/mobile/), it's possible to access Chrome User Experience Report data and compare it to your timings.
What's even more interesting is [Impact Calculator](https://www.thinkwithgoogle.com/feature/mobile/)—a tool allowing to estimate revenue loss based on performance pitfalls; something that can be used to convince businesses to commit more to building a fast Web.
| [The Speed Scorecard and Impact Calculator](https://adwords.googleblog.com/2018/02/speed-scorecard-impact-calculator.html) |
Webpack has become an essential part of a developer toolchain for many. Unfortunately, in many cases, it’s possible to not leverage its powerful, performance-oriented features.
But worry not, [Addy Osmani](https://twitter.com/addyosmani) and [Ivan Akulov](https://twitter.com/iamakulov) come in to explain the fundamentals of performance optimisation in Webpack, from reducing bundle sizes, long-term caching to monitoring and a wide range of tooling. ✨
| [Web performance optimization with webpack](https://developers.google.com/web/fundamentals/performance/webpack/) |
In his presentation, [Ilya Grigorik](https://twitter.com/igrigorik), a web performance engineer at Google, analyses the state of the Web based on the Chrome User Experience Report and vast amounts of performance data found in BigQuery. How can we leverage these tools to improve performance? Are we measuring the right metrics?
[Video available here.](https://vimeo.com/254834890) ✌🏻
| [How’s the UX on the Web, really?](https://docs.google.com/presentation/d/1xhFyYiaPaRD81cw83i88XnbTwvOC7_MllxkzGDd6Ed4/present?slide=id.g18d4e05999_0_16) |
Imagery and media are still a big part of the experience of the Web but can introduce significant downsides to user experience and performance.
Fortunately, [Jeremy Wagner](https://twitter.com/malchata) wrote an extensive guide to bulletproof lazy loading practices that can help avoid common pitfalls. ⚡️
| [Lazy loading images and video](https://developers.google.com/web/fundamentals/performance/lazy-loading-guidance/images-and-video/) |
Here’s a sneak peek of a major feature coming very soon—**a command-line interface allowing the running of one-off tests. Perfect for integrating into your CI/CD pipeline!** It’s never been easier to automate your performance systems and focus on what’s most important—delivering stellar experiences.
Additionally, [we’ve revamped Calibre’s ](https://calibreapp.com/pricing)[plans](https://calibreapp.com/pricing) so that you’re not limited by the number of pages or sites monitored. Give it a go now to avoid missing out on CLI launch!
| [Try monitoring performance with Calibre for free](https://calibreapp.com/) |
BROUGHT TO YOU BY
** ♠︎ Calibre** — Let’s make the web fast for everyone.