Performance: fix stuttering at low zoom

This commit is contained in:
Pieter Vander Vennet 2023-11-15 03:59:02 +01:00
parent 4f4b60afd8
commit e9a511e5bd
4 changed files with 13 additions and 2 deletions

View file

@ -39,7 +39,7 @@ export default class LayoutSource extends FeatureSourceMerger {
const osmLayers = layers.filter((layer) => layer.source.geojsonSource === undefined) const osmLayers = layers.filter((layer) => layer.source.geojsonSource === undefined)
const fromCache = osmLayers.map( const fromCache = osmLayers.map(
(l) => (l) =>
new LocalStorageFeatureSource(backend, l.id, 15, mapProperties, { new LocalStorageFeatureSource(backend, l, 15, mapProperties, {
isActive: isDisplayed(l.id), isActive: isDisplayed(l.id),
maxAge: l.maxAgeOfCache, maxAge: l.maxAgeOfCache,
}) })

View file

@ -66,6 +66,7 @@ export default class DynamicGeoJsonTileSource extends DynamicTileSource {
const blackList = new Set<string>() const blackList = new Set<string>()
super( super(
source.geojsonZoomLevel, source.geojsonZoomLevel,
layer.minzoom,
(zxy) => { (zxy) => {
if (whitelist !== undefined) { if (whitelist !== undefined) {
const isWhiteListed = whitelist.get(zxy[1])?.has(zxy[2]) const isWhiteListed = whitelist.get(zxy[1])?.has(zxy[2])

View file

@ -11,6 +11,7 @@ import FeatureSourceMerger from "../Sources/FeatureSourceMerger"
export default class DynamicTileSource extends FeatureSourceMerger { export default class DynamicTileSource extends FeatureSourceMerger {
constructor( constructor(
zoomlevel: number, zoomlevel: number,
minzoom: number,
constructSource: (tileIndex) => FeatureSource, constructSource: (tileIndex) => FeatureSource,
mapProperties: { mapProperties: {
bounds: Store<BBox> bounds: Store<BBox>
@ -26,6 +27,12 @@ export default class DynamicTileSource extends FeatureSourceMerger {
mapProperties.bounds mapProperties.bounds
.mapD( .mapD(
(bounds) => { (bounds) => {
if (options?.isActive && !options?.isActive.data) {
return undefined
}
if (mapProperties.zoom.data < minzoom) {
return undefined
}
const tileRange = Tiles.TileRangeBetween( const tileRange = Tiles.TileRangeBetween(
zoomlevel, zoomlevel,
bounds.getNorth(), bounds.getNorth(),

View file

@ -4,11 +4,12 @@ import { BBox } from "../../BBox"
import TileLocalStorage from "../Actors/TileLocalStorage" import TileLocalStorage from "../Actors/TileLocalStorage"
import { Feature } from "geojson" import { Feature } from "geojson"
import StaticFeatureSource from "../Sources/StaticFeatureSource" import StaticFeatureSource from "../Sources/StaticFeatureSource"
import LayerConfig from "../../../Models/ThemeConfig/LayerConfig"
export default class LocalStorageFeatureSource extends DynamicTileSource { export default class LocalStorageFeatureSource extends DynamicTileSource {
constructor( constructor(
backend: string, backend: string,
layername: string, layer: LayerConfig,
zoomlevel: number, zoomlevel: number,
mapProperties: { mapProperties: {
bounds: Store<BBox> bounds: Store<BBox>
@ -19,6 +20,7 @@ export default class LocalStorageFeatureSource extends DynamicTileSource {
maxAge?: number // In seconds maxAge?: number // In seconds
} }
) { ) {
const layername = layer.id
const storage = TileLocalStorage.construct<Feature[]>( const storage = TileLocalStorage.construct<Feature[]>(
backend, backend,
layername, layername,
@ -26,6 +28,7 @@ export default class LocalStorageFeatureSource extends DynamicTileSource {
) )
super( super(
zoomlevel, zoomlevel,
layer.minzoom,
(tileIndex) => (tileIndex) =>
new StaticFeatureSource( new StaticFeatureSource(
storage.getTileSource(tileIndex).mapD((features) => { storage.getTileSource(tileIndex).mapD((features) => {