Réponse courte

Choisissez Leaflet lorsque votre carte est constituée de tuiles raster plus un nombre gérable de marqueurs, polygones ou popups, et que vous voulez la bibliothèque la plus petite, la plus simple et la plus riche en extensions. Choisissez MapLibre GL JS lorsque vous avez besoin de tuiles vectorielles, de rendu GPU (WebGL), de style piloté par les données à partir d'une spécification de style JSON, de rotation et d'inclinaison fluides, ou de terrain 3D. Les facteurs décisifs sont votre stratégie de tuiles (raster vs vectorielle), le volume de données, et la nécessité ou non de modifier dynamiquement le style dans le navigateur — pas une préférence de marque. Pour des jeux de données dépassant ce que les tuiles vectorielles gèrent confortablement (millions d'entités, couches animées), ajoutez deck.gl par-dessus MapLibre.

Ce qu'est réellement chaque bibliothèque

Leaflet est une bibliothèque d'environ 40 Ko gzip qui place des tuiles raster (PNG/JPEG 256×256, ou parfois des rendus vectoriels rasterisés) dans une carte glissante en utilisant le DOM et Canvas. Marqueurs, vecteurs et popups sont des éléments DOM/SVG/Canvas. Ses forces sont une empreinte minuscule, une API réputée stable, et un énorme écosystème d'extensions (regroupement, cartes de chaleur, outils de dessin, WMS, géocodage). Son modèle suppose que le serveur a déjà décidé de l'apparence de la carte (les tuiles sont des images pré-rendues).

MapLibre GL JS (le fork open-source de Mapbox GL JS v1, sous licence BSD) est un moteur de rendu WebGL qui consomme des tuiles vectorielles (Mapbox Vector Tiles, .pbf) et un document de style — une spécification JSON décrivant sources, couches et propriétés de peinture/disposition. C'est le client qui décide de l'apparence de la carte, au moment du dessin, sur le GPU. Cette seule différence architecturale détermine tout ce qui suit.

Là où MapLibre l'emporte nettement

  • Tuiles vectorielles et style côté client. Avec les MVT, vous livrez la géométrie une fois et la restylez dans le navigateur. Changez une couleur de remplissage, filtrez par attribut, ou interpolez la taille des symboles selon le zoom sans re-rendre les tuiles. Les expressions pilotées par les données sont de première classe : 
    map.setPaintProperty('faults', 'line-color', [
  'match', ['get', 'type'],
  'normal', '#e66', 'thrust', '#39c', /* par défaut */ '#999'
]);
  • Performance avec des données vectorielles denses. WebGL dessine des milliers de polygones/lignes par image bien plus fluidement que Canvas/SVG. Les étiquettes et symboles nets restent nets à n'importe quel zoom car ils sont rendus, et non pré-cuits en pixels.
  • Rotation, inclinaison et terrain 3D. MapLibre prend en charge nativement l'orientation, l'inclinaison, une couche de ciel, l'exagération de terrain à partir d'une source raster MNT, et les couches d'ombrage — utiles pour le travail géologique et de terrain. Leaflet est fondamentalement une carte 2D plate, orientée nord.
  • Tout dépend du zoom. Taille des symboles, largeur des lignes, densité des étiquettes et couleur peuvent tous s'interpoler à travers les niveaux de zoom via des expressions, offrant une véritable cartographie multi-échelle à partir d'un seul fichier de style.
  • Globe et fluidité à fort zoom. Le zoom continu (pas seulement les niveaux entiers) et les transitions fluides sont intégrés.

Là où Leaflet l'emporte nettement

  • Données uniquement raster. Si vous superposez des couches WMS, des cartes numérisées ou des tuiles raster pré-rendues, Leaflet le fait avec un minimum de code et sans dépendance au GPU.
  • Empreinte la plus petite et modèle mental le plus simple. Pour une carte avec un fond de carte et quelques centaines de marqueurs, Leaflet, c'est moins de code et moins à apprendre.
  • Écosystème d'extensions. Deux décennies d'extensions couvrent des besoins de niche (projections spécialisées via Proj4Leaflet, outils de dessin, comparaison côte à côte, regroupement avancé) que vous devriez sinon développer à la main.
  • Environnements sans WebGL. Anciens appareils, embarcations restrictives, ou contextes où WebGL est indisponible affichent toujours Leaflet correctement.
  • SCR personnalisé / hors Web Mercator. Leaflet prend en charge plus facilement des SCR arbitraires (y compris les grilles polaires et locales) ; MapLibre est conçu autour des tuiles Web Mercator (EPSG:3857).

Décision détaillée : une carte web géologique

Supposez que vous deviez publier la géologie du socle (grand jeu de données polygonal), les failles cartographiées et un ombrage pour une région, avec un filtrage interactif par type de roche.

  1. La stratégie de tuiles d'abord. La couche polygonale est volumineuse et vous voulez que les utilisateurs basculent/filtrent les types de roche et restylent dans le navigateur — cela plaide pour des tuiles vectorielles, donc MapLibre. Générez des MVT avec tippecanoe à partir de GeoJSON, ou servez-les dynamiquement depuis PostGIS via ST_AsMVT.
  2. Ombrage. Servez l'ombrage dérivé du MNT sous forme de tuiles raster (une source raster) et, si vous voulez de la 3D, ajoutez le MNT comme source raster-dem avec setTerrain.
  3. Style. Encodez les couleurs de types de roche et la symbologie des failles en expressions pilotées par les données dans le style JSON, de sorte qu'une bascule de légende ne soit qu'un appel setFilter — sans aller-retour serveur.
  4. Si c'était plus simple — par exemple un seul raster géologique statique plus une douzaine de marqueurs de sites d'échantillonnage — Leaflet serait le choix le plus léger et le plus rapide à livrer.

Le point de bifurcation est l'étape 1 : dès que vous avez besoin d'un style/filtrage côté navigateur de données vectorielles denses ou d'un terrain 3D, MapLibre est le bon outil ; en deçà, la simplicité de Leaflet est payante.

Où s'intègre deck.gl

Aucune des deux bibliothèques n'est conçue pour des millions d'entités, des flux animés ou de grands nuages de points 3D. deck.gl est un moteur de couches WebGL/WebGPU précisément pour cela — ScatterplotLayer, ArcLayer, TripsLayer, PointCloudLayer, gros GeoJSON. Il s'imbrique avec MapLibre : MapLibre possède le fond de carte et les couches vectorielles ordinaires ; deck.gl possède la lourde couche personnalisée, partageant la même caméra pour rester calés. Vous pouvez aussi utiliser deck.gl avec Leaflet via un wrapper, mais l'association avec MapLibre est la voie mature car tous deux partagent le modèle de caméra de Mapbox GL.

Pièges courants et leurs causes

  • Choisir la bibliothèque avant la stratégie de tuiles. Que vos données soient des tuiles raster ou vectorielles décide presque tout. Les équipes qui choisissent une bibliothèque d'abord finissent souvent par lutter contre elle (p. ex. greffer des tuiles vectorielles sur Leaflet via des extensions et obtenir de mauvaises performances).
  • Forcer des projections personnalisées dans MapLibre. Comme MapLibre suppose des tuiles Web Mercator, un projet polaire ou en grille nationale peut être bien plus facile dans Leaflet avec un SCR personnalisé.
  • Utiliser MapLibre pour une carte triviale. La configuration WebGL, la spécification de style et le pipeline de tuiles sont une surcharge dont vous n'avez pas besoin pour quelques marqueurs sur un fond de carte raster.
  • Lancer un énorme GeoJSON sur l'une ou l'autre bibliothèque. Toutes deux s'étranglent sur un GeoJSON de plusieurs mégaoctets chargé côté client. Tuilez-le (tuiles vectorielles) ou déplacez-le vers deck.gl ; ne l'analysez pas en entier dans le fil principal.

Assurance qualité et validation

  • Testez en charge avec un volume de données réaliste et sur un appareil de milieu de gamme, pas seulement sur votre poste de travail et un petit échantillon.
  • Vérifiez que le SCR du fond de carte (Web Mercator pour MapLibre) correspond à vos tuiles de superposition, et que les coordonnées sont en lon/lat (EPSG:4326) avant le tuilage.
  • Confirmez que les attributs des tuiles vectorielles survivent au tuilage (tippecanoe peut supprimer attributs/entités aux faibles zooms s'il n'est pas configuré).
  • Vérifiez la lisibilité des étiquettes, le test de clic/survol et le comportement de légende/filtre dans la plage de zoom que les utilisateurs emploieront réellement.

Le point de vue de Bathyl

Nous choisissons la bibliothèque de rendu en partant du modèle de données : tuiles vectorielles plus style côté navigateur et tout terrain 3D pointent vers MapLibre, tandis que des superpositions raster et un jeu léger de marqueurs conviennent parfaitement à Leaflet, et les couches très volumineuses ou animées passent à deck.gl par-dessus MapLibre. La bibliothèque est la dernière décision, pas la première — la stratégie de tuiles et le volume de données la déterminent.

À lire aussi

Sources