tileserver-gl-light 5.5.0-pre.1 → 5.5.0-pre.11

package/src/serve_rendered.js

@@ -24,7 +24,6 @@ import { SphericalMercator } from '@mapbox/sphericalmercator';
 import mlgl from '@maplibre/maplibre-gl-native';
 import polyline from '@mapbox/polyline';
 import proj4 from 'proj4';
-import axios from 'axios';
 import {
   allowedScales,
   allowedTileSizes,
@@ -62,8 +61,7 @@ const staticTypeRegex = new RegExp(
 );
 
 const PATH_PATTERN =
-  // eslint-disable-next-line security/detect-unsafe-regex -- Simple path pattern validation, no nested quantifiers
-  /^((fill|stroke|width)\:[^\|]+\|)*(enc:.+|-?\d+(\.\d*)?,-?\d+(\.\d*)?(\|-?\d+(\.\d*)?,-?\d+(\.\d*)?)+)/;
+  /^((fill|stroke|width|border|borderwidth):[^|]+\|)*(enc:.+|-?\d+(\.\d*)?,-?\d+(\.\d*)?(\|-?\d+(\.\d*)?,-?\d+(\.\d*)?)+)/;
 
 const mercator = new SphericalMercator();
 
@@ -165,7 +163,7 @@ function parseCoordinatePair(coordinates, query) {
   }
 
   // Check if coordinates have been provided as lat/lng pair instead of the
-  // ususal lng/lat pair and ensure resulting pair is lng/lat
+  // usual lng/lat pair and ensure resulting pair is lng/lat
   if (query.latlng === '1' || query.latlng === 'true') {
     return [secondCoordinate, firstCoordinate];
   }
@@ -183,9 +181,18 @@ function parseCoordinatePair(coordinates, query) {
 function parseCoordinates(coordinatePair, query, transformer) {
   const parsedCoordinates = parseCoordinatePair(coordinatePair, query);
 
+  if (!parsedCoordinates) {
+    return null;
+  }
+
   // Transform coordinates
   if (transformer) {
-    return transformer(parsedCoordinates);
+    try {
+      return transformer(parsedCoordinates);
+    } catch (error) {
+      console.error('Error transforming coordinates:', error);
+      return null;
+    }
   }
 
   return parsedCoordinates;
@@ -209,12 +216,37 @@ function extractPathsFromQuery(query, transformer) {
     const providedPaths = Array.isArray(query.path) ? query.path : [query.path];
     // Iterate through paths, parse and validate them
     for (const providedPath of providedPaths) {
+      let geometryString = providedPath;
+
+      // Logic to strip style options (like stroke:red) from the front
+      const parts = providedPath.split('|');
+      let firstGeometryIndex = 0;
+      for (const [index, part] of parts.entries()) {
+        // A part is considered a style option if it contains ':' but is NOT an 'enc:' string or a coordinate
+        if (part.includes(':') && !part.startsWith('enc:')) {
+          // This is a style option, continue
+          continue;
+        } else {
+          // This is the start of the geometry (enc: or coordinate)
+          firstGeometryIndex = index;
+          break;
+        }
+      }
+
+      // If we found a geometry, set the geometryString to the rest of the path
+      if (firstGeometryIndex > 0) {
+        geometryString = parts.slice(firstGeometryIndex).join('|');
+      }
+
       // Logic for pushing coords to path when path includes google polyline
-      if (providedPath.includes('enc:') && PATH_PATTERN.test(providedPath)) {
+      if (
+        geometryString.includes('enc:') &&
+        PATH_PATTERN.test(geometryString)
+      ) {
         // +4 because 'enc:' is 4 characters, everything after 'enc:' is considered to be part of the polyline
-        const encIndex = providedPath.indexOf('enc:') + 4;
+        const encIndex = geometryString.indexOf('enc:') + 4;
         const coords = polyline
-          .decode(providedPath.substring(encIndex))
+          .decode(geometryString.substring(encIndex))
           .map(([lat, lng]) => [lng, lat]);
         paths.push(coords);
       } else {
@@ -222,7 +254,7 @@ function extractPathsFromQuery(query, transformer) {
         const currentPath = [];
 
         // Extract coordinate-list from path
-        const pathParts = (providedPath || '').split('|');
+        const pathParts = (geometryString || '').split('|');
 
         // Iterate through coordinate-list, parse the coordinates and validate them
         for (const pair of pathParts) {
@@ -250,6 +282,7 @@ function extractPathsFromQuery(query, transformer) {
   }
   return paths;
 }
+
 /**
  * Parses marker options provided via query and sets corresponding attributes
  * on marker object.
@@ -269,21 +302,38 @@ function parseMarkerOptions(optionsList, marker) {
 
     switch (optionParts[0]) {
       // Scale factor to up- or downscale icon
-      case 'scale':
-        // Scale factors must not be negative
-        marker.scale = Math.abs(parseFloat(optionParts[1]));
+      case 'scale': {
+        // Scale factors must not be negative and should have reasonable bounds
+        const scale = parseFloat(optionParts[1]);
+        if (!isNaN(scale) && scale > 0 && scale < 10) {
+          marker.scale = scale;
+        } else {
+          console.warn(`Invalid marker scale: ${optionParts[1]}`);
+        }
         break;
+      }
       // Icon offset as positive or negative pixel value in the following
       // format [offsetX],[offsetY] where [offsetY] is optional
-      case 'offset':
+      case 'offset': {
         const providedOffset = optionParts[1].split(',');
+        const offsetX = parseFloat(providedOffset[0]);
+
         // Set X-axis offset
-        marker.offsetX = parseFloat(providedOffset[0]);
+        if (!isNaN(offsetX) && Math.abs(offsetX) < 1000) {
+          marker.offsetX = offsetX;
+        }
+
         // Check if an offset has been provided for Y-axis
         if (providedOffset.length > 1) {
-          marker.offsetY = parseFloat(providedOffset[1]);
+          const offsetY = parseFloat(providedOffset[1]);
+          if (!isNaN(offsetY) && Math.abs(offsetY) < 1000) {
+            marker.offsetY = offsetY;
+          }
         }
         break;
+      }
+      default:
+        console.warn(`Unknown marker option: ${optionParts[0]}`);
     }
   }
 }
@@ -304,25 +354,32 @@ function extractMarkersFromQuery(query, options, transformer) {
   const markers = [];
 
   // Check if multiple markers have been provided and mimic a list if it's a
-  // single maker.
+  // single marker.
   const providedMarkers = Array.isArray(query.marker)
     ? query.marker
     : [query.marker];
 
-  // Iterate through provided markers which can have one of the following
-  // formats
-  // [location]|[pathToFileTelativeToConfiguredIconPath]
+  // Iterate through provided markers which can have one of the following formats:
+  // [location]|[pathToFileRelativeToConfiguredIconPath]
   // [location]|[pathToFile...]|[option]|[option]|...
   for (const providedMarker of providedMarkers) {
+    if (typeof providedMarker !== 'string') {
+      continue;
+    }
+
     const markerParts = providedMarker.split('|');
+
     // Ensure we got at least a location and an icon uri
     if (markerParts.length < 2) {
+      console.warn('Marker requires at least location and icon path');
       continue;
     }
 
     const locationParts = markerParts[0].split(',');
+
     // Ensure the locationParts contains two items
     if (locationParts.length !== 2) {
+      console.warn('Marker location must have exactly 2 coordinates');
       continue;
     }
 
@@ -338,6 +395,7 @@ function extractMarkersFromQuery(query, options, transformer) {
 
       // If the selected icon is not part of available icons skip it
       if (!options.paths.availableIcons.includes(iconURI)) {
+        console.warn(`Icon not in available icons: ${iconURI}`);
         continue;
       }
 
@@ -345,21 +403,24 @@ function extractMarkersFromQuery(query, options, transformer) {
 
       // When we encounter a remote icon check if the configuration explicitly allows them.
     } else if (isRemoteURL && options.allowRemoteMarkerIcons !== true) {
+      console.warn('Remote marker icons not allowed');
       continue;
     } else if (isDataURL && options.allowInlineMarkerImages !== true) {
+      console.warn('Inline marker images not allowed');
       continue;
     }
 
     // Ensure marker location could be parsed
     const location = parseCoordinates(locationParts, query, transformer);
     if (location === null) {
+      console.warn('Failed to parse marker location');
       continue;
     }
 
-    const marker = {};
-
-    marker.location = location;
-    marker.icon = iconURI;
+    const marker = {
+      location,
+      icon: iconURI,
+    };
 
     // Check if options have been provided
     if (markerParts.length > 2) {
@@ -453,6 +514,7 @@ async function respondImage(
   }
 
   if (format === 'png' || format === 'webp') {
+    /* empty */
   } else if (format === 'jpg' || format === 'jpeg') {
     format = 'jpeg';
   } else {
@@ -469,7 +531,45 @@ async function respondImage(
     pool = item.map.renderersStatic[scale];
   }
 
+  if (!pool) {
+    console.error(`Pool not found for scale ${scale}, mode ${mode}`);
+    return res.status(500).send('Renderer pool not configured');
+  }
+
   pool.acquire(async (err, renderer) => {
+    // Check if pool.acquire failed or returned null/invalid renderer
+    if (err) {
+      console.error('Failed to acquire renderer from pool:', err);
+      if (!res.headersSent) {
+        return res.status(503).send('Renderer pool error');
+      }
+      return;
+    }
+
+    if (!renderer) {
+      console.error(
+        'Renderer is null - likely crashed or failed to initialize',
+      );
+      if (!res.headersSent) {
+        return res.status(503).send('Renderer unavailable');
+      }
+      return;
+    }
+
+    // Validate renderer has required methods (basic health check)
+    if (typeof renderer.render !== 'function') {
+      console.error('Renderer is invalid - missing render method');
+      try {
+        pool.removeBadObject(renderer);
+      } catch (e) {
+        console.error('Error removing bad renderer:', e);
+      }
+      if (!res.headersSent) {
+        return res.status(503).send('Renderer invalid');
+      }
+      return;
+    }
+
     // For 512px tiles, use the actual maplibre-native zoom. For 256px tiles, use zoom - 1
     let mlglZ;
     if (width === 512) {
@@ -499,111 +599,162 @@ async function respondImage(
       params.height += tileMargin * 2;
     }
 
-    renderer.render(params, (err, data) => {
-      pool.release(renderer);
-      if (err) {
-        console.error(err);
-        return res.status(500).header('Content-Type', 'text/plain').send(err);
-      }
-
-      const image = sharp(data, {
-        raw: {
-          premultiplied: true,
-          width: params.width * scale,
-          height: params.height * scale,
-          channels: 4,
-        },
-      });
-
-      if (z > 0 && tileMargin > 0) {
-        const y = mercator.px(params.center, z)[1];
-        const yoffset = Math.max(
-          Math.min(0, y - 128 - tileMargin),
-          y + 128 + tileMargin - Math.pow(2, z + 8),
-        );
-        image.extract({
-          left: tileMargin * scale,
-          top: (tileMargin + yoffset) * scale,
-          width: width * scale,
-          height: height * scale,
-        });
-      }
-      // HACK(Part 2) 256px tiles are a zoom level lower than maplibre-native default tiles. this hack allows tileserver-gl to support zoom 0 256px tiles, which would actually be zoom -1 in maplibre-native. Since zoom -1 isn't supported, a double sized zoom 0 tile is requested and resized here.
+    // Set a timeout for the render operation to detect hung renderers
+    const renderTimeout = setTimeout(() => {
+      console.error('Renderer timeout - destroying hung renderer');
 
-      if (z === 0 && width === 256) {
-        image.resize(width * scale, height * scale);
+      try {
+        pool.removeBadObject(renderer);
+      } catch (e) {
+        console.error('Error removing timed-out renderer:', e);
       }
-      // END HACK(Part 2)
 
-      const composites = [];
-      if (overlay) {
-        composites.push({ input: overlay });
+      if (!res.headersSent) {
+        res.status(503).send('Renderer timeout');
       }
-      if (item.watermark) {
-        const canvas = renderWatermark(width, height, scale, item.watermark);
+    }, 30000); // 30 second timeout
 
-        composites.push({ input: canvas.toBuffer() });
-      }
+    try {
+      renderer.render(params, (err, data) => {
+        clearTimeout(renderTimeout);
 
-      if (mode === 'static' && item.staticAttributionText) {
-        const canvas = renderAttribution(
-          width,
-          height,
-          scale,
-          item.staticAttributionText,
-        );
+        if (res.headersSent) {
+          // Timeout already fired and sent response, don't process
+          return;
+        }
 
-        composites.push({ input: canvas.toBuffer() });
-      }
+        if (err) {
+          console.error('Render error:', err);
+          try {
+            pool.removeBadObject(renderer);
+          } catch (e) {
+            console.error('Error removing failed renderer:', e);
+          }
+          if (!res.headersSent) {
+            return res
+              .status(500)
+              .header('Content-Type', 'text/plain')
+              .send(err);
+          }
+          return;
+        }
 
-      if (composites.length > 0) {
-        image.composite(composites);
-      }
+        // Only release if render was successful
+        pool.release(renderer);
 
-      // Legacy formatQuality is deprecated but still works
-      const formatQualities = options.formatQuality || {};
-      if (Object.keys(formatQualities).length !== 0) {
-        console.log(
-          'WARNING: The formatQuality option is deprecated and has been replaced with formatOptions. Please see the documentation. The values from formatQuality will be used if a quality setting is not provided via formatOptions.',
-        );
-      }
-      // eslint-disable-next-line security/detect-object-injection -- format is validated above
-      const formatQuality = formatQualities[format];
-
-      // eslint-disable-next-line security/detect-object-injection -- format is validated above
-      const formatOptions = (options.formatOptions || {})[format] || {};
-
-      if (format === 'png') {
-        image.png({
-          progressive: formatOptions.progressive,
-          compressionLevel: formatOptions.compressionLevel,
-          adaptiveFiltering: formatOptions.adaptiveFiltering,
-          palette: formatOptions.palette,
-          quality: formatOptions.quality,
-          effort: formatOptions.effort,
-          colors: formatOptions.colors,
-          dither: formatOptions.dither,
-        });
-      } else if (format === 'jpeg') {
-        image.jpeg({
-          quality: formatOptions.quality || formatQuality || 80,
-          progressive: formatOptions.progressive,
+        const image = sharp(data, {
+          raw: {
+            premultiplied: true,
+            width: params.width * scale,
+            height: params.height * scale,
+            channels: 4,
+          },
         });
-      } else if (format === 'webp') {
-        image.webp({ quality: formatOptions.quality || formatQuality || 90 });
-      }
-      image.toBuffer((err, buffer, info) => {
-        if (!buffer) {
-          return res.status(404).send('Not found');
+
+        if (z > 0 && tileMargin > 0) {
+          const y = mercator.px(params.center, z)[1];
+          const yoffset = Math.max(
+            Math.min(0, y - 128 - tileMargin),
+            y + 128 + tileMargin - Math.pow(2, z + 8),
+          );
+          image.extract({
+            left: tileMargin * scale,
+            top: (tileMargin + yoffset) * scale,
+            width: width * scale,
+            height: height * scale,
+          });
+        }
+
+        // HACK(Part 2) 256px tiles are a zoom level lower than maplibre-native default tiles. this hack allows tileserver-gl to support zoom 0 256px tiles, which would actually be zoom -1 in maplibre-native. Since zoom -1 isn't supported, a double sized zoom 0 tile is requested and resized here.
+        if (z === 0 && width === 256) {
+          image.resize(width * scale, height * scale);
         }
 
-        res.set({
-          'Last-Modified': item.lastModified,
-          'Content-Type': `image/${format}`,
+        const composites = [];
+        if (overlay) {
+          composites.push({ input: overlay });
+        }
+        if (item.watermark) {
+          const canvas = renderWatermark(width, height, scale, item.watermark);
+          composites.push({ input: canvas.toBuffer() });
+        }
+
+        if (mode === 'static' && item.staticAttributionText) {
+          const canvas = renderAttribution(
+            width,
+            height,
+            scale,
+            item.staticAttributionText,
+          );
+          composites.push({ input: canvas.toBuffer() });
+        }
+
+        if (composites.length > 0) {
+          image.composite(composites);
+        }
+
+        // Legacy formatQuality is deprecated but still works
+        const formatQualities = options.formatQuality || {};
+        if (Object.keys(formatQualities).length !== 0) {
+          console.log(
+            'WARNING: The formatQuality option is deprecated and has been replaced with formatOptions. Please see the documentation. The values from formatQuality will be used if a quality setting is not provided via formatOptions.',
+          );
+        }
+        // eslint-disable-next-line security/detect-object-injection -- format is validated above
+        const formatQuality = formatQualities[format];
+        // eslint-disable-next-line security/detect-object-injection -- format is validated above
+        const formatOptions = (options.formatOptions || {})[format] || {};
+
+        if (format === 'png') {
+          image.png({
+            progressive: formatOptions.progressive,
+            compressionLevel: formatOptions.compressionLevel,
+            adaptiveFiltering: formatOptions.adaptiveFiltering,
+            palette: formatOptions.palette,
+            quality: formatOptions.quality,
+            effort: formatOptions.effort,
+            colors: formatOptions.colors,
+            dither: formatOptions.dither,
+          });
+        } else if (format === 'jpeg') {
+          image.jpeg({
+            quality: formatOptions.quality || formatQuality || 80,
+            progressive: formatOptions.progressive,
+          });
+        } else if (format === 'webp') {
+          image.webp({ quality: formatOptions.quality || formatQuality || 90 });
+        }
+
+        image.toBuffer((err, buffer, info) => {
+          if (err || !buffer) {
+            console.error('Sharp error:', err);
+            if (!res.headersSent) {
+              return res.status(500).send('Image processing failed');
+            }
+            return;
+          }
+
+          if (!res.headersSent) {
+            res.set({
+              'Last-Modified': item.lastModified,
+              'Content-Type': `image/${format}`,
+            });
+            return res.status(200).send(buffer);
+          }
         });
-        return res.status(200).send(buffer);
       });
-    });
+    } catch (error) {
+      clearTimeout(renderTimeout);
+      console.error('Unexpected error during render:', error);
+      try {
+        pool.removeBadObject(renderer);
+      } catch (e) {
+        console.error('Error removing renderer after error:', e);
+      }
+      if (!res.headersSent) {
+        return res.status(500).send('Render failed');
+      }
+    }
   });
 }
 
@@ -943,7 +1094,7 @@ export const serve_rendered = {
             (!p1 && p2 === 'static') || (p1 === 'static' && p2 === 'raw')
               ? 'static'
               : 'tile';
-          if (verbose) {
+          if (verbose >= 3) {
             console.log(
               `Handling rendered %s request for: /styles/%s%s/%s/%s/%s%s.%s`,
               requestType,
@@ -998,13 +1149,12 @@ export const serve_rendered = {
      * @returns {void}
      */
     app.get('{/:tileSize}/:id.json', (req, res, next) => {
-      // eslint-disable-next-line security/detect-object-injection -- req.params.id is route parameter, validated by Express
       const item = repo[req.params.id];
       if (!item) {
         return res.sendStatus(404);
       }
       const tileSize = parseInt(req.params.tileSize, 10) || undefined;
-      if (verbose) {
+      if (verbose >= 3) {
         console.log(
           `Handling rendered tilejson request for: /styles/%s%s.json`,
           req.params.tileSize
@@ -1055,11 +1205,16 @@ export const serve_rendered = {
       renderersStatic: [],
       sources: {},
       sourceTypes: {},
+      sparseFlags: {},
     };
 
-    const { publicUrl, verbose } = programOpts;
+    const { publicUrl, verbose, fetchTimeout } = programOpts;
 
     const styleJSON = clone(style);
+
+    // Global sparse flag for HTTP/remote sources (from config options)
+    const globalSparse = options.sparse ?? true;
+
     /**
      * Creates a pool of renderers.
      * @param {number} ratio Pixel ratio
@@ -1081,7 +1236,7 @@ export const serve_rendered = {
           ratio,
           request: async (req, callback) => {
             const protocol = req.url.split(':')[0];
-            if (verbose && verbose >= 3) {
+            if (verbose >= 3) {
               console.log('Handling request:', req);
             }
             if (protocol === 'sprites') {
@@ -1137,22 +1292,18 @@ export const serve_rendered = {
                 x,
                 y,
               );
-              if (fetchTile == null && sourceInfo.sparse == true) {
-                if (verbose) {
-                  console.log(
-                    'fetchTile warning on %s, sparse response',
-                    req.url,
-                  );
+              if (fetchTile == null) {
+                if (verbose >= 2) {
+                  console.log('fetchTile null on %s', req.url);
                 }
-                callback();
-                return;
-              } else if (fetchTile == null) {
-                if (verbose) {
-                  console.log(
-                    'fetchTile error on %s, serving empty response',
-                    req.url,
-                  );
+                // eslint-disable-next-line security/detect-object-injection -- sourceId from internal style source names
+                const sparse = map.sparseFlags[sourceId] ?? true;
+                // sparse=true (default) -> return empty callback so MapLibre can overzoom
+                if (sparse) {
+                  callback();
+                  return;
                 }
+                // sparse=false -> 204 (empty tile, no overzoom) - create blank response
                 createEmptyResponse(
                   sourceInfo.format,
                   sourceInfo.color,
@@ -1191,62 +1342,115 @@ export const serve_rendered = {
 
               callback(null, response);
             } else if (protocol === 'http' || protocol === 'https') {
+              const controller = new AbortController();
+              const timeoutMs = (fetchTimeout && Number(fetchTimeout)) || 15000;
+              let timeoutId;
+
               try {
-                const response = await axios.get(req.url, {
-                  responseType: 'arraybuffer', // Get the response as raw buffer
-                  // Axios handles gzip by default, so no need for a gzip flag
+                timeoutId = setTimeout(() => controller.abort(), timeoutMs);
+                const response = await fetch(req.url, {
+                  signal: controller.signal,
                 });
+                clearTimeout(timeoutId);
 
-                const responseHeaders = response.headers;
-                const responseData = response.data;
+                // HTTP 204 No Content means "empty tile" - generate a blank tile
+                if (response.status === 204) {
+                  const parts = url.parse(req.url);
+                  const extension = path.extname(parts.pathname).toLowerCase();
+                  // eslint-disable-next-line security/detect-object-injection -- extension is from path.extname, limited set
+                  const format = extensionToFormat[extension] || '';
+                  createEmptyResponse(format, '', callback);
+                  return;
+                }
+
+                if (!response.ok) {
+                  if (verbose >= 2) {
+                    console.log(
+                      'fetchTile HTTP %d on %s, %s',
+                      response.status,
+                      req.url,
+                      globalSparse
+                        ? 'allowing overzoom'
+                        : 'creating empty tile',
+                    );
+                  }
+
+                  if (globalSparse) {
+                    // sparse=true -> allow overzoom
+                    callback();
+                    return;
+                  }
+
+                  // sparse=false (default) -> create empty tile
+                  const parts = url.parse(req.url);
+                  const extension = path.extname(parts.pathname).toLowerCase();
+                  // eslint-disable-next-line security/detect-object-injection -- extension is from path.extname, limited set
+                  const format = extensionToFormat[extension] || '';
+                  createEmptyResponse(format, '', callback);
+                  return;
+                }
 
+                const responseHeaders = response.headers;
+                const responseData = await response.arrayBuffer();
                 const parsedResponse = {};
-                if (responseHeaders['last-modified']) {
+
+                if (responseHeaders.get('last-modified')) {
                   parsedResponse.modified = new Date(
-                    responseHeaders['last-modified'],
+                    responseHeaders.get('last-modified'),
                   );
                 }
-                if (responseHeaders.expires) {
-                  parsedResponse.expires = new Date(responseHeaders.expires);
+                if (responseHeaders.get('expires')) {
+                  parsedResponse.expires = new Date(
+                    responseHeaders.get('expires'),
+                  );
                 }
-                if (responseHeaders.etag) {
-                  parsedResponse.etag = responseHeaders.etag;
+                if (responseHeaders.get('etag')) {
+                  parsedResponse.etag = responseHeaders.get('etag');
                 }
 
-                parsedResponse.data = responseData;
+                parsedResponse.data = Buffer.from(responseData);
                 callback(null, parsedResponse);
               } catch (error) {
-                if (error.response && error.response.status === 410) {
-                  // This is the 410 "Gone" error, treat as sparse
-                  if (verbose) {
-                    console.log(
-                      'fetchTile warning on %s, sparse response due to 410 Gone',
-                      req.url,
-                    );
-                  }
-                  callback();
-                } else {
-                  // For all other errors (e.g., network errors, 404, 500, etc.) return empty content.
+                // Log DNS failures
+                if (error.cause?.code === 'ENOTFOUND') {
                   console.error(
-                    `Error fetching remote URL ${req.url}:`,
-                    error.message || error,
-                    error.response
-                      ? `Status: ${error.response.status}`
-                      : 'No response received',
+                    `DNS RESOLUTION FAILED for ${req.url}. ` +
+                      `This domain may be unreachable or misconfigured in your style. ` +
+                      `Consider removing it or fixing the DNS.`,
                   );
+                }
 
-                  const parts = url.parse(req.url);
-                  const extension = path.extname(parts.pathname).toLowerCase();
-                  // eslint-disable-next-line security/detect-object-injection -- extension is from path.extname, limited set
-                  const format = extensionToFormat[extension] || '';
-                  createEmptyResponse(format, '', callback);
+                // Log timeout
+                if (error.name === 'AbortError') {
+                  console.error(
+                    `FETCH TIMEOUT for ${req.url}. ` +
+                      `The request took longer than ${timeoutMs} ms to complete.`,
+                  );
                 }
+
+                // Log all other errors
+                console.error(
+                  `Error fetching remote URL ${req.url}:`,
+                  error.message || error,
+                );
+
+                if (globalSparse) {
+                  // sparse=true -> allow overzoom
+                  callback();
+                  return;
+                }
+
+                // sparse=false (default) -> create empty tile
+                const parts = url.parse(req.url);
+                const extension = path.extname(parts.pathname).toLowerCase();
+                // eslint-disable-next-line security/detect-object-injection -- extension is from path.extname, limited set
+                const format = extensionToFormat[extension] || '';
+                createEmptyResponse(format, '', callback);
               }
             } else if (protocol === 'file') {
               const name = decodeURI(req.url).substring(protocol.length + 3);
               const file = path.join(options.paths['files'], name);
               if (await existsP(file)) {
-                // eslint-disable-next-line security/detect-non-literal-fs-filename -- file path constructed from configured base path and URL-decoded filename
                 const inputFileStats = await fsp.stat(file);
                 if (!inputFileStats.isFile() || inputFileStats.size === 0) {
                   throw Error(
@@ -1318,7 +1522,7 @@ export const serve_rendered = {
 
         // Remove (flatten) 3D buildings
         if (layer.paint['fill-extrusion-height']) {
-          if (verbose) {
+          if (verbose >= 1) {
             console.warn(
               `Warning: Layer '${layerIdForWarning}' in style '${id}' has property 'fill-extrusion-height'. ` +
                 `3D extrusion may appear distorted or misleading when rendered as a static image due to camera angle limitations. ` +
@@ -1329,7 +1533,7 @@ export const serve_rendered = {
           layer.paint['fill-extrusion-height'] = 0;
         }
         if (layer.paint['fill-extrusion-base']) {
-          if (verbose) {
+          if (verbose >= 1) {
             console.warn(
               `Warning: Layer '${layerIdForWarning}' in style '${id}' has property 'fill-extrusion-base'. ` +
                 `3D extrusion may appear distorted or misleading when rendered as a static image due to camera angle limitations. ` +
@@ -1349,7 +1553,7 @@ export const serve_rendered = {
 
         for (const prop of hillshadePropertiesToRemove) {
           if (prop in layer.paint) {
-            if (verbose) {
+            if (verbose >= 1) {
               console.warn(
                 `Warning: Layer '${layerIdForWarning}' in style '${id}' has property '${prop}'. ` +
                   `This property is not supported by MapLibre Native. ` +
@@ -1364,7 +1568,7 @@ export const serve_rendered = {
 
         // --- Remove 'hillshade-shadow-color' if it is an array. It can only be a string in MapLibre Native ---
         if (Array.isArray(layer.paint['hillshade-shadow-color'])) {
-          if (verbose) {
+          if (verbose >= 1) {
             console.warn(
               `Warning: Layer '${layerIdForWarning}' in style '${id}' has property 'hillshade-shadow-color'. ` +
                 `An array value is not supported by MapLibre Native for this property (expected string/color). ` +
@@ -1410,7 +1614,6 @@ export const serve_rendered = {
 
     for (const name of Object.keys(styleJSON.sources)) {
       let sourceType;
-      let sparse;
       // eslint-disable-next-line security/detect-object-injection -- name is from style sources object keys
       let source = styleJSON.sources[name];
       let url = source.url;
@@ -1436,14 +1639,15 @@ export const serve_rendered = {
         let s3Profile;
         let requestPayer;
         let s3Region;
+        let s3UrlFormat;
         const dataInfo = dataResolver(dataId);
         if (dataInfo.inputFile) {
           inputFile = dataInfo.inputFile;
           sourceType = dataInfo.fileType;
-          sparse = dataInfo.sparse;
           s3Profile = dataInfo.s3Profile;
           requestPayer = dataInfo.requestPayer;
           s3Region = dataInfo.s3Region;
+          s3UrlFormat = dataInfo.s3UrlFormat;
         } else {
           console.error(`ERROR: data "${inputFile}" not found!`);
           process.exit(1);
@@ -1451,7 +1655,6 @@ export const serve_rendered = {
 
         // PMTiles supports remote URLs (HTTP and S3), skip file check for those
         if (!isValidRemoteUrl(inputFile)) {
-          // eslint-disable-next-line security/detect-non-literal-fs-filename -- inputFile is from dataResolver, which validates against config
           const inputFileStats = await fsp.stat(inputFile);
           if (!inputFileStats.isFile() || inputFileStats.size === 0) {
             throw Error(`Not valid PMTiles file: "${inputFile}"`);
@@ -1465,6 +1668,7 @@ export const serve_rendered = {
             s3Profile,
             requestPayer,
             s3Region,
+            s3UrlFormat,
             verbose,
           );
           // eslint-disable-next-line security/detect-object-injection -- name is from style sources object keys
@@ -1483,7 +1687,6 @@ export const serve_rendered = {
           const type = source.type;
           Object.assign(source, metadata);
           source.type = type;
-          source.sparse = sparse;
           source.tiles = [
             // meta url which will be detected when requested
             `pmtiles://${name}/{z}/{x}/{y}.${metadata.format || 'pbf'}`,
@@ -1502,9 +1705,16 @@ export const serve_rendered = {
               tileJSON.attribution += source.attribution;
             }
           }
+
+          // Set sparse flag: user config overrides format-based default
+          // Vector tiles (pbf) default to false (204), raster tiles default to true (404)
+          const isVector = metadata.format === 'pbf';
+          // eslint-disable-next-line security/detect-object-injection -- name is from style sources object keys
+          map.sparseFlags[name] =
+            dataInfo.sparse ?? options.sparse ?? !isVector;
         } else {
           // MBTiles does not support remote URLs
-          // eslint-disable-next-line security/detect-non-literal-fs-filename -- inputFile is from dataResolver, which validates against config
+
           const inputFileStats = await fsp.stat(inputFile);
           if (!inputFileStats.isFile() || inputFileStats.size === 0) {
             throw Error(`Not valid MBTiles file: "${inputFile}"`);
@@ -1527,7 +1737,6 @@ export const serve_rendered = {
           const type = source.type;
           Object.assign(source, info);
           source.type = type;
-          source.sparse = sparse;
           source.tiles = [
             // meta url which will be detected when requested
             `mbtiles://${name}/{z}/{x}/{y}.${info.format || 'pbf'}`,
@@ -1550,6 +1759,13 @@ export const serve_rendered = {
               tileJSON.attribution += source.attribution;
             }
           }
+
+          // Set sparse flag: user config overrides format-based default
+          // Vector tiles (pbf) default to false (204), raster tiles default to true (404)
+          const isVector = info.format === 'pbf';
+          // eslint-disable-next-line security/detect-object-injection -- name is from style sources object keys
+          map.sparseFlags[name] =
+            dataInfo.sparse ?? options.sparse ?? !isVector;
         }
       }
     }
@@ -1616,75 +1832,68 @@ export const serve_rendered = {
       delete repo[id];
     });
   },
+
   /**
-   * Get the elevation of terrain tile data by rendering it to a canvas image
-   * @param {Buffer} data The terrain tile data buffer.
-   * @param {object} param Required parameters (coordinates e.g.)
-   * @returns {Promise<object>} Promise resolving to elevation data
+   * Gets multiple elevation values from a single decoded tile image.
+   * @param {Buffer} data - Raw tile image data
+   * @param {object} param - Parameters object containing encoding, format, and tile_size
+   * @param {Array<{pixelX: number, pixelY: number, index: number}>} pixels - Array of pixel coordinates to sample
+   * @returns {Promise<Array<{index: number, elevation: number}>>} Promise resolving to array of elevation results
    */
-  getTerrainElevation: async function (data, param) {
-    return await new Promise(async (resolve, reject) => {
+  getBatchElevationsFromTile: async function (data, param, pixels) {
+    return new Promise((resolve, reject) => {
       const image = new Image();
-      image.onload = async () => {
-        const canvas = createCanvas(param['tile_size'], param['tile_size']);
-        const context = canvas.getContext('2d');
-        context.drawImage(image, 0, 0);
-
-        // calculate pixel coordinate of tile,
-        // see https://developers.google.com/maps/documentation/javascript/examples/map-coordinates
-        let siny = Math.sin((param['lat'] * Math.PI) / 180);
-        // Truncating to 0.9999 effectively limits latitude to 89.189. This is
-        // about a third of a tile past the edge of the world tile.
-        siny = Math.min(Math.max(siny, -0.9999), 0.9999);
-        const xWorld = param['tile_size'] * (0.5 + param['long'] / 360);
-        const yWorld =
-          param['tile_size'] *
-          (0.5 - Math.log((1 + siny) / (1 - siny)) / (4 * Math.PI));
-
-        const scale = 1 << param['z'];
-
-        const xTile = Math.floor((xWorld * scale) / param['tile_size']);
-        const yTile = Math.floor((yWorld * scale) / param['tile_size']);
-
-        const xPixel = Math.floor(xWorld * scale) - xTile * param['tile_size'];
-        const yPixel = Math.floor(yWorld * scale) - yTile * param['tile_size'];
-        if (
-          xPixel < 0 ||
-          yPixel < 0 ||
-          xPixel >= param['tile_size'] ||
-          yPixel >= param['tile_size']
-        ) {
-          return reject('Out of bounds Pixel');
-        }
-        const imgdata = context.getImageData(xPixel, yPixel, 1, 1);
-        const red = imgdata.data[0];
-        const green = imgdata.data[1];
-        const blue = imgdata.data[2];
-        let elevation;
-        if (param['encoding'] === 'mapbox') {
-          elevation = -10000 + (red * 256 * 256 + green * 256 + blue) * 0.1;
-        } else if (param['encoding'] === 'terrarium') {
-          elevation = red * 256 + green + blue / 256 - 32768;
-        } else {
-          elevation = 'invalid encoding';
+      image.onload = () => {
+        try {
+          const canvas = createCanvas(param.tile_size, param.tile_size);
+          const context = canvas.getContext('2d');
+          context.drawImage(image, 0, 0);
+
+          const results = [];
+          for (const pixel of pixels) {
+            const { pixelX, pixelY, index } = pixel;
+            if (
+              pixelX < 0 ||
+              pixelY < 0 ||
+              pixelX >= param.tile_size ||
+              pixelY >= param.tile_size
+            ) {
+              results.push({ index, elevation: null });
+              continue;
+            }
+            const imgdata = context.getImageData(pixelX, pixelY, 1, 1);
+            const red = imgdata.data[0];
+            const green = imgdata.data[1];
+            const blue = imgdata.data[2];
+            let elevation;
+            if (param.encoding === 'mapbox') {
+              elevation = -10000 + (red * 256 * 256 + green * 256 + blue) * 0.1;
+            } else if (param.encoding === 'terrarium') {
+              elevation = red * 256 + green + blue / 256 - 32768;
+            } else {
+              elevation = null;
+            }
+            results.push({ index, elevation });
+          }
+          resolve(results);
+        } catch (error) {
+          reject(error);
         }
-        param['elevation'] = elevation;
-        param['red'] = red;
-        param['green'] = green;
-        param['blue'] = blue;
-        resolve(param);
       };
       image.onerror = (err) => reject(err);
-      if (param['format'] === 'webp') {
+
+      (async () => {
         try {
-          const img = await sharp(data).toFormat('png').toBuffer();
-          image.src = img;
+          if (param.format === 'webp') {
+            const img = await sharp(data).toFormat('png').toBuffer();
+            image.src = `data:image/png;base64,${img.toString('base64')}`;
+          } else {
+            image.src = data;
+          }
         } catch (err) {
           reject(err);
         }
-      } else {
-        image.src = data;
-      }
+      })();
     });
   },
 };