서버 연산이 오래걸리는 것과는 별개로 2만개면 브라우저에서도 표현하는데 시간이 꽤나 걸릴 듯 합니다.
실제로 제가 작업하는 컴퓨터가 느린편은 아닌데
가장 단순한 아래 코드만해도 화면에 표출하는데만 10초가 넘어가네요.
for (var i = 0; i < 20000; i++) {
var marker = new daum.maps.Marker({
position: markerPosition
});
marker.setMap(map);
}
렌더링 시간은 마커의 절대적인 량에 비례하므로
빠른 렌더링을 원하신다면 마커를 많이 찍지 않는 방법 밖에는 없습니다.
비단 지도의 마커뿐만이 아니라
기본적인 DOM 노드만 해도 2만개를 한 번에 추가하는 것은
브라우저 입장에서는 overhead가 큰 작업이기 때문입니다.
하물며 마커 하나에 포함되는 DOM Elelement는 최소 4개 이상이고 각각은 CSS 스타일도 가지고 있기 때문에 추가/삭제/갱신 시, 느려지는건 당연한 현상입니다.
서버단에서 클러스터링을 하여 내려받은 데이터로
화면에 그려지는 마커를 묶음으로 표현하는 방식으로 마커 수를 줄이거나
공간정보 쿼리를 날려서 화면 좌표 영역상에 포함된 마커들만 그리는 방식으로 처리를 해야 어느정도 완화가 가능하리라 봅니다.