How to build vector tiles from scratch
Векторные тайлы с нуля
Карта NYC Chaos Dashboard росла, и GeoJSON внутри HTML уже 4,5 МБ (770 мс отдаётся Cloudflare). Chrome жалуется на 2-секундный рендер.
Причины:
- JSON парсится в браузере.
- MapLibre GL JS сама раскладывает точки/линии.
Простой способ — грузить GeoJSON отдельно:
map.addSource('resurfacing', {
type: 'geojson',
data: '/data/resurfacing.geojson'
});
Но это всё ещё JSON. Крупные сервисы используют векторные тайлы (MVT): маленькие квадраты, каждый со своим зумом и областью.
Вместо одного файла — набор тайлов, как у Google Maps.