Automatically capture asset timing measurements

Problem Statement

We already take advantage of the https://developer.mozilla.org/en-US/docs/Web/API/Resource_Timing_API/Using_the_Resource_Timing_API to capture network timing about resources getting loaded in.

We grab info about transfer size here:

sentry-javascript/packages/tracing/src/browser/metrics/index.ts

Lines 330 to 338 in cba9861

    
           if ('transferSize' in entry) { 
        
             data['Transfer Size'] = entry.transferSize; 
        
           } 
        
           if ('encodedBodySize' in entry) { 
        
             data['Encoded Body Size'] = entry.encodedBodySize; 
        
           } 
        
           if ('decodedBodySize' in entry) { 
        
             data['Decoded Body Size'] = entry.decodedBodySize; 
        
           }

Solution Brainstorm

Like getsentry/sentry#36012, let's comb through all the resource spans and aggregate their timing data into measurements.

This will allow us to draw insights about total assets loaded and how many resource bytes we are loading on a page.

There is an argument here that we can do this automatically in Relay to save bundle size, as we are just looking at the resource.X spans anyway.

Couple notes:

If all the fields are 0 you can roughly determine that there is an issue with the timing header, since this information is only provided if the header set. Calculating total transfer would be misleading without including information about the potentially 'missing' asset sizes.
Relay probably makes more sense since it's just some arithmetic, there shouldn't be additional data to collect.

Navigation Menu

Repository navigation

Automatically capture asset timing measurements #5317

Problem Statement

Solution Brainstorm

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

	if ('transferSize' in entry) {
	data['Transfer Size'] = entry.transferSize;
	}
	if ('encodedBodySize' in entry) {
	data['Encoded Body Size'] = entry.encodedBodySize;
	}
	if ('decodedBodySize' in entry) {
	data['Decoded Body Size'] = entry.decodedBodySize;
	}

Automatically capture asset timing measurements #5317

Description

Problem Statement

Solution Brainstorm

Activity

k-fish commented on Jun 24, 2022

Metadata

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Issue actions