When you pan across Google Maps, you’re not downloading one giant image. You’re downloading hundreds of small squares stitched together by your browser. Each square is a tile. The tile system is what makes maps feel fast.

The Tile Grid#

The world map is divided into a grid at each zoom level. At zoom 0, the entire world is one 256x256 pixel tile. At zoom 1, it splits into 4 tiles. At zoom 2, 16 tiles. At zoom N, the world is 4^N tiles.

Every tile has three coordinates: zoom level, X position, Y position. A URL like /tiles/14/9876/5432.png uniquely identifies one 256-pixel square at zoom 14. Most of North America at street level is zoom 14 or 15.

Tile count by zoom level:
Zoom 0:  1 tile    (entire world)
Zoom 10: ~1M tiles (city level)
Zoom 15: ~1B tiles (street level)

Pre-Generated and Cached#

Rendering a tile on demand from raw geographic data takes seconds. That’s too slow. At popular zoom levels, tiles are pre-rendered and stored on disk, then served from CDN edge nodes close to users.

A tile request is a pure read: the same tile URL always returns the same image until the underlying map data changes. Cache hit rates are very high because popular city tiles get requested millions of times per day.

graph TD A[User Requests Tile z/x/y] --> B[CDN Edge Node] B --> C{Cache Hit?} C -->|Yes| D[Return Cached Tile] C -->|No| E[Tile Server] E --> F[Render from Geographic Data] F --> G[Store in CDN Cache] G --> D style A fill:#000000,stroke:#00ff00,stroke-width:2px,color:#fff style B fill:#000000,stroke:#00ff00,stroke-width:2px,color:#fff style C fill:#000000,stroke:#00ff00,stroke-width:2px,color:#fff style D fill:#000000,stroke:#00ff00,stroke-width:2px,color:#fff style E fill:#000000,stroke:#00ff00,stroke-width:2px,color:#fff style F fill:#000000,stroke:#00ff00,stroke-width:2px,color:#fff style G fill:#000000,stroke:#00ff00,stroke-width:2px,color:#fff

Vector Tiles vs Raster Tiles#

Raster tiles are pre-rendered images. They’re fast to serve but fixed in style. You can’t change road color without regenerating billions of tiles.

Vector tiles send the raw geographic data (road coordinates, building outlines) and let the client render it. You change the map style by changing the rendering rules in the client. Satellite imagery stays raster (can’t be vectorized), but road maps increasingly use vector tiles for flexibility.

At Salesforce#

Map tiles weren’t our problem, but static report rendering was. We had reports that took 30 seconds to generate. Once we realized the same report with the same parameters always produces the same result, we stored rendered outputs keyed by report ID + parameter hash. First request pays the 30-second cost, everyone after gets it instantly. Cache hit rate on popular reports was over 80%. Same reasoning as pre-generated tiles: if the output is deterministic, compute it once and serve it forever.

What I’m Learning#

The tile coordinate system is a spatial index in disguise. Z/X/Y maps directly to a region on Earth, making tile lookups O(1). The real engineering is in cache hierarchy: what gets pre-generated, what gets rendered on demand, and how long each lives at the edge.

Have you worked with map tiles or similar tiled content systems?