WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
World Congress 2022 • Jun 15, 2022

Is your Progressive Web App Lazy? How to read and improve your PWA Performance

Laura Morinigo

Is your PWA secretly lazy? Stop settling for basic responsiveness. Learn to eliminate layout shifts, strip bloated CSS, and master service workers for true offline resilience.

Pause
Mute Enter Fullscreen
#1 about 2 min

Introduction to progressive web apps

An overview of why modern web applications need to be responsive, fast, and capable of working offline.

#2 about 3 min

Mandatory technical requirements for PWAs

The three essential components needed to upgrade a standard site into a progressive web application.

#3 about 3 min

Tools for measuring web app performance

Using standard benchmarking environments to identify performance bottlenecks and evaluate application load speeds.

#4 about 3 min

Understanding core Lighthouse performance metrics

How to interpret modern UI performance indicators to understand the actual user experience during initial loading.

#5 about 4 min

Fixing cumulative layout shift with images

Defining specific dimensions and utilizing placeholders for dynamic images prevents visual instability on slow connections.

#6 about 5 min

Optimizing CSS to improve interactivity times

Techniques for reducing render-blocking styles and hunting down unused CSS rules using browser developer tools.

#7 about 3 min

Enhancing perceived load time with splash screens

Configuring the application manifest file to display a splash screen bridges visual gaps for mobile users before complete interactive load.

#8 about 4 min

Implementing offline capabilities using service workers

Strategies for active asset caching, managing unpredictable endpoint failures, and serving customized offline fallback HTML pages.

#9 about 4 min

Reviewing optimization improvements in Lighthouse

A final demonstration showing how applying technical structural changes dramatically boosts overall application metrics for performance.

#10 about 3 min

Handling third-party variability and caching tools

Managing unpredictable dependencies with fallback content and migrating to standard libraries to streamline the development cycle.

Matching moments

1:20 min

Questions on styling extensions and progressive web app potential

Marius Obert Marius Obert · World Congress 2023

1:15 min

Defining progressive web apps and their core advantages

Nico Martin · LIVE

6:13 min

Core capabilities of progressive web applications

Lucien Immink · LIVE

1:29 min

Evaluating progressive web apps for mobile deployment

Mira Jago · World Congress 2021

3:11 min

PWA adoption models and bridging native capabilities

Maxim Salnikov Maxim Salnikov · JS Congress

6:20 min

Enabling offline capabilities and application installation via service workers

Christian Liebel Christian Liebel · World Congress 2022

More from World Congress 2022

What the heck do "declarative" and "reactive" actually mean? thumbnail
30:40
about 4 years ago

What the heck do "declarative" and "reactive" actually mean?

André Kovac

The Design and Evolution of C++ thumbnail
1:01:15
over 4 years ago

The Design and Evolution of C++

Bjarne Stroustrup

But, you're not Facebook thumbnail
31:12
over 4 years ago

But, you're not Facebook

Kristijan Ristovski

Communicate efficiently with Software Architecture Diagrams thumbnail
28:11
over 4 years ago

Communicate efficiently with Software Architecture Diagrams

Simon Lasselsberger

Get Ready for Jakarta EE 10! thumbnail
42:53
over 4 years ago

Get Ready for Jakarta EE 10!

Ivar Grimstad

Keep your code refactorable thumbnail
26:46
over 4 years ago

Keep your code refactorable

Gerrit Stapper

Upcoming sessions on this topic

Open session

From Profiler to Production: Measuring What Actually Matters in React & React Native

  • Andrei Tazetdinov

    Dynatrace

    React Native Developer

Open session

React Under Fire: Rendering Performance for Streaming Agent UIs

  • Abhirupa Mitra

    Slack

    Senior Member of Technical Staff

Open session

How We Cut Our API's p99 Latency from Minutes to Under a Second

  • Deepak Agrawal

    Atlassian

    Principal Software Engineer

Open session

Designing for Every Direction: Logical CSS for Global, Adaptive, and Effortlessly Reversible UIs

  • Vidhya Krishnamoorthy

    Morgan Stanley

    VP, Software Engineering Manager

Open session

Build a Zero-Cost AI Agent in Your Browser

  • Aishwarya Mathuria

    Adobe

    Computer Scientist

  • Nishant Thakur

    Adobe

    Senior Computer Scientist

Open session

AI Is the Easy Part: Why Faster Engineers Don't Make Faster Businesses

  • Bharat Sharma

    Booking

    Senior Engineering Manager

Related videos

PWA Fundamentals: websites with superpowers thumbnail
43:06
World Congress 2021 • over 5 years ago

PWA Fundamentals: websites with superpowers

Rowdy Rabouw

Progressive Web Apps - The next big thing thumbnail
40:01
LIVE • almost 6 years ago

Progressive Web Apps - The next big thing

Nico Martin

PWAs in 2021 thumbnail
41:49
JS Congress • almost 5 years ago

PWAs in 2021

Ire Aderinokun

Core Web Vitals: Put your application into orbit with best practices thumbnail
19:52
World Congress 2024 • about 2 years ago

Core Web Vitals: Put your application into orbit with best practices

Nicolas Frizzarin

Catching up on the basics you don't really need that much code thumbnail
14:44
LIVE • over 2 years ago

Catching up on the basics you don't really need that much code

Chris Heilmann

Native Web Apps: Are We There Yet? thumbnail
44:40
JS Congress • almost 5 years ago

Native Web Apps: Are We There Yet?

Maxim Salnikov

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.