From 615af106d88bf4782da4f2649b2ff9f2de130bd7 Mon Sep 17 00:00:00 2001
From: Thibault Deckers <thibault.deckers@gmail.com>
Date: Thu, 26 Sep 2024 00:09:12 +0200
Subject: [PATCH] improved overhead

---
 .../common/map/leaflet/tile_layers.dart       | 66 ++++++++++++-------
 .../leaflet/vector_style_reader_extra.dart    | 12 ++--
 2 files changed, 47 insertions(+), 31 deletions(-)

diff --git a/lib/widgets/common/map/leaflet/tile_layers.dart b/lib/widgets/common/map/leaflet/tile_layers.dart
index ac184c02d..417947ff8 100644
--- a/lib/widgets/common/map/leaflet/tile_layers.dart
+++ b/lib/widgets/common/map/leaflet/tile_layers.dart
@@ -54,50 +54,66 @@ class OsmLibertyLayer extends StatefulWidget {
 }
 
 class _OsmLibertyLayerState extends State<OsmLibertyLayer> {
-  late final Future<Style> _americanaStyleFuture;
-  late final Future<Style> _osmLibertyStyleFuture;
+  late final Future<TileProviders> _tileProviderFuture;
+  late final Future<Style> _styleFuture;
 
   static const _openMapTileProviderSource = 'openmaptiles';
 
-  // `Americana` provides tiles, but it uses layer syntax that is not supported by the vector tile renderer
-  static const _americanaStyle = 'https://americanamap.org/style.json';
+  // `Americana` provides tiles, but it uses layer syntax that is not supported by the vector tile renderer.
+  // Full style is at 'https://americanamap.org/style.json' but it is heavy (1.0 MB, mostly for the layers).
+  static const _americanaTileProviderUri = 'https://tile.ourmap.us/data/v3.json';
 
-  // `OSM Liberty` is well supported by the vector tile renderer, but it requires an API key for the tiles
-  static const _osmLiberty = 'https://maputnik.github.io/osm-liberty/style.json';
+  // `OSM Liberty` is well supported by the vector tile renderer, but it requires an API key for the tiles.
+  static const _osmLibertyStyleUri = 'https://maputnik.github.io/osm-liberty/style.json';
+
+  // as of 2024/09/25,
+  // Americana provider JSON:     39.4 kB
+  // OSM Liberty style JSON:      48.3 kB
+  // OSM Liberty sprites JSON 1x: 16.6 kB
+  // OSM Liberty sprites  PNG 1x: 30.4 kB
+  // OSM Liberty sprites JSON 2x: 16.6 kB
+  // OSM Liberty sprites  PNG 2x: 82.5 kB
+  // -> total overhead:          233.8 kB
 
   @override
   void initState() {
     super.initState();
 
-    _americanaStyleFuture = StyleReader(
-      uri: _americanaStyle,
-    ).readExtra(skippedSources: {});
+    _tileProviderFuture = StyleReaderExtra.readProviderByName(
+      {
+        _openMapTileProviderSource: {
+          'url': _americanaTileProviderUri,
+          'type': 'vector',
+        }
+      },
+    ).then(TileProviders.new);
 
-    _osmLibertyStyleFuture = StyleReader(
-      uri: _osmLiberty,
+    _styleFuture = StyleReader(
+      uri: _osmLibertyStyleUri,
       logger: const vtr.Logger.console(),
-    ).readExtra(skippedSources: {_openMapTileProviderSource});
+    ).readExtra(skipSources: true);
   }
 
   @override
   Widget build(BuildContext context) {
-    return FutureBuilder<Style>(
-      future: _americanaStyleFuture,
-      builder: (context, americanaStyleSnapshot) {
+    return FutureBuilder<TileProviders>(
+      future: _tileProviderFuture,
+      builder: (context, tileProviderSnapshot) {
         return FutureBuilder<Style>(
-          future: _osmLibertyStyleFuture,
-          builder: (context, osmLibertyStyleSnapshot) {
-            if (americanaStyleSnapshot.hasError) return Text(americanaStyleSnapshot.error.toString());
-            if (osmLibertyStyleSnapshot.hasError) return Text(osmLibertyStyleSnapshot.error.toString());
+          future: _styleFuture,
+          builder: (context, styleSnapshot) {
+            if (tileProviderSnapshot.hasError) return Text(tileProviderSnapshot.error.toString());
+            if (styleSnapshot.hasError) return Text(styleSnapshot.error.toString());
 
-            final americanaStyle = americanaStyleSnapshot.data;
-            final osmLibertyStyle = osmLibertyStyleSnapshot.data;
-            if (americanaStyle == null || osmLibertyStyle == null) return const SizedBox();
+            final tileProviders = tileProviderSnapshot.data;
+            final style = styleSnapshot.data;
+            if (tileProviders == null || style == null) return const SizedBox();
 
             return VectorTileLayer(
-              tileProviders: americanaStyle.providers,
-              theme: osmLibertyStyle.theme,
-              sprites: osmLibertyStyle.sprites,
+              tileProviders: tileProviders,
+              theme: style.theme,
+              sprites: style.sprites,
+              // `vector` is higher quality and follows map orientation, but it is slower
               layerMode: VectorTileLayerMode.raster,
             );
           },
diff --git a/lib/widgets/common/map/leaflet/vector_style_reader_extra.dart b/lib/widgets/common/map/leaflet/vector_style_reader_extra.dart
index 3e693d1b3..4f7649b0e 100644
--- a/lib/widgets/common/map/leaflet/vector_style_reader_extra.dart
+++ b/lib/widgets/common/map/leaflet/vector_style_reader_extra.dart
@@ -7,14 +7,14 @@ import 'package:vector_map_tiles/vector_map_tiles.dart';
 import 'package:vector_tile_renderer/vector_tile_renderer.dart';
 
 extension StyleReaderExtra on StyleReader {
-  Future<Style> readExtra({required Set<String> skippedSources}) async {
+  Future<Style> readExtra({required bool skipSources}) async {
     final styleText = await _httpGet(uri);
     final style = await compute(jsonDecode, styleText);
     if (style is! Map<String, dynamic>) {
       throw _invalidStyle(uri);
     }
     final sources = style['sources'] as Map<String, dynamic>;
-    final providerByName = await _readProviderByName(Map.fromEntries(sources.entries.where((kv) => !skippedSources.contains(kv.key))));
+    final Map<String, VectorTileProvider> providerByName = skipSources ? {} : await readProviderByName(sources);
     final name = style['name'] as String?;
 
     final center = style['center'];
@@ -52,7 +52,7 @@ extension StyleReaderExtra on StyleReader {
     return Style(theme: ThemeReader(logger: logger).read(style), providers: TileProviders(providerByName), sprites: sprites, name: name, center: centerPoint, zoom: zoom);
   }
 
-  Future<Map<String, VectorTileProvider>> _readProviderByName(Map<String, dynamic> sources) async {
+  static Future<Map<String, VectorTileProvider>> readProviderByName(Map<String, dynamic> sources) async {
     final providers = <String, VectorTileProvider>{};
     final sourceEntries = sources.entries.toList();
     for (final entry in sourceEntries) {
@@ -84,9 +84,9 @@ extension StyleReaderExtra on StyleReader {
     return providers;
   }
 
-  String _invalidStyle(String url) => 'Uri does not appear to be a valid style: $url';
+  static String _invalidStyle(String url) => 'Uri does not appear to be a valid style: $url';
 
-  Future<String> _httpGet(String url) async {
+  static Future<String> _httpGet(String url) async {
     final response = await get(Uri.parse(url));
     if (response.statusCode == 200) {
       return response.body;
@@ -95,7 +95,7 @@ extension StyleReaderExtra on StyleReader {
     }
   }
 
-  Future<Uint8List> _loadBinary(String url) async {
+  static Future<Uint8List> _loadBinary(String url) async {
     final response = await get(Uri.parse(url));
     if (response.statusCode == 200) {
       return response.bodyBytes;