用 Three.js 撸了一个 3D 地球 + 全球实时电台，性能有点炸，求优化建议

[xingwangchan]

[点我直接玩] https://www.radiosphere.live/

这玩意是干啥的？

一个 3D 交互式地球，上面每一个绿点都是一个真实在线的网络广播电台（ Shoutcast / Icecast ）。
你旋转/缩放地球，随便点一个点，就能听到那个地区的广播——可能是音乐、新闻、甚至是半夜的脱口秀。

技术栈

• Three.js (r128) – 地球主体、标注点、光晕效果
• Web Audio API – 音频流播放、音量控制、跨域处理
• 自建数据层 – 爬取了全球约 8000+ 个公开电台，包含经纬度、流地址、国家等
• 前端框架 – Vue + Vite
• 坐标转换 – 地理坐标 (lat, lon) → 三维空间向量

目前遇到的坑（也是我想在 V2EX 求助的重点）

1. 性能
   地球上的标记点目前是 8000+ 个独立的 PointsMaterial，帧率在低端设备上会掉到 30 以下。
   试过用 BufferGeometry 合并，但动态光晕（播放中的电台要单独高亮）就不好做了。
   求教：有没有在“大量静态点 + 少数动态高亮点”场景下的最佳实践？

2. 音频流的 CORS & 混合内容
   很多电台流是 HTTP 的，我的网站是 HTTPS ，浏览器会 block 。
   目前用了一个公共 CORS 代理（https://cors-anywhere.herokuapp.com/），但不稳定而且慢。
   有没有更轻量的方案？或者自己搭一个简单的代理，成本大概多少？

3. 数据更新
   电台经常失效（流地址 404 或者超时），我是半手工检测 + 脚本定期跑。
   想知道有没有比较稳定的全球公开电台 API ？不想一直维护死链。

接下来想加的功能

• 用户自定义导入电台（粘贴流地址，自动推算经纬度）
• “随机漫游”模式：每 30 秒自动跳到另一个随机电台
• 录音片段分享（录 15 秒存成 WebM 并生成分享链接）

我需要你帮忙做的事

• 戳一下网站，看看在你设备上卡不卡（手机 / 老笔记本尤其需要反馈）
• 如果你知道 本地或小众地区的网络电台流地址，直接评论丢给我（国家 + 流地址），我批量加进去
• 对上面那几个技术坑有思路的直接留言，跪谢 🙏

最后说句心里话

这个项目不是为了赚钱，纯粹想做点炫酷的东西。
做出来之后自己每天都会随便点几个没听过的国家，感觉很奇妙。
如果你也觉得有意思，欢迎转发给朋友；如果发现 bug 或者卡顿，直接喷，我改。

➡️ https://www.radiosphere.live/

（网站目前没有广告，也没有用户系统，打开即用）

---

可选的“沙发”自问自答

问：为什么不用 Cesium ？
答：Cesium 太重了，Three.js 更可控，而且我想保持打包后不到 2MB （不含纹理）。

问：电台数据会不会涉及版权问题？
答：所有流地址都是电台自己公开的 Shoutcast 入口，我只是做了一个播放器外壳，类似浏览器。

---

[wktline]

AI 说：没法优化了-炸！

[burp2019]

不用优化，让用户觉得炫的同时有点卡，凸显项目的难度和你的牛逼

[0754]

好酷炫~~

[Tanf]

不错不错

[tianjiyao]

挺好玩，，只是为啥大陆没有亮的。。。闪烁的都是欧美的区域。。

[xingwangchan]

@wktline 哈哈，我已经用 AI 优化过一轮了。性能到瓶颈了才来找网友的

[xingwangchan]

@tianjiyao 国内管控比较严格，只有市以上的广播电视行政部门才有资格申请设立电台

[FstarKing]

真不错，挺有意思

[XTTX]

用中国地图容易被喷，实属无解。

[maybedk]

挺好玩的哈哈，不过好像有 bug 。好像是我点某个频道无数据的话，会随机跳到别的地方。

[qcbf111]

用 unity 导出 webgl,走 unity 的渲染管线应该性能会高很多

[Parva]

好有意思，随便点一个，听起了音乐。

[lmsh7]

牛逼的, 很棒的 idea

[qcbf111]

@qcbf111 目测了下任务管理器, 原因应该在 pso 管线状态切换,还有渲染元素剔除排序收集这个阶段

[IsaacYoung]

静态的实例化渲染

[aidevs]

不错，666

[logyxiao]

看起来挺炫的

[sn0wdr1am]

嘲讽客户硬件太渣，让他们升级内存，升级 CPU 。

[cst4you]

看着卡卡的, 以为渲染性能问题, 没想到是限帧率了

[lifei6671]

使用 WASM 技术应该可以吧。