I exported some countries as a single .geojson file. The file includes every country's vertices and coordinates, as that's what a .geojson is ─ a vector file.
Thing is, there are about 20 countries and considering each of them are 100-120 sided polygons, it's not surprising that the file size is +100 MB.
Leaflet has a geojson class that performs a geojson overlay for points, polygons etc. that reads the vector file and displays it on the map.
Since I want to post this .geojson file on the web using Leaflet, making every user download 100 MB for this is out of the question. Apart from that, when I tested this Leaflet map on my computer using Chrome, it takes about 5 seconds each time I zoom in/out for the map to come to resolution (the map crashes for 5 seconds because the webpage becomes unresponsive due to this vector file workload). I suppose pulling 100 MB from the RAM each time somebody zooms would be hard for just about any computer.
Is there any way to create a .png file of each country instead and overlay that onto the Leaflet map? I suppose that would greatly reduce file size and dramatically improve map performance.
Best Answer
If you want to show your geometries as vectors instead of images there are a couple of tricks that you can apply to reduce the load of your page:
If you really want to go with raster/images/tiles take a look at TileMill.