Maps Platform: A Deep Dive on Building for Performance and Scale

on YouTube ↗30m

" summary

Explains concrete performance choices: custom overlays must avoid heavy work in draw() and defer add/remove until pans stop, targeting ~1–2ms draw overhead to keep 60fps; shows 1,000-marker demo where switching an SVG icon to a PNG removes seconds of lag; recommends use PNG/JPEG not SVG, marker clustering and Marker API over overlays, and demonstrates WebGL data visualization by integrating Deck.GL to render tens of thousands of points (earthquakes, NYC cabs) successfully.

AI-written summary · about

" chapters (24)

1. 0:00Introduction
2. 2:00Stability Reliability Performance
3. 2:30Industry Solutions
4. 3:00Performance at Scale
5. 4:00Custom Overlays
6. 5:00Draw Method
7. 6:00Draw Method Example
8. 9:00Draw Method Performance
9. 11:00Marker Code
10. 13:00Raster vs SVG
11. 14:00WebGL vs raster
12. 15:00Clustering content
13. 16:00Clustering options
14. 17:00Recap
15. 18:00DecGL
16. 19:00Tilt
17. 20:00Canvas
18. 22:00Geo JSON Layer
19. 23:00WebGL Demo
20. 24:00WebGL Action Item
21. 25:00Android Maps SDK
22. 27:00Future Releases
23. 28:00Migration Guide
24. 29:00Closing

" related talks

• 37mPainting with DataRichard Westenra · FrontCon 2019
• 37mVisualizing Large Datasets with JavaScript Using deck.glMarko Letic · RVA JavaScript Conf 2019
• 58mRendering performance from the ground upMartin Splitt · HolyJS 2017 Piter
• 40mVisualizing Large Datasets with JavaScript Using Deck.glMarko Letic · code.talks 2019
• 26mSVG, Canvas, and WebGL: The Power, the Beauty, and the CostAmber Hoak · CascadiaJS 2020
• 36mCanvas Pixel Transformation: Beauty comes slowlyVictor Lebrun · Conf42 JavaScript 2020
• 14mHigh Performance Data Visualisation with the M4 AlgorithmJacob Parker · Frontend Nation 2025
• 25mRendering Performance from the Ground UpMartin Splitt · ngVikings 2018