通过JSON使用50k标记的Mapbox性能

Question

所以我目前正在使用Mapbox JS api加载50k标记并使用传单将它们聚类。

有两个问题;

首先，JSON文件现在是8mb

其次，一旦加载了JSON文件，整个浏览器在处理它时会冻结。

有没有办法以这两种方式优化这个？

示例数据点：

[{"type":"Feature","geometry":{"type":"Point","coordinates":    ["-0.012336","51.531011"]},"properties":{"user_id":"15","title":Username"}}]

代码：

var map = L.mapbox.map('map')
.setView([{{ $viewSettings['lat'] }},{{ $viewSettings['lng'] }}], {{ $viewSettings['zoom'] }})
.addLayer(L.mapbox.tileLayer('frasergillespie.llpnfb5a'));


$.getJSON('/mapLocations.json',function(geoJsonData){


var markers = L.markerClusterGroup({
    iconCreateFunction: function (cluster) {
        return new L.DivIcon({
            iconSize: [40,40],
            html: cluster.getChildCount(),
            className: 'cluster-icon'
        });
    },
    polygonOptions: {
        fillColor: '#fff',
        color: '#3cff91',
        weight: 1,
        opacity: 1,
        fillOpacity: 0.2
      }
});


var geoJsonLayer = L.geoJson(geoJsonData, {
    onEachFeature: function (feature, layer) {
        layer.bindPopup(feature.properties.title);
        layer.setIcon(L.icon({!! json_encode(Config::get('mapbox.iconJson')) !!}));
    }
});

markers.addLayer(geoJsonLayer);
map.addLayer(markers);
});