Dedupe calls to performance.measure

src/source/geojson_worker_source.js

@@ -2,7 +2,7 @@
 
 import {getJSON} from '../util/ajax.js';
 
-import {RequestPerformance} from '../util/performance.js';
+import {getPerformanceMeasurement} from '../util/performance.js';
 import rewind from '@mapbox/geojson-rewind';
 import GeoJSONWrapper from './geojson_wrapper.js';
 import vtpbf from 'vt-pbf';
@@ -164,8 +164,8 @@ class GeoJSONWorkerSource extends VectorTileWorkerSource {
         delete this._pendingCallback;
         delete this._pendingLoadDataParams;
 
-        const perf = (params && params.request && params.request.collectResourceTiming) ?
-            new RequestPerformance(params.request) : false;
+        const requestParam = params && params.request;
+        const perf = requestParam && requestParam.collectResourceTiming;
 
         this.loadGeoJSON(params, (err: ?Error, data: ?Object) => {
             if (err || !data) {
@@ -196,7 +196,7 @@ class GeoJSONWorkerSource extends VectorTileWorkerSource {
 
                 const result = {};
                 if (perf) {
-                    const resourceTimingData = perf.finish();
+                    const resourceTimingData = getPerformanceMeasurement(requestParam);
                     // it's necessary to eval the result of getEntriesByName() here via parse/stringify
                     // late evaluation in the main thread causes TypeError: illegal invocation
                     if (resourceTimingData) {

src/source/vector_tile_worker_source.js

@@ -6,7 +6,7 @@ import vt from '@mapbox/vector-tile';
 import Protobuf from 'pbf';
 import WorkerTile from './worker_tile.js';
 import {extend} from '../util/util.js';
-import {RequestPerformance} from '../util/performance.js';
+import {getPerformanceMeasurement} from '../util/performance.js';
 import {Evented} from '../util/evented.js';
 
 import type {
@@ -40,10 +40,10 @@ export type LoadVectorDataCallback = Callback<?LoadVectorTileResult>;
 
 export type AbortVectorData = () => void;
 export type LoadVectorData = (params: RequestedTileParameters, callback: LoadVectorDataCallback) => ?AbortVectorData;
-
 export class DedupedRequest {
     entries: { [string]: Object };
     scheduler: ?Scheduler;
+
     constructor(scheduler?: Scheduler) {
         this.entries = {};
         this.scheduler = scheduler;
@@ -176,8 +176,8 @@ class VectorTileWorkerSource extends Evented implements WorkerSource {
     loadTile(params: WorkerTileParameters, callback: WorkerTileCallback) {
         const uid = params.uid;
 
-        const perf = (params && params.request && params.request.collectResourceTiming) ?
-            new RequestPerformance(params.request) : false;
+        const requestParam = params && params.request;
+        const perf = requestParam && requestParam.collectResourceTiming;
 
         const workerTile = this.loading[uid] = new WorkerTile(params);
         workerTile.abort = this.loadVectorData(params, (err, response) => {
@@ -197,23 +197,23 @@ class VectorTileWorkerSource extends Evented implements WorkerSource {
             if (response.expires) cacheControl.expires = response.expires;
             if (response.cacheControl) cacheControl.cacheControl = response.cacheControl;
 
-            const resourceTiming = {};
-            if (perf) {
-                const resourceTimingData = perf.finish();
-                // it's necessary to eval the result of getEntriesByName() here via parse/stringify
-                // late evaluation in the main thread causes TypeError: illegal invocation
-                if (resourceTimingData)
-                    resourceTiming.resourceTiming = JSON.parse(JSON.stringify(resourceTimingData));
-            }
-
             // response.vectorTile will be present in the GeoJSON worker case (which inherits from this class)
             // because we stub the vector tile interface around JSON data instead of parsing it directly
             workerTile.vectorTile = response.vectorTile || new vt.VectorTile(new Protobuf(rawTileData));
             const parseTile = () => {
                 workerTile.parse(workerTile.vectorTile, this.layerIndex, this.availableImages, this.actor, (err, result) => {
                     if (err || !result) return callback(err);
 
-                    // Transferring a copy of rawTileData because the worker needs to retain its copy.
+                    const resourceTiming = {};
+                    if (perf) {
+                        // Transferring a copy of rawTileData because the worker needs to retain its copy.
+                        const resourceTimingData = getPerformanceMeasurement(requestParam);
+                        // it's necessary to eval the result of getEntriesByName() here via parse/stringify
+                        // late evaluation in the main thread causes TypeError: illegal invocation
+                        if (resourceTimingData.length > 0) {
+                            resourceTiming.resourceTiming = JSON.parse(JSON.stringify(resourceTimingData));
+                        }
+                    }
                     callback(null, extend({rawTileData: rawTileData.slice(0)}, result, cacheControl, resourceTiming));
                 });
             };

src/util/performance.js

@@ -160,42 +160,9 @@ export const PerformanceUtils = {
     }
 };
 
-/**
- * Safe wrapper for the performance resource timing API in web workers with graceful degradation
- *
- * @param {RequestParameters} request
- * @private
- */
-export class RequestPerformance {
-    _marks: {start: string, end: string, measure: string};
-
-    constructor (request: RequestParameters) {
-        this._marks = {
-            start: [request.url, 'start'].join('#'),
-            end: [request.url, 'end'].join('#'),
-            measure: request.url.toString()
-        };
-
-        performance.mark(this._marks.start);
-    }
-
-    finish() {
-        performance.mark(this._marks.end);
-        let resourceTimingData = performance.getEntriesByName(this._marks.measure);
-
-        // fallback if web worker implementation of perf.getEntriesByName returns empty
-        if (resourceTimingData.length === 0) {
-            performance.measure(this._marks.measure, this._marks.start, this._marks.end);
-            resourceTimingData = performance.getEntriesByName(this._marks.measure);
-
-            // cleanup
-            performance.clearMarks(this._marks.start);
-            performance.clearMarks(this._marks.end);
-            performance.clearMeasures(this._marks.measure);
-        }
-
-        return resourceTimingData;
-    }
+export function getPerformanceMeasurement(request: ?RequestParameters) {
+    const url = request ? request.url.toString() : undefined;
+    return performance.getEntriesByName(url);
 }
 
 export default performance;

test/unit/source/geojson_worker_source.test.js

@@ -137,38 +137,6 @@ test('resourceTiming', (t) => {
         });
     });
 
-    t.test('loadData - url (resourceTiming fallback method)', (t) => {
-        const sampleMarks = [100, 350];
-        const marks = {};
-        const measures = {};
-        t.stub(perf, 'getEntriesByName').callsFake((name) => { return measures[name] || []; });
-        t.stub(perf, 'mark').callsFake((name) => {
-            marks[name] = sampleMarks.shift();
-            return null;
-        });
-        t.stub(perf, 'measure').callsFake((name, start, end) => {
-            measures[name] = measures[name] || [];
-            measures[name].push({
-                duration: marks[end] - marks[start],
-                entryType: 'measure',
-                name,
-                startTime: marks[start]
-            });
-            return null;
-        });
-        t.stub(perf, 'clearMarks').callsFake(() => { return null; });
-        t.stub(perf, 'clearMeasures').callsFake(() => { return null; });
-
-        const layerIndex = new StyleLayerIndex(layers);
-        const source = new GeoJSONWorkerSource(actor, layerIndex, [], true, (params, callback) => { return callback(null, geoJson); });
-
-        source.loadData({source: 'testSource', request: {url: 'http://localhost/nonexistent', collectResourceTiming: true}}, (err, result) => {
-            t.equal(err, null);
-            t.deepEquals(result.resourceTiming.testSource, [{"duration": 250, "entryType": "measure", "name": "http://localhost/nonexistent", "startTime": 100}], 'got expected resource timing');
-            t.end();
-        });
-    });
-
     t.test('loadData - data', (t) => {
         const layerIndex = new StyleLayerIndex(layers);
         const source = new GeoJSONWorkerSource(actor, layerIndex, [], true);

test/unit/source/vector_tile_worker_source.test.js

@@ -250,62 +250,3 @@ test('VectorTileWorkerSource provides resource timing information', (t) => {
         t.end();
     });
 });
-
-test('VectorTileWorkerSource provides resource timing information (fallback method)', (t) => {
-    const rawTileData = fs.readFileSync(path.join(__dirname, '/../../fixtures/mbsv5-6-18-23.vector.pbf'));
-
-    function loadVectorData(params, callback) {
-        return callback(null, {
-            vectorTile: new vt.VectorTile(new Protobuf(rawTileData)),
-            rawData: rawTileData,
-            cacheControl: null,
-            expires: null
-        });
-    }
-
-    const layerIndex = new StyleLayerIndex([{
-        id: 'test',
-        source: 'source',
-        'source-layer': 'test',
-        type: 'fill'
-    }]);
-
-    const source = new VectorTileWorkerSource(actor, layerIndex, [], true, loadVectorData);
-    const url = 'http://localhost:2900/faketile.pbf';
-
-    const sampleMarks = {};
-    sampleMarks[`${url}#start`] = 100;
-    sampleMarks[`${url}#end`] = 350;
-    const marks = {};
-    const measures = {};
-    t.stub(perf, 'getEntriesByName').callsFake((name) => { return measures[name] || []; });
-    t.stub(perf, 'mark').callsFake((name) => {
-        if (sampleMarks[name]) {
-            marks[name] = sampleMarks[name];
-        }
-        return null;
-    });
-    t.stub(perf, 'measure').callsFake((name, start, end) => {
-        measures[name] = measures[name] || [];
-        measures[name].push({
-            duration: marks[end] - marks[start],
-            entryType: 'measure',
-            name,
-            startTime: marks[start]
-        });
-        return null;
-    });
-    t.stub(perf, 'clearMarks').callsFake(() => { return null; });
-    t.stub(perf, 'clearMeasures').callsFake(() => { return null; });
-
-    source.loadTile({
-        source: 'source',
-        uid: 0,
-        tileID: {overscaledZ: 0, wrap: 0, canonical: {x: 0, y: 0, z: 0, w: 0}},
-        request: {url, collectResourceTiming: true}
-    }, (err, res) => {
-        t.false(err);
-        t.deepEquals(res.resourceTiming[0], {"duration": 250, "entryType": "measure", "name": "http://localhost:2900/faketile.pbf", "startTime": 100}, 'resourceTiming resp is expected');
-        t.end();
-    });
-});