后端一次传过来2000万条数据，前端如何处理
要可视化显示设备数据，但数据量非常大，一小时即可产生上百万条，传过来的JSON 文件更是高达几百兆。
尝试原生HTML、JS、ECharts
原生HTML、JS、ECharts 方法直接将JSON 文件引入渲染，但发现加载时间长达20 秒，并且浏览器会爆内存。
立即学习“前端免费学习笔记（深入）”；
优化建议
1. 策略优化
降低采样频率，减少数据量。 仅展示 30 秒甚至几分钟内的均值数据，用户放大时再返回 detalle 数据。
2. 优化传输格式
使用更具效率的数据传输格式，例如：
将long 保存时间戳，double 保存浮点值（2000 万条数据约为30MB）。 使用 float 和 int 提高精度，2000 万条数据约为 15MB。 利用 ArrayBuffer 和 DataView 对象提取数据。
3. 时间连续性优化
如果数据时间连续，则仅需要传输一个起始时间和时间间隔。 如果数据不连续，则使用时间间隔和一组起始时间和结束时间来表示。
4. 持续推送更新
使用 EventSource 进行持续推送更新。 数据格式采用 base64 编码，传输量为原来的 1.33 倍。
其他尝试方案
iframe：允许数据跨域传输，但可能会出现加载失败的情况。 流式处理：一次处理一部分数据，避免内存爆表。 流式传输：根据显示范围逐步拉取数据，类似地图瓦片渲染。
综合上述建议，可优化数据处理，提升可视化性能。
以上就是后端一次性推送2000万条设备数据，前端如何高效可视化？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1498272.html
微信扫一扫 
支付宝扫一扫 
