web.dev

AutoWebPerf (AWP) is a modular tool designed to automate the gathering of performance data from multiple sources (like CrUX, PageSpeed Insights, or WebPageTest) to monitor Core Web Vitals over time.

The architecture consists of three module types:

• Engine: Orchestrates the process by taking tests from a connector, running them through gatherers, and writing results to an output connector.
• Connector modules: Define where the list of tests is loaded from (e.g., CSV, JSON, Google Sheets) and where results are written (e.g., CSV, JSON, Google Sheets).
• Gatherer modules: Perform the actual performance audits (e.g., PageSpeed Insights, CrUX API, WebPageTest API).

Trust tokens allow an origin to issue cryptographic tokens to a user it trusts. These tokens are stored by the browser and can be used in other contexts (even across different sites) to evaluate a user's authenticity without identifying the user or linking identities.

Key Characteristics

• Non-personalized: Tokens cannot be used to track individual users.
• Indistinguishable: Tokens are indistinguishable from one another to prevent tracking.
• Cryptographically signed: Tokens cannot be forged.
• Per-origin storage: Tokens are stored in a new per-origin storage area accessible in third-party contexts.

Inspection and Testing

• Demo: You can test the API using the Trust Token Demo.
• DevTools: You can inspect tokens using the Chrome DevTools in the Network and Application tabs.

The Lighthouse CI Server provides a dashboard for exploring historical Lighthouse reporting and acts as a private, long-term datastore for reports. It allows users to compare commits and visualize regressions (highlighted in pink) or improvements (highlighted in blue).

Deployment recipes for Heroku and Docker are available in the official Lighthouse CI documentation.

Media frameworks (or libraries) provide APIs to support audio and video playback for various container formats and transmission protocols. They are used to extend or replace the default HTML5 <video> tag by offloading complex features such as:

• Offline playback
• Streaming (DASH, HLS)
• Analytics
• Picture-in-picture
• Preview thumbnails
• Embedding
• Monetization (Ad scheduling, header bidding, etc.)

WebRTC (Real-Time Communication) enables peer-to-peer audio, video, and data communication in web browsers without plugins. It is built upon three core APIs:

• MediaStream (also known as getUserMedia): Used to access data streams from hardware like cameras and microphones.
• RTCPeerConnection: Facilitates audio and video calling, providing features for encryption and bandwidth management.
• RTCDataChannel: Enables the peer-to-peer communication of generic data.

These APIs are supported on mobile and desktop by Chrome, Safari, Firefox, Edge, and Opera.

Signed Exchanges (SXG) is a delivery mechanism that allows a resource's origin to be authenticated independently of how it was delivered. This enables privacy-preserving cross-origin prefetching, which can significantly improve Largest Contentful Paint (LCP) by allowing caches (like Google Search) to prefetch content without revealing user identity to the origin server until navigation occurs.

Key Benefits:

• Improved Performance: Can reduce LCP by 300ms to 400ms via prefetching.
• Attribution: The browser displays the origin site's URL in the address bar even when content is served from a third-party cache.
• Privacy: Protects user privacy during the prefetch stage.
• Use Cases: Offline internet experiences, third-party caching, and faster cross-origin navigations.

Beyond the Core Web Vitals, other Web Vitals serve as proxy or supplemental metrics to help diagnose specific performance issues.

Loading Experience

• Time to First Byte (TTFB): Useful for diagnosing issues with slow server response times.
• First Contentful Paint (FCP): Useful for diagnosing issues with render-blocking resources, which impacts Largest Contentful Paint (LCP).

Interactivity

• Total Blocking Time (TBT) and Time to Interactive (TTI): These are lab metrics used to catch and diagnose interactivity issues that impact First Input Delay (FID). Note that these are not part of the Core Web Vitals because they are not field-measurable and do not reflect a user-centric outcome.

A CDN improves site performance by using a distributed network of servers to deliver resources. Key benefits include:

• Reduced Latency: CDN servers are located closer to users than the origin server, reducing Round-Trip Time (RTT).
• Connection Optimization: CDNs terminate new connections close to the user and use pre-warmed, persistent connections to the origin, reducing connection setup costs.
• Reduced Origin Load: Caching resources on CDN servers eliminates the need for every request to travel to the origin server.
• Optimized Routing: Some CDNs use highly optimized routes between CDN servers that outperform standard BGP-determined internet routing.

WebRTC enables peer-to-peer communication, but it does not implement a signaling mechanism. You must build a custom signaling service to allow clients to exchange the metadata required to coordinate communication.

Required signaling data includes:

• Session-control messages: Used to open or close communication.
• Error messages.
• Media metadata: Codecs, codec settings, bandwidth, and media types.
• Security data: Key data used to establish secure connections.
• Network data: Host IP addresses and ports (as seen by the outside world).

Because signaling is not defined by the WebRTC standard, you can use existing protocols like SIP or Jingle, or implement a custom solution.