七个瓦片子域全配了，浏览器还是只开 6 个连接

现象

瓦片地址写成 https://t{s}.example.com/{z}/{x}/{y}.png， subdomains: '01234567'。 拖动地图时网络面板显示最多 6 个请求处于 Pending， 其余全部为灰色 Queueing，一排 40 多个请求要等前面完成。

首屏瓦片完整出现需要 3~4 秒，而不分子域时是 5~6 秒，改善有限。

原因

浏览器的并发限制是按域名计算的，HTTP/1.1 下每个域名 6 个连接。 子域确实能增加总连接数，但前提是这些子域解析到不同主机或至少被浏览器视为不同源。

如果 DNS 把 t0~t7 全部 CNAME 到同一个 IP， 且服务端用同一个 TLS 证书与连接池，浏览器仍按域名分别计数， 但实际排队发生在服务端，收益被吃掉。

更常见的情况是：配置里写了 subdomains，但 URL 模板里用的是 https://tile.example.com，根本没引用 {s}，等于没配。

排查过程

1. 看请求 URL 里是否真的出现了 t0、t3 这样的子域前缀。
2. 在网络面板按域名分组，看同时活跃的域名数量。
3. 查 DNS：nslookup t0.example.com 与 t1.example.com 是否解析到同一 IP。
4. 看响应头 server 与连接复用情况，确认是否 HTTP/2。

// 常见错误：URL 里没有 {s}
L.tileLayer('https://tile.example.com/{z}/{x}/{y}.png', {
  subdomains: '01234567'      // 配置了但未生效
});

// 正确：URL 中必须出现 {s}
L.tileLayer('https://t{s}.example.com/{z}/{x}/{y}.png', {
  subdomains: '01234567'
});

解决方案

HTTP/2 下每域名多路复用，子域带来的收益很小，优先启用 HTTP/2； 仍用 HTTP/1.1 时，确保多个子域解析到不同后端节点。

# Nginx：启用 HTTP/2 并给瓦片加长缓存
server {
  listen 443 ssl http2;
  server_name t0.example.com t1.example.com t2.example.com;

  location / {
    root /var/www/tiles;
    expires 30d;
    add_header Cache-Control "public, immutable";
  }
}

# DNS：不同子域指向不同节点，避免单机排队
t0.example.com  A  10.0.1.11
t1.example.com  A  10.0.1.12
t2.example.com  A  10.0.1.13

也可以减少请求数：把 tileSize 提到 512， 同样视野下瓦片数量降到四分之一。

L.tileLayer('https://t{s}.example.com/{z}/{x}/{y}.png', {
  subdomains: '0123',
  tileSize: 512,
  zoomOffset: -1,
  maxZoom: 18
}).addTo(map);

验证

网络面板中同时活跃的域名数大于 4，队列长度明显下降； 首屏瓦片全部完成的时间小于 2 秒。

const hosts = new Set([...performance.getEntriesByType('resource')]
  .map(e => new URL(e.name).host));
console.assert(hosts.size >= 4, '子域仍未生效');
console.assert(performance.getEntriesByType('resource')
  .filter(e => e.name.endsWith('.png'))
  .every(e => e.duration < 2000), '仍有慢请求');

适用版本