如何减小Plotly.js库体积？移动端落地页3D散点图优化问询

针对你只需要3D散点图的场景，完全不用加载整个3MB的Plotly.js库，这里有几个实用的解决方案：

1. 使用Plotly官方的模块化CDN构建 #

Plotly其实早就支持按需加载核心模块+所需的trace/渲染器组件，只是入口比较隐蔽。你可以直接使用针对3D散点图优化的CDN链接，只包含核心功能+scatter3d trace+gl3d渲染器，体积能压缩到几百KB（大概500KB左右，比全库小了近80%）。

具体的CDN链接格式是：

https://cdn.plot.ly/plotly-[核心模块]+[trace类型]+[渲染器].min.js

对应你的需求，直接用这个链接即可：

https://cdn.plot.ly/plotly-core+scatter3d+gl3d.min.js

这个版本只保留了运行3D散点图必需的代码，完全能满足你的落地页需求。

2. 本地自定义构建（适合需要更精细控制的场景） #

如果你想完全掌控依赖内容，也可以自己从源码构建最小化版本：

• 首先通过npm安装plotly.js：npm install plotly.js
• 然后使用Plotly提供的构建脚本，指定你需要的组件：

  npm run build -- --components core,scatter3d,gl3d
  

  构建完成后，你会在dist目录下得到一个体积极小的自定义Plotly.js文件，直接部署到你的项目中即可。

3. 额外优化建议 #

• 开启CDN的gzip压缩：大多数主流CDN（包括Plotly的官方CDN）默认支持gzip，开启后实际传输体积还能再减少30%-50%，移动端加载速度会更快。
• 延迟加载：如果3D散点图不是页面首屏内容，可以等页面加载完成后再动态加载Plotly脚本，避免阻塞首屏渲染。

补充：你提到的那个已关闭的特性请求，其实Plotly后来已经实现了模块化支持，只是没有在下载页面显眼展示，上面的两种方法就是基于这个特性实现的。

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