Lossless Image Optimisation Example Images (#4189)

* Lossless Image Optimisation Example Images Saved 12.6 MB out of 20.8 MB. 30% per file on average. * Update README.md --------- Co-authored-by: Harel M <[email protected]>
maplibre · May 30, 2024 · 3164f1d · 3164f1d
1 parent cad7815
commit 3164f1d
Show file tree

Hide file tree

Showing 100 changed files with 2 additions and 1 deletion.
diff --git a/docs/README.md b/docs/README.md
@@ -59,7 +59,8 @@ Examples are written as regular html files in `test/examples`. Each example shou
 When you create a new example, you **must** make an accompanying image.
 
 1. Run `npm run generate-images <example-file-name>`. The script will take a screenshot of the map in the example and save it to `docs/assets/examples/`.
-2. Commit the image.
+2. Optimize the image with [Squoosh](https://squoosh.app/) to reduce the file size. (Optiomal)
+3. Commit the image.
 
 For some examples, `npm run generate-images` does not generate an ideal image. In these cases, you can interact with the map after running the command before the screenshot is taken, or take a screenshot yourself by running the site locally with `npm start`, take a screenshot and save it in the `docs/assets/examples/` folder.
 

diff --git a/docs/assets/examples/3d-buildings.png b/docs/assets/examples/3d-buildings.png
diff --git a/docs/assets/examples/3d-extrusion-floorplan.png b/docs/assets/examples/3d-extrusion-floorplan.png
diff --git a/docs/assets/examples/3d-terrain.png b/docs/assets/examples/3d-terrain.png
diff --git a/docs/assets/examples/add-3d-model-babylon.png b/docs/assets/examples/add-3d-model-babylon.png
diff --git a/docs/assets/examples/add-3d-model-with-terrain.png b/docs/assets/examples/add-3d-model-with-terrain.png
diff --git a/docs/assets/examples/add-3d-model.png b/docs/assets/examples/add-3d-model.png
diff --git a/docs/assets/examples/add-a-marker.png b/docs/assets/examples/add-a-marker.png
diff --git a/docs/assets/examples/add-deckgl-layer-using-rest-api.png b/docs/assets/examples/add-deckgl-layer-using-rest-api.png
diff --git a/docs/assets/examples/add-image-animated.png b/docs/assets/examples/add-image-animated.png
diff --git a/docs/assets/examples/add-image-generated.png b/docs/assets/examples/add-image-generated.png
diff --git a/docs/assets/examples/add-image-missing-generated.png b/docs/assets/examples/add-image-missing-generated.png
diff --git a/docs/assets/examples/add-image-stretchable.png b/docs/assets/examples/add-image-stretchable.png
diff --git a/docs/assets/examples/add-image.png b/docs/assets/examples/add-image.png
diff --git a/docs/assets/examples/animate-a-line.png b/docs/assets/examples/animate-a-line.png
diff --git a/docs/assets/examples/animate-camera-around-point.png b/docs/assets/examples/animate-camera-around-point.png
diff --git a/docs/assets/examples/animate-images.png b/docs/assets/examples/animate-images.png
diff --git a/docs/assets/examples/animate-marker.png b/docs/assets/examples/animate-marker.png
diff --git a/docs/assets/examples/animate-point-along-line.png b/docs/assets/examples/animate-point-along-line.png
diff --git a/docs/assets/examples/animate-point-along-route.png b/docs/assets/examples/animate-point-along-route.png
diff --git a/docs/assets/examples/attribution-position.png b/docs/assets/examples/attribution-position.png
diff --git a/docs/assets/examples/camera-animation.png b/docs/assets/examples/camera-animation.png
diff --git a/docs/assets/examples/canvas-source.png b/docs/assets/examples/canvas-source.png
diff --git a/docs/assets/examples/center-on-symbol.png b/docs/assets/examples/center-on-symbol.png
diff --git a/docs/assets/examples/change-building-color-based-on-zoom-level.png b/docs/assets/examples/change-building-color-based-on-zoom-level.png
diff --git a/docs/assets/examples/change-case-of-labels.png b/docs/assets/examples/change-case-of-labels.png
diff --git a/docs/assets/examples/check-for-support.png b/docs/assets/examples/check-for-support.png
diff --git a/docs/assets/examples/cluster-html.png b/docs/assets/examples/cluster-html.png
diff --git a/docs/assets/examples/cluster.png b/docs/assets/examples/cluster.png
diff --git a/docs/assets/examples/color-switcher.png b/docs/assets/examples/color-switcher.png
diff --git a/docs/assets/examples/contour-lines.png b/docs/assets/examples/contour-lines.png
diff --git a/docs/assets/examples/cooperative-gestures.png b/docs/assets/examples/cooperative-gestures.png
diff --git a/docs/assets/examples/custom-marker-icons.png b/docs/assets/examples/custom-marker-icons.png
diff --git a/docs/assets/examples/custom-style-layer.png b/docs/assets/examples/custom-style-layer.png
diff --git a/docs/assets/examples/data-driven-lines.png b/docs/assets/examples/data-driven-lines.png
diff --git a/docs/assets/examples/disable-rotation.png b/docs/assets/examples/disable-rotation.png
diff --git a/docs/assets/examples/disable-scroll-zoom.png b/docs/assets/examples/disable-scroll-zoom.png
diff --git a/docs/assets/examples/display-and-style-rich-text-labels.png b/docs/assets/examples/display-and-style-rich-text-labels.png
diff --git a/docs/assets/examples/drag-a-marker.png b/docs/assets/examples/drag-a-marker.png
diff --git a/docs/assets/examples/drag-a-point.png b/docs/assets/examples/drag-a-point.png
diff --git a/docs/assets/examples/fallback-image.png b/docs/assets/examples/fallback-image.png
diff --git a/docs/assets/examples/fill-pattern.png b/docs/assets/examples/fill-pattern.png
diff --git a/docs/assets/examples/filter-markers-by-input.png b/docs/assets/examples/filter-markers-by-input.png
diff --git a/docs/assets/examples/filter-markers.png b/docs/assets/examples/filter-markers.png
diff --git a/docs/assets/examples/filter-within-layer.png b/docs/assets/examples/filter-within-layer.png
diff --git a/docs/assets/examples/fitbounds.png b/docs/assets/examples/fitbounds.png
diff --git a/docs/assets/examples/flyto-options.png b/docs/assets/examples/flyto-options.png
diff --git a/docs/assets/examples/flyto.png b/docs/assets/examples/flyto.png
diff --git a/docs/assets/examples/fullscreen.png b/docs/assets/examples/fullscreen.png
diff --git a/docs/assets/examples/game-controls.png b/docs/assets/examples/game-controls.png
diff --git a/docs/assets/examples/geocoder.png b/docs/assets/examples/geocoder.png
diff --git a/docs/assets/examples/geojson-layer-in-stack.png b/docs/assets/examples/geojson-layer-in-stack.png
diff --git a/docs/assets/examples/geojson-line.png b/docs/assets/examples/geojson-line.png
diff --git a/docs/assets/examples/geojson-markers.png b/docs/assets/examples/geojson-markers.png
diff --git a/docs/assets/examples/geojson-polygon.png b/docs/assets/examples/geojson-polygon.png
diff --git a/docs/assets/examples/heatmap-layer.png b/docs/assets/examples/heatmap-layer.png
diff --git a/docs/assets/examples/hover-styles.png b/docs/assets/examples/hover-styles.png
diff --git a/docs/assets/examples/interactive-false.png b/docs/assets/examples/interactive-false.png
diff --git a/docs/assets/examples/jump-to.png b/docs/assets/examples/jump-to.png
diff --git a/docs/assets/examples/language-switch.png b/docs/assets/examples/language-switch.png
diff --git a/docs/assets/examples/line-across-180th-meridian.png b/docs/assets/examples/line-across-180th-meridian.png
diff --git a/docs/assets/examples/line-gradient.png b/docs/assets/examples/line-gradient.png
diff --git a/docs/assets/examples/live-geojson.png b/docs/assets/examples/live-geojson.png
diff --git a/docs/assets/examples/live-update-feature.png b/docs/assets/examples/live-update-feature.png
diff --git a/docs/assets/examples/local-geojson-experimental.png b/docs/assets/examples/local-geojson-experimental.png
diff --git a/docs/assets/examples/local-geojson.png b/docs/assets/examples/local-geojson.png
diff --git a/docs/assets/examples/local-ideographs.png b/docs/assets/examples/local-ideographs.png
diff --git a/docs/assets/examples/locate-user.png b/docs/assets/examples/locate-user.png
diff --git a/docs/assets/examples/map-tiles.png b/docs/assets/examples/map-tiles.png
diff --git a/docs/assets/examples/mapbox-gl-draw.png b/docs/assets/examples/mapbox-gl-draw.png
diff --git a/docs/assets/examples/mapbox-gl-rtl-text.png b/docs/assets/examples/mapbox-gl-rtl-text.png
diff --git a/docs/assets/examples/measure.png b/docs/assets/examples/measure.png
diff --git a/docs/assets/examples/mouse-position.png b/docs/assets/examples/mouse-position.png
diff --git a/docs/assets/examples/multiple-geometries.png b/docs/assets/examples/multiple-geometries.png
diff --git a/docs/assets/examples/navigation.png b/docs/assets/examples/navigation.png
diff --git a/docs/assets/examples/offset-vanishing-point-with-padding.png b/docs/assets/examples/offset-vanishing-point-with-padding.png
diff --git a/docs/assets/examples/pmtiles.png b/docs/assets/examples/pmtiles.png
diff --git a/docs/assets/examples/polygon-popup-on-click.png b/docs/assets/examples/polygon-popup-on-click.png
diff --git a/docs/assets/examples/popup-on-click.png b/docs/assets/examples/popup-on-click.png
diff --git a/docs/assets/examples/popup-on-hover.png b/docs/assets/examples/popup-on-hover.png
diff --git a/docs/assets/examples/popup.png b/docs/assets/examples/popup.png
diff --git a/docs/assets/examples/queryrenderedfeatures.png b/docs/assets/examples/queryrenderedfeatures.png
diff --git a/docs/assets/examples/render-world-copies.png b/docs/assets/examples/render-world-copies.png
diff --git a/docs/assets/examples/restrict-bounds.png b/docs/assets/examples/restrict-bounds.png
diff --git a/docs/assets/examples/satellite-map.png b/docs/assets/examples/satellite-map.png
diff --git a/docs/assets/examples/scroll-fly-to.png b/docs/assets/examples/scroll-fly-to.png
diff --git a/docs/assets/examples/set-perspective.png b/docs/assets/examples/set-perspective.png
diff --git a/docs/assets/examples/set-popup.png b/docs/assets/examples/set-popup.png
diff --git a/docs/assets/examples/simple-map.png b/docs/assets/examples/simple-map.png
diff --git a/docs/assets/examples/third-party.png b/docs/assets/examples/third-party.png
diff --git a/docs/assets/examples/timeline-animation.png b/docs/assets/examples/timeline-animation.png
diff --git a/docs/assets/examples/toggle-deckgl-layer.png b/docs/assets/examples/toggle-deckgl-layer.png
diff --git a/docs/assets/examples/toggle-interaction-handlers.png b/docs/assets/examples/toggle-interaction-handlers.png
diff --git a/docs/assets/examples/variable-label-placement.png b/docs/assets/examples/variable-label-placement.png
diff --git a/docs/assets/examples/variable-offset-label-placement.png b/docs/assets/examples/variable-offset-label-placement.png
diff --git a/docs/assets/examples/vector-source.png b/docs/assets/examples/vector-source.png
diff --git a/docs/assets/examples/video-on-a-map.png b/docs/assets/examples/video-on-a-map.png
diff --git a/docs/assets/examples/visualize-population-density.png b/docs/assets/examples/visualize-population-density.png
diff --git a/docs/assets/examples/wms.png b/docs/assets/examples/wms.png
diff --git a/docs/assets/examples/zoomto-linestring.png b/docs/assets/examples/zoomto-linestring.png