如何在JavaScript中实现快速多边形合并？（解决Turf.js执行缓慢问题）

我完全懂你的痛点——浏览器端用Turf.js做大量多边形合并确实慢得让人抓狂，毕竟Shapely在后端的C级性能优化做得非常到位。不过不用慌，前端也有几种能大幅提速的方案，不需要依赖服务端：

1. 改用Turf的批量合并方法：turf.unaryUnion #

你之前用的turf.union(...features)其实是把所有要素逐个传入，但turf.union本身只支持两个要素的合并，当要素数量多的时候，会触发递归式的逐个合并，效率极低。而Turf专门提供了turf.unaryUnion方法，针对批量要素做了优化，能大幅减少计算时间：

import * as turf from '@turf/turf';

function fastUnion(geojson) {
  // 直接传入要素数组，内部会优化合并顺序
  return turf.unaryUnion(geojson.features);
}

这个方法不需要额外安装依赖，直接用现有Turf包就能实现，比你原来的写法快好几倍。

2. 先简化几何图形，再合并 #

如果你的GeoJSON顶点数量特别多，先对每个要素做简化，减少计算量后再合并，能进一步提升速度。可以用turf.simplify来做，调整tolerance参数平衡精度和速度：

import * as turf from '@turf/turf';

function unionWithSimplify(geojson, tolerance = 0.0001) {
  // 先简化每个要素的顶点（highQuality设为false能更快）
  const simplifiedFeatures = geojson.features.map(feature => 
    turf.simplify(feature, { tolerance, highQuality: false })
  );
  return turf.unaryUnion(simplifiedFeatures);
}

注意：这个方法会损失一定精度，适合对图形细节要求不高的场景。

3. 用WebAssembly版Shapely（性能接近Python原生） #

这是性能最优的方案——把Shapely编译成WebAssembly，在浏览器里直接运行和Python端一样的核心代码，速度几乎和你本地用Shapely一样快。可以用shapely-wasm这个包：

首先安装依赖：

npm install shapely-wasm

然后编写代码：

import { initShapely, Geometry } from 'shapely-wasm';

async function shapelyUnion(geojson) {
  // 初始化WebAssembly模块（只需执行一次）
  await initShapely();
  
  // 将每个GeoJSON几何转成Shapely对象
  const geometries = geojson.features.map(feature => 
    Geometry.fromGeoJSON(JSON.stringify(feature.geometry))
  );
  
  // 执行unary_union，和Python端逻辑完全一致
  const unionGeom = Geometry.unaryUnion(geometries);
  
  // 转回GeoJSON格式
  return JSON.parse(unionGeom.toGeoJSON());
}

这个方案的性能提升最明显，对于2.5MB的GeoJSON文件，应该能把时间压缩到几秒甚至更短，几乎和Python端持平。

额外优化小技巧 #

• 如果浏览器支持Web Worker，把合并操作放到Worker里执行，避免阻塞主线程，让页面保持响应。
• 可以把要素按面积从小到大排序后再合并，小要素先合并成大要素，能减少后续合并的计算量（turf.unaryUnion内部可能已经做了这个优化，但手动处理也能锦上添花）。

内容的提问来源于stack exchange，提问作者OMRY VOLK