使用ThreeJs搭建BIM模型浏览器-第十步加载优化

最近在尝试了新的传输方式。不过对QModel而言，影响不是很大，因为QModel这个产品只有首次加载是需要从服务器下载模型数据的。

首先，把原本的模型文件拆分成多份了。原本只有一个zip数据压缩包，现在改为在服务端拆解为N份，根据构件数量每500个压缩为一个包，同时把数据转换为utf8array.然后生成一个索引文件A。

前端首先请求索引文件A。得到数据包的数量，然后进入本文重点。

主线程根据解析索引文件，知道了一共有N个数据包，然后开始启用worker下载。如下

主线程代码：

  var worker = new Worker("worker.js");worker.postMessage({m: 模型N}); //向worker发送数据worker.onmessage = function(evt) { //接收worker传过来的数据函数var resulti = JSON.parse(evt.data);//开始解析resulti}

然后创建一个worker.js，多线程进行传输并解压。

onmessage = function(evt) {JSZipUtils.getBinaryContent( "数据包N.zip", {callback: function(err, data) {var zipdata = new JSZip(data);var filei = zipdata.file("数据包N.json");postMessage(filei.asText());}});
}

实际效果如下图

总结：

1、由于个人服务器原因，带宽就那么大，一个线程跑满和10个线程同时下载，完全没有效率的差异。所以下载起来是一样的。需要硬件支持才体现出传输的优化。

2、数据解析放到线程里面，确实会提升一些效率。

3、下一步优化，可以考虑在worker里面直接把数据转换成Utf8Array或者ArrayBuffer，PostMessage是可以移交这一类对象的控制权的。

自研引擎产品试用，demo下载：

QModel-BIM模型浏览器

使用ThreeJs搭建BIM模型浏览器-第十步加载优化相关推荐

使用ThreeJs搭建BIM模型浏览器第六步纹理贴图（材质）
上效果图解决思路: Threejs上没啥好说的.看郭老师的博客:three.js纹理贴图_郭隆邦技术博客 Revit上如何导出呢,不好意思,这次真不能贴核心代码了.. 自研引擎产品试用,demo下载 ...
使用ThreeJs搭建BIM模型浏览器，超大模型的分时渲染
使用Threej搭建大场景,超大模型渲染的时候特别卡,渲染构件数量过多,顶点多,数据量大,一次性渲染耗时超长,FPS小,甚至掉到5以下.这种情况直接的体验是,无法操作! 那如何让它变成优先响应鼠标操作 ...
使用ThreeJs搭建BIM模型浏览器 QModel的诞生记
QModel模型浏览器展示页面:QModel链接入口,支持Revit文件上传,在Web端浏览,并集成与模型相关的业务. 首先关于笔者的介绍: 2010年机缘巧合进行建筑信息化行业,当时主要还是在做工程 ...
使用ThreeJs搭建BIM模型浏览器-CSS3D图层
CSS3D这种技术有些人叫它图层叠加,其实原理就是图层叠加.CSS3D的本质是在Canvas之上罩了一层透明的div,然后把原本的DOM元素通过CSS的变换实现了立体感. 用户期望的结果像这样: 如何 ...
浏览器输入baidu.com加载的过程是什么，听完我的回答和尚摇了摇头，就这？
下半年第一天,今天是七一建党节哦前言回答这个问题的时候是去年三月份,我入职不到三个月还没转正. 和尚是一个互联网大厂朋友的外号,初中那货剃了光头,后来便有了和尚这个亲切的外号. 去年那时候我两 ...
js如何使浏览器允许脚本异步加载
js如何使浏览器允许脚本异步加载如果脚本体积很大,下载和执行的时间就会很长,因此造成浏览器堵塞,用户会感觉到浏览器"卡死"了,没有任何响应.这显然是很不好的体验,所以浏览器允许脚 ...
Tensorflow【实战Google深度学习框架】TensorFlow模型的保存与恢复加载
我们使用TensorFlow进行模型的训练,训练好的模型需要保存,预测阶段我们需要将模型进行加载还原使用,这就涉及TensorFlow模型的保存与恢复加载. 总结一下Tensorflow常用的模型保存 ...
QQ浏览器劫持video标签加载自己的广告（怎么解决？）
QQ浏览器劫持video标签加载自己的广告(怎么解决?) QQ浏览器真的不讲一点规则,强制劫持视频video标签,这已经很 XX 了吧?还在视频结束时加载他们自己的广告,这... 就无语了. 相信开发 ...
实测：TB级倾斜摄影模型合并根节点前后加载效果对比，结果惊人
随着无人机性能快速提升,单个项目涉及到的倾斜摄影模型数据范围.数据量及单个模型体积也在不断变大,带来的问题是数据显示速度却越来越慢,那么如何在不升级配置的情况下提升模型的加载速度呢? TB级倾斜摄影模 ...

使用ThreeJs搭建BIM模型浏览器-第十步加载优化

使用ThreeJs搭建BIM模型浏览器-第十步加载优化相关推荐

最新文章

热门文章

使用ThreeJs搭建BIM模型浏览器-第十步 加载优化

使用ThreeJs搭建BIM模型浏览器-第十步 加载优化相关推荐

最新文章

热门文章

使用ThreeJs搭建BIM模型浏览器-第十步加载优化

使用ThreeJs搭建BIM模型浏览器-第十步加载优化相关推荐