WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
World Congress 2025 • Aug 20, 2025 • Session details

Blazing Fast Page Navigation with Speculation Rules

Medhat Dawoud

Human reaction times are inherently slow. Turn this hidden delay into blazing fast, zero-latency web navigation using the Speculation Rules API to pre-render links mid-click.

Pause
Mute Enter Fullscreen
#1 about 3 min

Understanding web navigation performance on mobile devices

Comparing budget and premium smartphone loading speeds reveals how search engines use speculative caching to bypass hardware limits.

#2 about 2 min

Traditional page loading mechanics and round-trip delays

Breaking down the standard sequential process of requesting, parsing, and rendering assets highlights the inherent latency of web navigation.

#3 about 3 min

Leveraging human reaction delays for performance gains

Recognizing the biological delay between deciding to act and clicking provides a critical window to preemptively fetch data.

#4 about 5 min

Core mechanics of speculative loading and hidden rendering

Replacing traditional sequential navigation with hidden background tabs allows multi-page applications to load instantly like flipping physical book pages.

#5 about 4 min

Configuring speculation rules for prefetching and pre-rendering

Writing JSON-based target configurations with conservative, moderate, or immediate options dictates how aggressively browsers fetch assets in the background.

#6 about 2 min

Balancing prediction accuracy with background loading eagerness

Combining moderate hover-based prefetching with conservative click-based rendering prevents unnecessary resource downloads while maximizing instantaneous navigation.

#7 about 2 min

Measuring speculative rendering impacts with Core Web Vitals

Tracking Largest Contentful Paint metrics during navigations proves whether hidden background rendering successfully eliminates visual loading delays for end users.

#8 about 6 min

Debugging pre-rendered hidden tabs inside Chrome DevTools

Inspecting background services panels allows developers to verify rule executions and compare cached loading times against standard network fetch requests.

#9 about 3 min

Injecting dynamic speculation rules into live production sites

Using the browser console to append speculation scripts instantly boosts navigation speeds on external websites without requiring source code modifications.

#10 about 4 min

Browser support constraints and built-in programmatic limitations

Knowing how Chromium engines block background rendering during constraints like data saving modes prevents unexpected performance regressions across different environments.

#11 about 2 min

Critical URL patterns and interactions to exclude from speculation

Excluding sensitive routes like sign-outs, analytics tracking, and shopping cart additions prevents unintended state mutations during background page fetching.

#12 about 4 min

Mitigating bandwidth consumption waste via dictionary compression

Coupling speculative configurations with cross-version dictionary compression drastically reduces redundant server payloads and CPU overhead originally caused by aggressive backgrounding.

#13 about 2 min

Next steps for implementing fast cross-document page navigations

Combining speculative rendering with view transition APIs ensures smooth visual states across multi-page applications while masking minor loading delays.

Matching moments

30 sec

Navigating browser developer tools for performance analysis

Chris Heilmann Chris Heilmann · LIVE

1:56 min

Challenging the performance limits of browser frameworks

Andrew Burnett-Thompson +1 · Coffee With Developers

4:52 min

Evaluating performance impacts of advanced CSS animations

Aaron T. Grogg · Coffee With Developers

5:31 min

Reading specifications to anticipate distant web capabilities

Nikita Dubko · JS Congress

1:59 min

Measuring initial web application performance using Chrome Lighthouse

Marcus Wojtusik +1 · World Congress 2022

3:19 min

Navigating browser constraints through web animation performance tier lists

Chris Heilmann Chris Heilmann +2 · LIVE

More from World Congress 2025

GenAI Security: Navigating the Unseen Iceberg thumbnail
24:33
12 months ago

GenAI Security: Navigating the Unseen Iceberg

Maish Saidel-Keesing

Behind the Code: How Women Are Powering the Future of AI thumbnail
30:28
about 1 year ago

Behind the Code: How Women Are Powering the Future of AI

Alexandra Wudel, Laura Moritz, Madalina Florean

The AI Hype Filter: What’s Real, What’s Investable, What’s Noise? thumbnail
28:12
about 1 year ago

The AI Hype Filter: What’s Real, What’s Investable, What’s Noise?

Justus Lumpe, Konstantin Vinogradov, Nils Eiteneyer, Stephan Wirris

AI in Leadership: How Technology is Reshaping Executive Roles thumbnail
28:19
about 1 year ago

AI in Leadership: How Technology is Reshaping Executive Roles

Bernd Datler, Jasmin Kaiser, Jeff Hausmann, Sonja Alvarez

The AI-Ready Stack: Rethinking the Engineering Org of the Future thumbnail
28:09
about 1 year ago

The AI-Ready Stack: Rethinking the Engineering Org of the Future

Alex Laubscher, Jan Oberhauser, Keno Dreßel, Mirko Novakovic

AI Sovereignty: What Does It Take? thumbnail
29:13
about 1 year ago

AI Sovereignty: What Does It Take?

Boris Hecker, Clemens Wasner, Robin Hermann, Sonja Alvarez

Upcoming sessions on this topic

Open session

React Under Fire: Rendering Performance for Streaming Agent UIs

  • Abhirupa Mitra

    Slack

    Senior Member of Technical Staff

Open session

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

  • Andrei Tazetdinov

    Dynatrace

    React Native Developer

Open session

Build a Zero-Cost AI Agent in Your Browser

  • Aishwarya Mathuria

    Adobe

    Computer Scientist

  • Nishant Thakur

    Adobe

    Senior Computer Scientist

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

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

  • Deepak Agrawal

    Atlassian

    Principal Software Engineer

Open session

Prompt Debt: Why Your AI System Is Frozen in Time

  • Suriya Prakash B

    Red Hat

    Principal Software Engineer

Related videos

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

The Illusion of a Performant Web Application thumbnail
28:56
World Congress 2023 • almost 3 years ago

The Illusion of a Performant Web Application

Cathrin Möller

WeAreDevelopers LIVE - Web Performance in an AI World thumbnail
1:07:59
LIVE • 3 months ago

WeAreDevelopers LIVE - Web Performance in an AI World

Chris Heilmann, Daniel Cranney

The Journey of a Pixel in a React Application thumbnail
27:01
World Congress 2025 • about 1 year ago

The Journey of a Pixel in a React Application

Shem Magnezi

The Lean Web thumbnail
46:46
JS Congress • almost 5 years ago

The Lean Web

Chris Ferdinandi

Explore new web features before everyone else thumbnail
44:43
JS Congress • almost 5 years ago

Explore new web features before everyone else

Nikita Dubko

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.