Long Animation Frames API

[ErwinHofmanRV]

Description

The Long Animation Frames API (aka LoAF) defines a mechanism for pages to observe “long animation frames” (animation or rendering updates delayed beyond ~50 ms) that block rendering or user input.

It offers more granular insights than the Long Tasks API by including render timing, attribution of scripts, and breakdowns of style/layout/rendering phases.

The proposal covers the API surface (PerformanceLongAnimationFrameTiming etc.), buffer and observer semantics, script attribution, thresholds, visibility considerations, and interactions with the INP (Interaction to Next Paint) metric.

Out of scope are non-frame-based metrics (e.g. purely non-visual JS long tasks), or vendor-specific profiling beyond what the spec defines.

Specification

https://w3c.github.io/long-animation-frames/

web-feature

https://web-platform-dx.github.io/web-features-explorer/features/long-animation-frames/

Test Links

https://wpt.fyi/results/long-animation-frame

Additional Signals

• Standards Positions: The spec is in W3C editor’s draft. w3c.github.io

• Browser Support / Current State:
  • Chrome / Chromium shipped support starting in version 123. Chrome for Developers
  • Other major browsers (Firefox but positive, Safari) currently lack support

• Developer Adoption / Ecosystem Usage:
  • Tools / SDKs like Sentry have added support for this API.
  • DebugBear, SpeedCurve, RUMvision and other performance monitoring services write about using LoAF to identify blocking scripts, layout/style costs etc.

• Workaround / Site Breakage Risk:
  • Sites relying on Long Tasks for diagnosis may need to migrate or integrate LoAF as well to obtain rendering-phase visibility.
  • There may be missing visibility / attribution in certain cross-origin / worker / extension contexts. Chrome for Developers

• Likely Compatibility Impact:
  • The API is additive, you can feature-detect (PerformanceObserver.supportedEntryTypes.includes('long-animation-frame')) so sites only use it in capable browsers. Chrome for Developers
  • Some behavior around attribution, buffer sizes, thresholds, cross-origin scripts, visibility etc. may differ or need convergence.

• Platform / Developer Impact:
  • Helps developers better diagnose responsiveness and smoothness issues, particularly for interactions (including INP)
  • Enables performance tools like RUM providers to give more actionable data.
  • Helps alert site owners as well as third-party providers to emerging performance problems, making it easier to detect and improve issues (for example with CMPs, session replay tools)
  • Potential to reduce site-level latency and improve user experience by guiding optimizations (script splitting, deferring non-critical work, reducing layout/style cost, etc.)

[github-actions]

This comment was automatically generated based on the information you provided. Please don't edit it.

Below is additional information about the web feature (from the web-features project) which is referenced in your proposal.
If this doesn't accurately correspond to your proposal, please update your initial comment to include web-features: <feature-id>.
To find feature IDs, use the web-features explorer.

Feature Long animation frames

• ID: long-animation-frames
• Name: Long animation frames
• Description: The long-animation-frame performance event type and the PerformanceLongAnimationFrameTiming API provide information about rendering updates that take longer than 50 milliseconds. Also known as LoAFs.
• Baseline status: Limited Availability
• Docs: PerformanceLongAnimationFrameTiming
• Standard positions: Mozilla, WebKit
• Chrome use counter: chromestatus.com
• WPT tests: wpt.fyi/results/?q=feature:long-animation-frames
• More information: See the web-features explorer

[yoavweiss]

Shopify supports the inclusion of this API in Interop.

Shopify storefronts have code running by multiple stakeholders. Shopify, the merchant's developers, theme developers and App Blocks all contribute code that finds itself in the storefront's top-level frame.
We are actively using LoAF to detect responsiveness issues and attribute them.

[wpt-interop]

Thank you for proposing Long Animation Frames API for Interop 2026.

We want to let you know it was not selected to be part of Interop this year.

On behalf of the entire Interop team, thank you for submitting it for consideration. We got many more proposals than we could include in this year's project, necessitating some difficult choices. Please note this should not be taken as a comment on the technology as a whole, or our willingness to consider it for Interop in the future. We appreciate the work you put into your proposal, and would welcome your participation in future rounds of Interop.

Posted on behalf of the Interop team.