Cache serialized versions of layers

src/data/feature_index.js

@@ -101,7 +101,7 @@ class FeatureIndex {
     }
 
     // Finds non-symbol features in this tile at a particular position.
-    query(args: QueryParameters, styleLayers: {[string]: StyleLayer}, sourceFeatureState: SourceFeatureState): {[string]: Array<{ featureIndex: number, feature: GeoJSONFeature }>} {
+    query(args: QueryParameters, styleLayers: {[string]: StyleLayer}, serializedLayers: {[string]: Object}, sourceFeatureState: SourceFeatureState): {[string]: Array<{ featureIndex: number, feature: GeoJSONFeature }>} {
         this.loadVTLayers();
 
         const params = args.params || {},
@@ -146,6 +146,7 @@ class FeatureIndex {
                 filter,
                 params.layers,
                 styleLayers,
+                serializedLayers,
                 (feature: VectorTileFeature, styleLayer: StyleLayer, id: string | number | void) => {
                     if (!featureGeometry) {
                         featureGeometry = loadGeometry(feature);
@@ -171,6 +172,7 @@ class FeatureIndex {
         filter: FeatureFilter,
         filterLayerIDs: Array<string>,
         styleLayers: {[string]: StyleLayer},
+        serializedLayers: {[string]: Object},
         intersectionTest?: (feature: VectorTileFeature, styleLayer: StyleLayer, id: string | number | void) => boolean | number) {
 
         const layerIDs = this.bucketLayerIDs[bucketIndex];
@@ -203,7 +205,7 @@ class FeatureIndex {
             }
 
             const geojsonFeature = new GeoJSONFeature(feature, this.z, this.x, this.y, id);
-            (geojsonFeature: any).layer = styleLayer.serialize();
+            (geojsonFeature: any).layer = serializedLayers[layerID];
             let layerResult = result[layerID];
             if (layerResult === undefined) {
                 layerResult = result[layerID] = [];
@@ -219,7 +221,8 @@ class FeatureIndex {
                          sourceLayerIndex: number,
                          filterSpec: FilterSpecification,
                          filterLayerIDs: Array<string>,
-                         styleLayers: {[string]: StyleLayer}) {
+                         styleLayers: {[string]: StyleLayer},
+                         serializedLayers: {[string]: Object}) {
         const result = {};
         this.loadVTLayers();
 
@@ -233,7 +236,8 @@ class FeatureIndex {
                 symbolFeatureIndex,
                 filter,
                 filterLayerIDs,
-                styleLayers
+                styleLayers,
+                serializedLayers
             );
 
         }

src/source/query_features.js

@@ -40,6 +40,7 @@ function queryIncludes3DLayer(layers?: Array<string>, styleLayers: {[string]: St
 
 export function queryRenderedFeatures(sourceCache: SourceCache,
                             styleLayers: {[string]: StyleLayer},
+                            serializedLayers: {[string]: Object},
                             queryGeometry: Array<Point>,
                             params: { filter: FilterSpecification, layers: Array<string> },
                             transform: Transform) {
@@ -57,6 +58,7 @@ export function queryRenderedFeatures(sourceCache: SourceCache,
             wrappedTileID: tileIn.tileID.wrapped().key,
             queryResults: tileIn.tile.queryRenderedFeatures(
                 styleLayers,
+                serializedLayers,
                 sourceCache._state,
                 tileIn.queryGeometry,
                 tileIn.cameraQueryGeometry,
@@ -86,6 +88,7 @@ export function queryRenderedFeatures(sourceCache: SourceCache,
 }
 
 export function queryRenderedSymbols(styleLayers: {[string]: StyleLayer},
+                            serializedLayers: {[string]: Object},
                             sourceCaches: {[string]: SourceCache},
                             queryGeometry: Array<Point>,
                             params: { filter: FilterSpecification, layers: Array<string> },
@@ -106,7 +109,8 @@ export function queryRenderedSymbols(styleLayers: {[string]: StyleLayer},
                 queryData.sourceLayerIndex,
                 params.filter,
                 params.layers,
-                styleLayers);
+                styleLayers,
+                serializedLayers);
 
         for (const layerID in bucketSymbols) {
             const resultFeatures = result[layerID] = result[layerID] || [];

src/source/tile.js

@@ -265,6 +265,7 @@ class Tile {
     // Queries non-symbol features rendered for this tile.
     // Symbol features are queried globally
     queryRenderedFeatures(layers: {[string]: StyleLayer},
+                          serializedLayers: {[string]: Object},
                           sourceFeatureState: SourceFeatureState,
                           queryGeometry: Array<Point>,
                           cameraQueryGeometry: Array<Point>,
@@ -285,7 +286,7 @@ class Tile {
             transform,
             params,
             queryPadding: this.queryPadding * maxPitchScaleFactor
-        }, layers, sourceFeatureState);
+        }, layers, serializedLayers, sourceFeatureState);
     }
 
     querySourceFeatures(result: Array<GeoJSONFeature>, params: any) {

src/style/style.js

@@ -114,6 +114,7 @@ class Style extends Evented {
     _request: ?Cancelable;
     _spriteRequest: ?Cancelable;
     _layers: {[string]: StyleLayer};
+    _serializedLayers: {[string]: Object};
     _order: Array<string>;
     sourceCaches: {[string]: SourceCache};
     zoomHistory: ZoomHistory;
@@ -149,6 +150,7 @@ class Style extends Evented {
         this.crossTileSymbolIndex = new CrossTileSymbolIndex();
 
         this._layers = {};
+        this._serializedLayers = {};
         this._order  = [];
         this.sourceCaches = {};
         this.zoomHistory = new ZoomHistory();
@@ -262,10 +264,12 @@ class Style extends Evented {
         this._order = layers.map((layer) => layer.id);
 
         this._layers = {};
+        this._serializedLayers = {};
         for (let layer of layers) {
             layer = createStyleLayer(layer);
             layer.setEventedParent(this, {layer: {id: layer.id}});
             this._layers[layer.id] = layer;
+            this._serializedLayers[layer.id] = layer.serialize();
         }
         this.dispatcher.broadcast('setLayers', this._serializeLayers(this._order));
 
@@ -1079,12 +1083,18 @@ class Style extends Evented {
 
         const sourceResults = [];
 
+        // const serializedLayers = {};
+        // for (const layer in this._layers) {
+        //     serializedLayers[layer] = this._layers[layer].serialize();
+        // }
+
         for (const id in this.sourceCaches) {
             if (params.layers && !includedSources[id]) continue;
             sourceResults.push(
                 queryRenderedFeatures(
                     this.sourceCaches[id],
                     this._layers,
+                    this._serializedLayers,
                     queryGeometry,
                     params,
                     transform)
@@ -1097,6 +1107,7 @@ class Style extends Evented {
             sourceResults.push(
                 queryRenderedSymbols(
                     this._layers,
+                    this._serializedLayers,
                     this.sourceCaches,
                     queryGeometry,
                     params,

test/unit/source/query_features.test.js

@@ -10,7 +10,7 @@ test('QueryFeatures#rendered', (t) => {
     t.test('returns empty object if source returns no tiles', (t) => {
         const mockSourceCache = {tilesIn () { return []; }};
         const transform = new Transform();
-        const result = queryRenderedFeatures(mockSourceCache, undefined, {}, undefined, transform);
+        const result = queryRenderedFeatures(mockSourceCache, {}, undefined, {}, undefined, transform);
         t.deepEqual(result, []);
         t.end();
     });

test/unit/style/style.test.js

@@ -1811,7 +1811,7 @@ test('Style#queryRenderedFeatures', (t) => {
     const transform = new Transform();
     transform.resize(512, 512);
 
-    function queryMapboxFeatures(layers, getFeatureState, queryGeom, cameraQueryGeom, scale, params) {
+    function queryMapboxFeatures(layers, serializedLayers, getFeatureState, queryGeom, cameraQueryGeom, scale, params) {
         const features = {
             'land': [{
                 type: 'Feature',