使用react-google-maps进行优化以进行标记

Question

我目前使用react-google-maps开发GoogleMap页面 我的代码如下

class GoogleMapBox extends React.Component{
    state = {
        center : this.props.center,
        places : []
    }

    mapMounted = ((ref) => {
        this.map = ref;
    })

    getPlaces = (() => {
        const center = this.map.getCenter();

        if(this.map.getZoom() >= 15){
            const bounds = this.map.getBounds();
            const minLatLng = bounds.getSouthWest();
            const maxLatLng = bounds.getNorthEast();

            ajaxCall(/*apiUrl*/, {
                /*param*/
                minLat : minLatLng.lat(),
                        minLng : minLatLng.lng(),
                        maxLat : maxLatLng.lat(),
                        maxLng : maxLatLng.lng(),
            })
            .then((result) => {
                this.setState({
                    center,
                    places : result.list
                })
            });

        } else {
            this.setState({
                center,
                places : []
            })
        }
    })

    render(){
        return (
            <GoogleMap
                ref={this.mapMounted}
                center={this.state.center}
                zoom={15}
                options={{
                    minZoom : 6,
                    maxZoom : 18
                }}

                onTilesLoaded={this.getPlaces}
            >

                <MarkerClusterer onClick={this.openMultiWindow}>
                    {this.state.places.map((i) => (
                        <Marker key={i.id} position={{ lat : i.lat, lng : i.lng}} onClick={this.openWindow}/>
                    ))}
                </MarkerClusterer>

            </GoogleMap>
        );
    }
}

但不幸的是，它非常缓慢，有时会停止.... 我认为的原因是api结果的结果数量 ajaxCall函数中的getPlaces返回100~2000行。

是的...如果ajax返回超过500行，它可能会很慢或停止 但我必须展示所有结果。

那我怎样才能优化这个课程呢？ 我真的不知道该怎么做......

这是样本结果..我每次都必须这样显示。
请帮我 ！！