Ramona Schwering

Measure and improve frontend performance by using test automation

What if your existing test suite could automatically prevent performance regressions? Learn how to integrate Lighthouse audits directly into your CI/CD pipeline.

Measure and improve frontend performance by using test automation
#1about 3 minutes

The challenge of making applications fast and performant

The principle "make it work, make it right, make it fast" highlights that while functionality and maintainability have tool support, performance optimization remains a daunting manual task.

#2about 4 minutes

Using end-to-end tests for performance monitoring

Existing end-to-end test automation can be repurposed to gather performance metrics, providing accurate results by testing the complete application stack.

#3about 3 minutes

Why frontend performance is critical for users

Web performance is defined by speed and efficiency, with frontend issues being the most noticeable to users, impacting user experience and search engine rankings.

#4about 6 minutes

Automating Google Lighthouse audits with Cypress

The cypress-audit plugin allows you to integrate Google Lighthouse performance, accessibility, and SEO checks directly into your Cypress end-to-end tests.

#5about 2 minutes

Understanding the Core Web Vitals user experience metrics

Core Web Vitals are critical user experience metrics focusing on loading (LCP), interactivity (FID), and visual stability (CLS) that directly impact page rank.

#6about 2 minutes

Integrating Core Web Vitals checks into tests

The cypress-web-vitals plugin enables automated measurement of Core Web Vitals within your test suite, failing builds when performance thresholds are not met.

#7about 3 minutes

Key takeaways for automated performance testing

To improve performance you must measure it, focus on the frontend where issues are most visible, and utilize existing test automation with tools like Lighthouse and Core Web Vitals.

Related jobs
Jobs that call for the skills explored in this talk.

Matching moments

How to measure web performance with browser tools
06:20 MIN

How to measure web performance with browser tools

The Illusion of a Performant Web Application

Automating reactive performance testing in your CI/CD pipeline
19:42 MIN

Automating reactive performance testing in your CI/CD pipeline

Frontend Performance Testing in practice

Integrating performance, accessibility, and security tests
19:03 MIN

Integrating performance, accessibility, and security tests

Trunk-Based Development at Scale: Real-World Insights from a High-Traffic Luxury E-Commerce Platform

How to measure PWA performance with key tools
04:15 MIN

How to measure PWA performance with key tools

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

Using Lighthouse to audit your site's performance
28:14 MIN

Using Lighthouse to audit your site's performance

Jamstack and Web Performance, a match made in heaven

Focusing on the right metrics for SPA performance
23:40 MIN

Focusing on the right metrics for SPA performance

Lessons learned from building a thriving Vue.js SaaS application

Understanding key frontend performance metrics and KPIs
06:47 MIN

Understanding key frontend performance metrics and KPIs

Frontend Performance Testing in practice

Automating accessibility checks in the CI/CD pipeline
07:33 MIN

Automating accessibility checks in the CI/CD pipeline

Accessibility Test Driven Development

Featured Partners

Related Videos

See all videos
Frontend Performance Testing in practice36:50

Frontend Performance Testing in practice

Jonas Kröger

Let's get visual - Visual testing in your project54:23

Let's get visual - Visual testing in your project

Ramona Schwering

Let's get visual - Visual testing in your project44:59

Let's get visual - Visual testing in your project

Ramona Schwering

Next.js Unleashed: Optimizing Web Vitals for superior User Experience26:44

Next.js Unleashed: Optimizing Web Vitals for superior User Experience

Eileen Fürstenau

Core Web Vitals: Put your application into orbit with best practices19:52

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

Nicolas Frizzarin

How to add test automation to your project: The good, the bad, and the ugly26:20

How to add test automation to your project: The good, the bad, and the ugly

Augustin Gottlieb

It's a (testing) trap! - Common testing pitfalls and how to solve them24:19

It's a (testing) trap! - Common testing pitfalls and how to solve them

Ramona Schwering

Catching up on the basics you don't really need that much code14:44

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

Chris Heilmann

Related Articles

View all articles
DC
Daniel Cranney
Dev Digest 190: GitHub A11Y action, >12s Sora 2 videos and 42 CSS units!
Inside last week’s Dev Digest 190 . 🙅 Developers don’t trust AI, and that’s a good thing 🤖 Why everyone is talking about AI agents 🔓 Autonomous AI hacking and the future of cyber security 😨 Windows 10 support ends, millions of PC’s fall off a securi...
Dev Digest 190: GitHub A11Y action, >12s Sora 2 videos and 42 CSS units!
DC
Daniel Cranney
Dev Digest 196: AI Killed DevOps, LLM Political Bias & AI Security
Inside last week’s Dev Digest 196 . ⚖️ Political bias in LLMs 🫣 AI written code causes 1 in 5 security breaches 🖼️ Is there a limit to alternative text on images? 📝 CodeWiki - understand code better 🟨 Long tasks in JavaScript 👻 Scare yourself into n...
Dev Digest 196: AI Killed DevOps, LLM Political Bias & AI Security
BR
Benjamin Ruschin
What Developers Really Need to Create Great Code Demos
Every developer on earth has, at some point, had another developer to thank for a breakthrough, a success, an aha moment they wouldn’t have had without coming across that blog post, that open-source contribution, that reply on socials or that humble ...
What Developers Really Need to Create Great Code Demos

From learning to earning

Jobs that call for the skills explored in this talk.