GoogleMapsAPI v3でマーカーにSVGのパスを指定するとクソ重い件

StackOverFlowのこの記事が参考になりました。
Optimizing SVG markers in Google Maps

但し記事の通りだとIE11では不具合が出るのでBase64に変換するとよいです。
↑関係ありませんでした。こちらを参考にしました。

SVG data URI in IMG tag isn't showing on IE11

(追記:2019/12/19)
こちらの記事が原因を大変詳しく解説されています。参考になります。
Google Maps でマーカーが多いと重くなるときの対処方法

解決方法

Before

const houseIcon = 'M19,9.3V4h-3v2.6L12,3L2,12h3v8h5v-6h4v6h5v-8h3L19,9.3z M10,10c0-1.1,0.9-2,2-2s2,0.9,2,2H10z'

const marker = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(0, 0),
    icon: {
        fillColor: '#FFFFFF',
        path: houseIcon,
    },
})

After

const houseIcon = 'M19,9.3V4h-3v2.6L12,3L2,12h3v8h5v-6h4v6h5v-8h3L19,9.3z M10,10c0-1.1,0.9-2,2-2s2,0.9,2,2H10z'

const svgToBase64DataURL = (size, color, path) => {
        const svg = `<svg width="${size}px" height="${size}px" viewBox="0 0 ${size} ${size}" xmlns="http://www.w3.org/2000/svg" version="1.1"><path d="${path}" fill="${color}"/></svg>`
        return {url: `data:image/svg+xml,${encodeURIComponent(svg)}`, scaledSize: new google.maps.Size(size, size)}
}

const marker = new google.maps.Marker({
    map: map,
    optimized: false,
    position: new google.maps.LatLng(0, 0),
    icon: svgToBase64DataURL(22, '#F00', houseIcon)
})

Data URLとして渡してあげればよい。

まとめ

パスを直接指定すると500個くらいでカクカクになりますが、DataURLで渡すと1万件でも大丈夫そうです。