͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏
͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏
|
#### Editor’s note
|
|
|
It’s hard to shake the feeling that new metrics, APIs and tooling surrounding web performance prove how critical testing is. While exploring new capabilities, the community discovers side effects (such as portrayed by Eric Portis in this issue). What’s new gets carefully tested and evolves to better suit our needs.
For web performance (and the evolution of the web), we absolutely need to design for resilience. To ensure resilience, we must test, test, test and loudly advocate for those whose needs are often not taken into the account under the umbrella of an “edge case”. Nobody is an edge case.
|
|
|
|
|
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
|
|
|
|
|
|
 |
|
|
|
### [How layout position impacts three big web performance levers](https://performance.shopify.com/blogs/blog/how-layout-position-impacts-three-big-web-performance-levers)
|
|
|
|
[Sia Karamalegos](https://sia.codes/)
|
|
Explore the most common performance issues connected to layout positioning and how to prevent them from happening if you’re using Shopify.
|
|
|
|
|
|
 |
|
|
|
### [Long Animation Frames API](https://developer.chrome.com/articles/long-animation-frames/)
|
|
|
|
[Barry Pollard](https://www.tunetheweb.com/) & [Noam Rosenthal](https://indieweb.social/@nomster)
|
|
There’s a new proposal from the Chrome team to update the Long Tasks API to provide a better understanding of slow interface updates. Find out what issues it addresses and how you can experiment with it.
|
|
|
|
|
|
 |
|
|
|
### [View Transitions break incremental rendering](https://ericportis.com/posts/2023/view-transitions-break-incremental-rendering/)
|
|
|
|
[Eric Portis](https://ericportis.com/)
|
|
The View Transitions specification brings exciting possibilities to the web, such as removing abrupt navigation, maintaining hierarchy and smoothing transitions between pages. However, it comes with drawbacks, too.
|
|
|
|
|
|
|
|
|
|
|
|
|
# Case Studies
|
|
|
|
|
|
 |
|
|
|
### [How we reduced the size of our JavaScript bundles by 33%](https://dropbox.tech/frontend/how-we-reduced-the-size-of-our-javascript-bundles-by-33-percent)
|
|
|
|
[Umair Nadeem](https://github.com/umairnadeem/) & [Rich Hong](https://www.linkedin.com/in/hongrich/)
|
|
Dropbox replaced their bundler with a more modern solution supporting tree shaking and code splitting. Learn how this process yielded a 33% decrease in bundle size.
|
|
|
|
|
|
 |
|
|
|
### [Driving Performance at Microsoft Bing](https://blogs.bing.com/Engineering-Blog/august-2023/Driving-Performance-at-Microsoft-Bing)
|
|
|
|
[Paul Roy](https://www.linkedin.com/in/pauljroy/), [Jason Yu](https://www.linkedin.com/in/jasonyu07msft/) & the Bing Performance Team
|
|
Learn how Microsoft Bing implements organisational performance: from principles down to synthetic and real user monitoring tooling.
|
|
|
|
|
|
 |
|
|
|
### [Modern methods for improving Drupal’s Largest Contentful Paint Core Web Vital](https://www.smashingmagazine.com/2023/08/methods-improving-drupal-largest-contentful-paint-core-web-vital/)
|
|
|
|
[Mike Herchel](https://herchel.com/)
|
|
Step through Drupal’s Umami theme performance improvements that result in significantly faster Largest Contentful Paint.
|
|
|
|
|
|
|
|