Skip to content

Instantly share code, notes, and snippets.

@yoavweiss
yoavweiss / moderate_viewport_heuristic_control.md
Created July 2, 2026 11:15
Moderate Viewport Heuristics Control - Security & Privacy questionnaire

Security & Privacy Self-Review: moderate_viewport_heuristics

This document answers the questions from the W3C TAG Self-Review Questionnaire: Security and Privacy for the proposed moderate_viewport_heuristics extension to Speculation Rules.

Feature summary

Chromium's "moderate" eagerness speculation rules on mobile use a viewport-based heuristic to pick at most one on-screen link to prefetch/prerender each time the user stops scrolling. The heuristic has three tunable parameters:

  • distance_from_pointer_down — a [low, high] band, as a fraction of screen height, gating how far a candidate link may be from the user's last pointerdown.
  • largest_anchor_threshold — how much larger (by visible area) the largest candidate must be than the runner-up before it is chosen.
@yoavweiss
yoavweiss / moderate_heuristics.md
Last active June 22, 2026 15:48
Mobile "moderate" speculation-rules viewport heuristic controls

"moderate" speculation rules eagerness proves very useful on desktop, but less so on mobile.

Chromium's current mobile heuristics are based on watching the viewport: when a link scrolls into view and looks like a plausible next click, the browser prefetches or prerenders it. This shipped in Chrome 138; there's more background in the blink-dev PSA.

"Looks like a plausible next click" comes down to three checks the browser runs

Self-Review Questionnaire: Security and Privacy

styleDuration, layoutDuration, forcedStyleDuration, and forcedLayoutDuration attributes

Answers to the W3C Security and Privacy Self-Review Questionnaire for the newly added timing duration attributes in the Long Animation Frames API.

These attributes break down existing aggregate timing into finer-grained style and layout components:

  • PerformanceLongAnimationFrameTiming.styleDuration / layoutDuration: Time spent in style recalculation and layout during the rendering phase of a long animation frame.
  • PerformanceScriptTiming.forcedStyleDuration / forcedLayoutDuration: Time spent in synchronous (forced) style recalculation and layout triggered during script execution (e.g., by calling getComputedStyle() or getBoundingClientRect()).
@yoavweiss
yoavweiss / css_cost.js
Created January 15, 2026 17:38
Extracting CSS costs from RUM
const totalStyleCost = async () => {
return new Promise(resolve => {
let total = 0;
const obs = new PerformanceObserver(entryList => {
const entries = entryList.getEntries();
for (const entry of entries) {
if (entry.paintTime) {
total += entry.paintTime - entry.styleAndLayoutStart;
} else {
total += entry.startTime + entry.duration - entry.styleAndLayoutStart;
@yoavweiss
yoavweiss / notes.md
Created October 20, 2024 11:21
Autofill API meeting - October 17th 2024 - notes

Participants

Yoav Weiss

Rouslan Solomakhin (Google)

Darwin Yang (Google)

(Shopify)

WICG: Address Autofill

  • TPAC

Attendees: Westin, Martin Lechner, Yoav Weiss, Anne van Kesteren, Christian Indra, Rick Byers, Adam Rice, Michal Mocny, Dominic Batre

  • Yoav: Discuss Address Autofill
  • autofill is a key feature for login and web forms etc

Joel: Welcome! Gonna show a live use case for FedCM

Demo to bootstrap the conversation

Shop.app is the buyer-facing identity at Shopify

Reaching checkout when you’re not authenticated can be complicated

Buyers that reach checkout authenticated, they’re more likely to successfully complete checkout

@yoavweiss
yoavweiss / es_module_integrity_example.js
Last active August 1, 2024 10:03
ES module intergity example
<script type="importmap">
{
"imports": {
"square": "./module/shapes/square.js"
},
"integrity": {
"./module/shapes/square.js": "sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC"
}
}