⚡️ 47: Pandemic impacts performance, profile React.js speed and more.

        21 April 2020

⚡️ 47: Pandemic impacts performance, profile React.js speed and more.

#### PerformanceNewsletter

#### Issue 47

#### Editor’s Note

JavaScript is everywhere. It allows us to build beautiful, interactive and immersive experiences on the web. Unchecked, it also enables excluding those who don’t use fast connections or state-of-the-art devices and degrading the experience for others.

The majority of the most severe and widespread performance issues tie to the JavaScript runtime. Knowing which metrics to track and how to profile those problems is extremely valuable.

But first, we need to admit the inequalities in experience exist in the first place.

Build the web for everyone.
— Karolina

#### article

## Learn how COVID-19 affects your performance

We all probably have seen enough coverage about the ongoing pandemic. However, it is genuinely changing the availability and speed of the internet worldwide. We wrote about how it might have an **impact on how customers perceive the experience of your sites and apps. **

[]()[Performance During a Pandemic →](https://calibreapp.com/blog/performance-during-pandemic)

#### tools

## Improve performance of Shopify-based stores

E-commerce sites can often be frustrating and slow to use. Shopify has a handy Chrome DevTools plugin that visualises Shopify Liquid render profiling data, so you can spot long-running tasks and reduce server response times. 

[]()[Shopify Theme Inspector →](https://github.com/Shopify/shopify-theme-inspector)

#### article

## Know how to profile React.js performance

In his article, [Addy Osmani](https://twitter.com/addyosmani) explains how to profile React.js performance in a handful of ways. Learn how to measure component render performance, quantify interactions, create custom metrics for your use case and write scripts for Puppeteer.

[]()[Profiling React.js Performance →](https://addyosmani.com/blog/profiling-react-js/)

#### case study

## How Messenger codebase shrunk by 84%

In his case study, [Mohsen Agsen](https://twitter.com/coderhi?lang=en) describes the strategy and technical decisions behind the latest Facebook Messenger release. We rarely see complete rewrites at that scale, especially using a performance-driven approach of setting binary budgets per feature.

[]()[Project LightSpeed: Rewriting the Messenger codebase for a faster, smaller, and simpler messaging app →](https://engineering.fb.com/data-infrastructure/messenger/)

#### video

## Discover performance issues in web applications

NodeSchool San Francisco organised a live talk and Q&A session with [Sam Saccone](https://twitter.com/samccone). In his presentation, Sam walks through several examples of common problems with JavaScript applications and how to discover and address them.

[]()[Focused Session: Performance profiling for Web Applications with Sam Saccone →](https://www.youtube.com/watch?v=j9LW94EN7n4&feature=youtu.be)

#### new in calibre

## What Calibre released last month

📚 **Release Notes: March**

Here’s our monthly roundup of what was released in March: redesigned benchmark email for newly created Sites, Test Pack add-ons, Pull Request Reviews test usage and more.

🔜 **Lighthouse 6: **The new major release of Lighthouse is going to bring [significant changes to your performance scoring](https://calibreapp.com/blog/lighthouse-changes-scoring-algorithm). We are preparing to upgrade Calibre Test Agents to Lighthouse 6 as soon as it becomes available.
[]()

#### 
                                Spread the word about perf.email

                                We’d love to see more people reading
                                [perf.email](https://perf.email/); if you’d
                                  like to help—forward this email to a friend, tweet, or
                                  shout from a rooftop. It goes a long way. ✌🏻

#### Brought to you by

                              ♠ [Calibre](https://calibreapp.com/). Make the
                              web fast for everyone.

[Update your profile]()

[Unsubscribe]()

[View in a browser]()

                                Don't miss what's next. Subscribe to Performance Newsletter:

                        Email
                        *

                    ← Newer

                ⚡️48: Reconsider First Meaningful Paint, learn performance and more.

                    Older →

                ⚡️ 46: Lighthouse changes Performance Score, understand perf metrics and more.