Skip to content

Commit 57bd275

Browse files
author
Wykks
committed
perf(map, layer): only listen observed event
1 parent 2bc3518 commit 57bd275

File tree

1 file changed

+156
-60
lines changed

1 file changed

+156
-60
lines changed

‎src/app/lib/map/map.service.ts

+156-60
Original file line numberDiff line numberDiff line change
@@ -184,26 +184,34 @@ export class MapService {
184184
}
185185
});
186186
this.mapInstance.addLayer(layer.layerOptions, before);
187-
this.mapInstance.on('click', layer.layerOptions.id, (evt: MapboxGl.MapMouseEvent) => {
188-
this.zone.run(() => {
189-
layer.layerEvents.click.emit(evt);
187+
if (layer.layerEvents.click.observers.length) {
188+
this.mapInstance.on('click', layer.layerOptions.id, (evt: MapboxGl.MapMouseEvent) => {
189+
this.zone.run(() => {
190+
layer.layerEvents.click.emit(evt);
191+
});
190192
});
191-
});
192-
this.mapInstance.on('mouseenter', layer.layerOptions.id, (evt: MapboxGl.MapMouseEvent) => {
193-
this.zone.run(() => {
194-
layer.layerEvents.mouseEnter.emit(evt);
193+
}
194+
if (layer.layerEvents.mouseEnter.observers.length) {
195+
this.mapInstance.on('mouseenter', layer.layerOptions.id, (evt: MapboxGl.MapMouseEvent) => {
196+
this.zone.run(() => {
197+
layer.layerEvents.mouseEnter.emit(evt);
198+
});
195199
});
196-
});
197-
this.mapInstance.on('mouseleave', layer.layerOptions.id, (evt: MapboxGl.MapMouseEvent) => {
198-
this.zone.run(() => {
199-
layer.layerEvents.mouseLeave.emit(evt);
200+
}
201+
if (layer.layerEvents.mouseLeave.observers.length) {
202+
this.mapInstance.on('mouseleave', layer.layerOptions.id, (evt: MapboxGl.MapMouseEvent) => {
203+
this.zone.run(() => {
204+
layer.layerEvents.mouseLeave.emit(evt);
205+
});
200206
});
201-
});
202-
this.mapInstance.on('mousemove', layer.layerOptions.id, (evt: MapboxGl.MapMouseEvent) => {
203-
this.zone.run(() => {
204-
layer.layerEvents.mouseMove.emit(evt);
207+
}
208+
if (layer.layerEvents.mouseMove.observers.length) {
209+
this.mapInstance.on('mousemove', layer.layerOptions.id, (evt: MapboxGl.MapMouseEvent) => {
210+
this.zone.run(() => {
211+
layer.layerEvents.mouseMove.emit(evt);
212+
});
205213
});
206-
});
214+
}
207215
});
208216
}
209217

@@ -359,50 +367,138 @@ export class MapService {
359367
this.mapLoaded.complete();
360368
this.zone.run(() => events.load.emit(this.mapInstance));
361369
});
362-
this.mapInstance.on('resize', () => this.zone.run(() => events.resize.emit()));
363-
this.mapInstance.on('remove', () => this.zone.run(() => events.remove.emit()));
364-
this.mapInstance.on('mousedown', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseDown.emit(evt)));
365-
this.mapInstance.on('mouseup', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseUp.emit(evt)));
366-
this.mapInstance.on('mousemove', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseMove.emit(evt)));
367-
this.mapInstance.on('click', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.click.emit(evt)));
368-
this.mapInstance.on('dblclick', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.dblClick.emit(evt)));
369-
this.mapInstance.on('mouseenter', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseEnter.emit(evt)));
370-
this.mapInstance.on('mouseleave', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseLeave.emit(evt)));
371-
this.mapInstance.on('mouseover', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseOver.emit(evt)));
372-
this.mapInstance.on('mouseout', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseOut.emit(evt)));
373-
this.mapInstance.on('contextmenu', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.contextMenu.emit(evt)));
374-
this.mapInstance.on('touchstart', (evt: MapboxGl.MapTouchEvent) => this.zone.run(() => events.touchStart.emit(evt)));
375-
this.mapInstance.on('touchend', (evt: MapboxGl.MapTouchEvent) => this.zone.run(() => events.touchEnd.emit(evt)));
376-
this.mapInstance.on('touchmove', (evt: MapboxGl.MapTouchEvent) => this.zone.run(() => events.touchMove.emit(evt)));
377-
this.mapInstance.on('touchcancel', (evt: MapboxGl.MapTouchEvent) => this.zone.run(() => events.touchCancel.emit(evt)));
378-
this.mapInstance.on('movestart', (evt: DragEvent) => this.zone.run(() => events.moveStart.emit(evt)));
379-
this.mapInstance.on('move', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.move.emit(evt)));
380-
this.mapInstance.on('moveend', (evt: DragEvent) => this.zone.run(() => events.moveEnd.emit(evt)));
381-
this.mapInstance.on('dragstart', (evt: DragEvent) => this.zone.run(() => events.dragStart.emit(evt)));
382-
this.mapInstance.on('drag', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.drag.emit(evt)));
383-
this.mapInstance.on('dragend', (evt: DragEvent) => this.zone.run(() => events.dragEnd.emit(evt)));
384-
this.mapInstance.on('zoomstart', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.zoomStart.emit(evt)));
385-
this.mapInstance.on('zoom', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.zoomEvt.emit(evt)));
386-
this.mapInstance.on('zoomend', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.zoomEnd.emit(evt)));
387-
this.mapInstance.on('rotatestart', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.rotateStart.emit(evt)));
388-
this.mapInstance.on('rotate', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.rotate.emit(evt)));
389-
this.mapInstance.on('rotateend', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.rotateEnd.emit(evt)));
390-
this.mapInstance.on('pitchstart', (evt: MapboxGl.EventData) => this.zone.run(() => events.pitchStart.emit(evt)));
391-
this.mapInstance.on('pitch', (evt: MapboxGl.EventData) => this.zone.run(() => events.pitchEvt.emit(evt)));
392-
this.mapInstance.on('pitchend', (evt: MapboxGl.EventData) => this.zone.run(() => events.pitchEnd.emit(evt)));
393-
this.mapInstance.on('boxzoomstart', (evt: MapboxGl.MapBoxZoomEvent) => this.zone.run(() => events.boxZoomStart.emit(evt)));
394-
this.mapInstance.on('boxzoomend', (evt: MapboxGl.MapBoxZoomEvent) => this.zone.run(() => events.boxZoomEnd.emit(evt)));
395-
this.mapInstance.on('boxzoomcancel', (evt: MapboxGl.MapBoxZoomEvent) => this.zone.run(() => events.boxZoomCancel.emit(evt)));
396-
this.mapInstance.on('webglcontextlost', () => this.zone.run(() => events.webGlContextLost.emit()));
397-
this.mapInstance.on('webglcontextrestored', () => this.zone.run(() => events.webGlContextRestored.emit()));
398-
this.mapInstance.on('render', () => this.zone.run(() => events.render.emit()));
399-
this.mapInstance.on('error', () => this.zone.run(() => events.error.emit()));
400-
this.mapInstance.on('data', (evt: MapboxGl.EventData) => this.zone.run(() => events.data.emit(evt)));
401-
this.mapInstance.on('styledata', (evt: MapboxGl.EventData) => this.zone.run(() => events.styleData.emit(evt)));
402-
this.mapInstance.on('sourcedata', (evt: MapboxGl.EventData) => this.zone.run(() => events.sourceData.emit(evt)));
403-
this.mapInstance.on('dataloading', (evt: MapboxGl.EventData) => this.zone.run(() => events.dataLoading.emit(evt)));
404-
this.mapInstance.on('styledataloading', (evt: MapboxGl.EventData) => this.zone.run(() => events.styleDataLoading.emit(evt)));
405-
this.mapInstance.on('sourcedataloading', (evt: MapboxGl.EventData) => this.zone.run(() => events.sourceDataLoading.emit(evt)));
370+
if (events.resize.observers.length) {
371+
this.mapInstance.on('resize', () => this.zone.run(() => events.resize.emit()));
372+
}
373+
if (events.remove.observers.length) {
374+
this.mapInstance.on('remove', () => this.zone.run(() => events.remove.emit()));
375+
}
376+
if (events.mouseDown.observers.length) {
377+
this.mapInstance.on('mousedown', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseDown.emit(evt)));
378+
}
379+
if (events.mouseUp.observers.length) {
380+
this.mapInstance.on('mouseup', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseUp.emit(evt)));
381+
}
382+
if (events.mouseMove.observers.length) {
383+
this.mapInstance.on('mousemove', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseMove.emit(evt)));
384+
}
385+
if (events.click.observers.length) {
386+
this.mapInstance.on('click', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.click.emit(evt)));
387+
}
388+
if (events.dblClick.observers.length) {
389+
this.mapInstance.on('dblclick', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.dblClick.emit(evt)));
390+
}
391+
if (events.mouseEnter.observers.length) {
392+
this.mapInstance.on('mouseenter', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseEnter.emit(evt)));
393+
}
394+
if (events.mouseLeave.observers.length) {
395+
this.mapInstance.on('mouseleave', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseLeave.emit(evt)));
396+
}
397+
if (events.mouseOver.observers.length) {
398+
this.mapInstance.on('mouseover', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseOver.emit(evt)));
399+
}
400+
if (events.mouseOut.observers.length) {
401+
this.mapInstance.on('mouseout', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.mouseOut.emit(evt)));
402+
}
403+
if (events.contextMenu.observers.length) {
404+
this.mapInstance.on('contextmenu', (evt: MapboxGl.MapMouseEvent) => this.zone.run(() => events.contextMenu.emit(evt)));
405+
}
406+
if (events.touchStart.observers.length) {
407+
this.mapInstance.on('touchstart', (evt: MapboxGl.MapTouchEvent) => this.zone.run(() => events.touchStart.emit(evt)));
408+
}
409+
if (events.touchEnd.observers.length) {
410+
this.mapInstance.on('touchend', (evt: MapboxGl.MapTouchEvent) => this.zone.run(() => events.touchEnd.emit(evt)));
411+
}
412+
if (events.touchMove.observers.length) {
413+
this.mapInstance.on('touchmove', (evt: MapboxGl.MapTouchEvent) => this.zone.run(() => events.touchMove.emit(evt)));
414+
}
415+
if (events.touchCancel.observers.length) {
416+
this.mapInstance.on('touchcancel', (evt: MapboxGl.MapTouchEvent) => this.zone.run(() => events.touchCancel.emit(evt)));
417+
}
418+
if (events.moveStart.observers.length) {
419+
this.mapInstance.on('movestart', (evt: DragEvent) => this.zone.run(() => events.moveStart.emit(evt)));
420+
}
421+
if (events.move.observers.length) {
422+
this.mapInstance.on('move', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.move.emit(evt)));
423+
}
424+
if (events.moveEnd.observers.length) {
425+
this.mapInstance.on('moveend', (evt: DragEvent) => this.zone.run(() => events.moveEnd.emit(evt)));
426+
}
427+
if (events.dragStart.observers.length) {
428+
this.mapInstance.on('dragstart', (evt: DragEvent) => this.zone.run(() => events.dragStart.emit(evt)));
429+
}
430+
if (events.drag.observers.length) {
431+
this.mapInstance.on('drag', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.drag.emit(evt)));
432+
}
433+
if (events.dragEnd.observers.length) {
434+
this.mapInstance.on('dragend', (evt: DragEvent) => this.zone.run(() => events.dragEnd.emit(evt)));
435+
}
436+
if (events.zoomStart.observers.length) {
437+
this.mapInstance.on('zoomstart', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.zoomStart.emit(evt)));
438+
}
439+
if (events.zoomEvt.observers.length) {
440+
this.mapInstance.on('zoom', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.zoomEvt.emit(evt)));
441+
}
442+
if (events.zoomEnd.observers.length) {
443+
this.mapInstance.on('zoomend', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.zoomEnd.emit(evt)));
444+
}
445+
if (events.rotateStart.observers.length) {
446+
this.mapInstance.on('rotatestart', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.rotateStart.emit(evt)));
447+
}
448+
if (events.rotate.observers.length) {
449+
this.mapInstance.on('rotate', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.rotate.emit(evt)));
450+
}
451+
if (events.rotateEnd.observers.length) {
452+
this.mapInstance.on('rotateend', (evt: MapboxGl.MapTouchEvent | MapboxGl.MapMouseEvent) => this.zone.run(() => events.rotateEnd.emit(evt)));
453+
}
454+
if (events.pitchStart.observers.length) {
455+
this.mapInstance.on('pitchstart', (evt: MapboxGl.EventData) => this.zone.run(() => events.pitchStart.emit(evt)));
456+
}
457+
if (events.pitchEvt.observers.length) {
458+
this.mapInstance.on('pitch', (evt: MapboxGl.EventData) => this.zone.run(() => events.pitchEvt.emit(evt)));
459+
}
460+
if (events.pitchEnd.observers.length) {
461+
this.mapInstance.on('pitchend', (evt: MapboxGl.EventData) => this.zone.run(() => events.pitchEnd.emit(evt)));
462+
}
463+
if (events.boxZoomStart.observers.length) {
464+
this.mapInstance.on('boxzoomstart', (evt: MapboxGl.MapBoxZoomEvent) => this.zone.run(() => events.boxZoomStart.emit(evt)));
465+
}
466+
if (events.boxZoomEnd.observers.length) {
467+
this.mapInstance.on('boxzoomend', (evt: MapboxGl.MapBoxZoomEvent) => this.zone.run(() => events.boxZoomEnd.emit(evt)));
468+
}
469+
if (events.boxZoomCancel.observers.length) {
470+
this.mapInstance.on('boxzoomcancel', (evt: MapboxGl.MapBoxZoomEvent) => this.zone.run(() => events.boxZoomCancel.emit(evt)));
471+
}
472+
if (events.webGlContextLost.observers.length) {
473+
this.mapInstance.on('webglcontextlost', () => this.zone.run(() => events.webGlContextLost.emit()));
474+
}
475+
if (events.webGlContextRestored.observers.length) {
476+
this.mapInstance.on('webglcontextrestored', () => this.zone.run(() => events.webGlContextRestored.emit()));
477+
}
478+
if (events.render.observers.length) {
479+
this.mapInstance.on('render', () => this.zone.run(() => events.render.emit()));
480+
}
481+
if (events.error.observers.length) {
482+
this.mapInstance.on('error', () => this.zone.run(() => events.error.emit()));
483+
}
484+
if (events.data.observers.length) {
485+
this.mapInstance.on('data', (evt: MapboxGl.EventData) => this.zone.run(() => events.data.emit(evt)));
486+
}
487+
if (events.styleData.observers.length) {
488+
this.mapInstance.on('styledata', (evt: MapboxGl.EventData) => this.zone.run(() => events.styleData.emit(evt)));
489+
}
490+
if (events.sourceData.observers.length) {
491+
this.mapInstance.on('sourcedata', (evt: MapboxGl.EventData) => this.zone.run(() => events.sourceData.emit(evt)));
492+
}
493+
if (events.dataLoading.observers.length) {
494+
this.mapInstance.on('dataloading', (evt: MapboxGl.EventData) => this.zone.run(() => events.dataLoading.emit(evt)));
495+
}
496+
if (events.styleDataLoading.observers.length) {
497+
this.mapInstance.on('styledataloading', (evt: MapboxGl.EventData) => this.zone.run(() => events.styleDataLoading.emit(evt)));
498+
}
499+
if (events.sourceDataLoading.observers.length) {
500+
this.mapInstance.on('sourcedataloading', (evt: MapboxGl.EventData) => this.zone.run(() => events.sourceDataLoading.emit(evt)));
501+
}
406502
}
407503

408504
// TODO move this elsewhere

0 commit comments

Comments
 (0)