w3c / w3c/resource-timing

consider adding attributes to track Cache API performance in a service worker FetchEvent handler

Open
#162 6 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

enhancement
Dominant language
Bikeshed
Stars
135
Forks
40
PR merge metrics
No merged PRs in 30d

Description

It would be nice to give sites some more insight into the time spent in a service worker FetchEvent handler. Currently browser mostly (see #119) provide these two PerformanceResourceTiming markers:

  • requestStart marks when the FetchEvent is dispatched
  • responseStart marks when the evt.respondWith() promise resolves

For sites using a service worker to offline their resources the fetch handler will often be a mix of various javascript and cache API operations like:

evt.respondWith(async function() {
  let c = await caches.open("foo");
  return c.match(evt.request);
});

Its not easy to associate the cache.open() time with the FetchEvent, but we could add PerformanceResourceTiming attributes like:

  • cacheMatchStart marks the beginning of the cache.match() or cache.matchAll() that produced the Response passed to evt.respondWith()
  • cacheMatchEnd marks when the cache.match() promise resolved the Response passed to evt.respondWith()

This would require setting some internal timing information on the Response. This information would be copied automatically across a Response.clone(). Any other consumption and re-packing of the Response would lose the information, though.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Review the related discussion in #119 and the PerformanceResourceTiming and FetchEvent concepts described here. Determine how cache.match() and cache.matchAll() timing would be represented and propagated through Response.clone(), then identify the specification changes and tests needed to define completion.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
performance, web-dev
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.