CN115525850A - 提升Web端下载加载模型速度及离线加载的方法 - Google Patents

Abstract

本发明公开了一种提升Web端下载加载模型速度及离线加载的方法，本发明使用了自研引擎系统，通过Emscripten编译工具，编译成WebAssembly语言，使得引擎系统具有了跨平台的能力，也可以根据想要效果自定义封装实现不同的渲染效果，更加灵活、方便、可控。针对大模型加载也是建立在对编译过程，下载过程以及加载过程中的优化基础上来实现的，加载大体量的模型可以控制在秒级加载，并且对已加载的模型及引擎文件进行了缓存处理实现了真正的离线加载功能。

Description

提升Web端下载加载模型速度及离线加载的方法

技术领域

本发明涉及计算机技术领域，尤其涉及一种提升Web端下载加载模型速度及离线加载的方法。

背景技术

随着互联网的发展，网页端需要展示的内容和形式也越来越多，网页端系统需要展示实时渲染的实景建模，由于实景建模的细节程度比较高，精度面数都比较大，所以导致所要加载的模型就比较大。系统是网页端，需要联网进行模型的下载以及加载，此时就需要对系统加载大体量模型的能力做出更高的要求。

发明内容

提供本发明内容是为了以简化的形式介绍将在以下详细描述中进一步描述的一些概念。本发明内容不旨在确定所要求保护的主题的关键或重要特征，也不旨在用作确定所要求保护的主题的范围的辅助手段。

为了实现提升智能康复系统Web端下载加载大体量模型速度及离线加载，本发明提出了如下技术方案：

一种提升Web端下载加载模型速度及离线加载的方法，其包括以下步骤：

获取待加载的源文件，在源文件上编写多线程加载模型的功能并将实现逻辑封装成接口；

通过WebAssembly开源编译器工具把源文件编译成wasm文件和中间层代码文件，将封装接口编译成多线程下载接口，供浏览器调用；

下载wasm文件及版本信息，根据制定的缓存机制和版本管理进行下载并缓存到浏览器的indexeddb数据库；

通过获取的wasm文件的缓存数据，进行异步实例化操作；

在wasm文件被实例化之后，通过调用多线程下载接口，对模型资源文件进行多线程加载调度。

在本发明的实施例中，通过打开源文件部署在服务器中映射的公网地址，获取源文件。

在本发明的实施例中，所述WebAssembly开源编译器工具采用Emscripten编译工具，所述源文件采用C++语言，在编译源文件的步骤中，还包括将C++语言通过Emscripten编译工具中WebIDL接口绑定的操作进行接口开放，供浏览器调用。

在本发明的实施例中，在编译源文件的步骤中，还包括使用python语言对中间层代码文件进行IO操作，对中间层代码文件xxx.cpp和xxx.js分别注入符合Emscripten编译转换规则的代码片段来实现多语言接口的类型转换。

在本发明的实施例中，在编译源文件的步骤中，还包括在C++语言中设置Emscripten编译的宏定义，将功能进行区分隔离，实现在Emscripten编译中自定义的开发和关闭相应功能，减少wasm文件大小。

在本发明的实施例中，下载wasm文件的步骤中，制定的缓存机制和版本管理包括：对首次加载的wasm文件进行全部缓存至浏览器的indexeddb数据库中并记录版本信息，在首次加载后的每一次加载wasm文件之前，先进行版本信息的比对，仅下载和缓存有更新部分的wasm文件并记录更新的版本信息。

在本发明的实施例中，所述方法还包括模型拆分步骤，将需要加载的模型资源文件按照指定规则进行拆分和节点命名，将各个节点按照自定义顺序进行转换压缩成各个模型压缩包，供浏览器调用。

在本发明的实施例中，所述方法还包括：对多线程加载的模型资源文件根据制定的模型调度逻辑进行调度加载卸载来进行模型的显示；

所述模型调度逻辑包括：

对不同距离下的模型压缩包进行高中低模型资源的分配，越近的距离加载越高精度的模型资源，越远的距离加载越低精度的模型资源；和/或

对距离镜头设定距离外的体积小于设定范围的物体进行剔除，不予以加载。

在本发明的实施例中，对wasm文件的加载使用异步实例化操作进行加载。

在本发明的实施例中，所述WebAssembly开源编译器工具采用Cheerp编译工具或Emscripten编译工具。

由于采用上述技术方案，使得本发明取得的有益效果是：

为了实现实时渲染精细化建模，本发明使用了自研引擎系统，通过Emscripten编译工具，编译成WebAssembly语言，使得引擎系统具有了跨平台的能力，也可以根据想要效果自定义封装实现不同的渲染效果，更加灵活、方便、可控。针对大模型加载也是建立在对编译过程，下载过程以及加载过程中的优化基础上来实现的，加载大体量的模型可以控制在秒级加载，并且对已加载的模型及引擎文件进行了缓存处理实现了真正的离线加载功能。

附图说明

参考附图中示出的实施例更详细地解释了上述本发明的特征，其中相同的附图标记表示相同的元件，其中图1～3示出了本发明的实施例。

图1示出了根据本发明实施例的提升Web端下载加载模型速度及离线加载的系统示例框图。

图2示出了Emscripten编译工具的编译过程示意图。

图3示出了根据本发明实施例的提升Web端下载加载模型速度及离线加载的方法的示例流程图。

图4示出了根据本发明实施例的模型拆分过程的示例流程图。

具体实施方式

在本公开中具体描述了本技术的主题，以满足法定要求。然而，该描述并不旨在限制其范围。相反，所要求保护的主题可以以其他方式体现，以包括不同的步骤、步骤的组合、特征和/或特征的组合，类似于本公开中结合其他当前或未来技术描述的那些。此外，尽管术语“步骤”和“框”可用于标识所采用的方法的不同元素，但是这些术语不应被解释为暗示各种步骤或框之间的任何特定顺序，除非明确描述和要求各个步骤或框的顺序。

网页端系统需要展示实时渲染的实景建模，由于实景建模的细节程度比较高，精度面数都比较大，所以导致所要加载的模型就比较大。系统是网页端需要联网进行模型的下载以及加载，此时就需要对系统加载大体量模型的能力做出更高的要求。

本发明就是为了解决这样的问题，而对模型的下载加载在编程语言上，语言编译上，以及模型的加载策略上进行了优化。使得加载大体量的模型也可以控制在秒级加载。

为了实现实时渲染精细化建模，使用了自研引擎(即本发明系统)，通过Emscripten编译工具，编译成WebAssembly语言，使得引擎具有了跨平台的能力，也可以根据想要效果自定义封装实现不同的渲染效果，更加灵活、方便、可控。针对大模型加载也是建立在对编译过程，下载过程以及加载过程中的优化基础上来实现的并且对已加载的模型及引擎文件(即wasm文件)进行了缓存处理实现了真正的离线加载功能。

WebAssembly是由主流浏览器厂商组成的W3C社区团体制定的一个新的规范，是一种能浏览器端运行C/C++、比JavaScript运行效率更快的一种技术。WebAssembly起源于Mozilla发起的Asm.js项目，其本地解码速度比JavaScript解析快得多，让高性能的Web应用在浏览器上运行成为可能，目前各大主流浏览器都支持WebAssembly二进制格式wasm文件。

另外，目前大部分Web端使用的引擎进行模型加载的基本上都是使用three.js引擎来实现的。为了实现提速大部分的做法都是从模型本身入手，包括：

1.模型减少面数处理，使得模型大小变小。

2.使用gltf数据格式，使得模型数据量变小，并且three.js对这种数据格式解析速度比较快。

3.提升网络带宽和网速，使用CDN通过中心平台的负载均衡、内容分发、调度等功能模块，使用户就近获取所需内容，降低网络拥塞，提高用户访问响应速度和命中率。

对于使用WebAssembly语言来进行Web端加载大体量模型的加载提速方案中，多数都是对模型本身进行的优化处理。而本发明是对模型的下载加载在编程语言上，语言编译上，以及模型的加载策略上都进行了优化，能够使得加载大体量的模型控制在秒级加载，与现有技术不同。

因此，本发明的实施例涉及一种智能康复系统加载大模型的提速方案，具体公开了一种提升系统Web端下载加载模型速度及离线加载的系统。具体地，参阅图1所示，该系统包括编译模块11、编译配置模块12、wasm文件加载及缓存模块13、模型多线程加载模块14，优选的，有时还可包括模型拆分模块15和模型缓存模块16。

编译模块11的作用是，用于通过WebAssembly开源编译器工具把源文件编译成wasm文件和中间层代码文件，供浏览器调用。

编译配置模块12的作用是，用于对编译模块进行功能自定义配置，决定wasm文件大小。

wasm文件加载及缓存模块13的作用是，用于加载wasm文件及版本信息，通过浏览器的indexeddb数据库进行本地缓存，并制定对应的缓存机制和版本管理。

模型多线程加载模块14的作用是，用于在源文件上编写多线程加载模型的功能并将实现逻辑封装成接口通过编译模块11进行编译成多线程下载接口，供浏览器调用相应的接口，对模型资源文件进行多线程加载调度。

模型拆分模块15的作用是，用于将需要加载的模型资源文件按照指定规则进行拆分和节点命名，将各个节点按照自定义顺序进行转换压缩成各个模型压缩包。

模型缓存模块16的作用是，用于对首次加载的模型资源文件进行缓存到浏览器的indexeddb数据库中并记录版本信息，在首次加载后的每一次加载模型资源文件之前，先进行版本信息的比对，仅下载和缓存有更新部分的模型资源文件并记录更新的版本信息。

进一步的，WebAssembly开源编译器工具可以采用Emscripten编译工具，有时也可以采用Cheerp编译工具。

Emscripten是一个面向JavaScript的开源LLVM编译器。(LLVM是构架编译器的框架系统，以C++编写而成，用于优化以任意程序语言编写的程序的编译时间<compile-time>、链接时间<link-time>、运行时间<run-time>以及空闲时间<idle-time>，对开发者保持开放，并兼容已有脚本)。

Emscripten的特点是使本地代码在Web上立即可用：这是一个标准化的平台，拥有许多兼容且独立的实现，可以运行在PC或者ipad等任何地方。实际上，任何可移植的C或者C++代码库都可以使用Emscripten编译成JavaScript，包括需要渲染图形、播放声音、加载和处理文件的高性能游戏，以及Qt之类的应用程序框架。Emscripten已经被用于将非常多的本地代码库转化为JavaScript，包括大型项目如CPython，Poppler和Bullet PhysicsEngine，以及商业项目如Unreal Engine 4和Unity Engine。

图2示出的是Emscripten工具链的高级视图。这里面最主要的工具是Emscripten前端编译器<Emscripten Compiler Frontend(emcc)>。这是对标准编译器(如gcc)的一个完全替代。

Emcc使用Clang或者LLVM来将代码编译为wasm或者asm.js。Emscripten编译得到的JavaScript代码可以运行编译后的代码并提供必要的运行时支持。这样的JavaScript代码可以被node.js执行或者在浏览器中从HTML执行。

Emscripten SDK(emsdk)用来管理多个SDK和工具，并制定当前用于编译的特定工具的SDK(活动工具/SDK)。它甚至可以从GitHub"安装"(下载并构建)最新的工具链。

Emsdk将“活动”配置写入Emscripten编译器配置文件中(.emscripten)。这个文件被emcc用来获得对于当前编译来说，用于构建的正确的工具链。

还有许多其他工具没有展示——例如：emcc可以选择性使用Java来运行闭包编译器，这可以进一步减小代码大小。

整个工具链由Emscripten SDK提供，并且可以被用于Linux，Windows或者macOS平台。

Cheerp编译工具是一种将C++语言转化编译成WebAssembly语言的一种编译工具链合集，专门用于将基于C/C++语言编写的原生应用平滑地跨平台移植到Web浏览器上运行的WebAssembly/Asm.js应用开发工具包。使用Cheerp与Emscripten不同之处在于以下几点：

1.Cheerp无需直接生成用于运行应用的HTML文件，因此我们可以自定义编写HTML页面，来将编译生成的Wasm模块与JavaScript“胶水”脚本文件整合在一起。

2.Emscripten的定位是可以在不修改或少量修改源代码的情况下，将原有的C/C++应用直接转译到Web平台上来运行；而Cheerp则完全自定义了一套新的规则体系，专门用于使用C/C++语言来编写Web应用，这样可以将一些接口的封装工作前置到C++端，带来的好处就是这样可以减轻前端使用人员的接口封装的压力，可以更关注业务逻辑。

3.Cheerp并不是基于MIT协议开源的，如果要将其用于商业用途，则需要购买Cheerp的商用所有权证书，商业虽然会增加一定的成本但是后期维护性会比较好，会持续有商业团队进行后期的维护升级。

下面的实施例为使用Emscripten编译工具，进行其他语言转换成浏览器可以识别读取运行的WebAssembly语言，其中对于函数接口的开放转换过程是关键点，编译工具仅支持基础类型无缝转换，但是对于通过其他语言特有的类型需要进行转化的能力比较弱。所以在类型转换接口开放上做了特殊的处理，编译模块11对编译工具中的中间层代码文件进行了文本的IO打补丁的操作，在编译工具的接口开放的规则下自定义又对预要开放的接口进行了封装，使得其他语言和WebAssembly语言可以进行无缝的接口转换。具体的实现手段如下：

引擎系统的源文件使用的是C++语言，由于C++语言高效并且有丰富的开源库可以接入这样开发效率是可以大幅提升的(引擎的语言选择上也可以使用Java语言)。

使用Emscripten编译工具，将C++开发的引擎通过编译工具中WebIDL接口绑定的方案进行接口开放，供前端的业务开发人员使用。由于WebIDL接口绑定仅支持C++和javascript语言的基本类型的转换，自研引擎C++端自己写的封装类型无法进行转换，此处为了实现多语言的类型转换，本方案通过查看编译工具编译过程中产生的中间层代码文件包括xxx.cpp和xxx.js，再结合Emscripten编译工具的实现机制，使用python语言对中间层代码文件进行IO操作，对中间层代码文件xxx.cpp和xxx.js分别注入符合Emscripten编译转换规则的代码片段来实现，多语言接口的类型转换。例如：自研引擎C++会有Vector<Vector<T>>，Vector中嵌套Vector的类型，这种在类型绑定中就没办法进行绑定转换，所以使用Emscripten工具链提供的WeblDL-Binder脚本来生成对应的“胶水”脚本文件，然后对对应xxx.cpp中涉及到Vector<Vector<T>>参数的方法中进行js语言部分的类型转换，然后再对xxx.js中涉及到Vector<Vector<T>>参数的部分进行C++语言部分的调用转换。

进一步的，对于使用WebAssembly语言来进行Web端加载大体量模型的加载提速方案中，多数都是对模型本身进行的优化处理，但是为了把各种资源大小和缓存做到极致的话，都忽略了引擎编译成WebAssembly语言后的wasm文件，因为加载模型的前提是先要加载wasm文件使得有加载以及后面处理模型效果渲染的能力。所以对wasm文件大小的缩减以及缓存也是十分重要的，在wasm文件大小方面进行了对引擎功能的配置化优化，可以通过编译配置模块12中进行设置来决定编译的引擎中是否包含例如：物理引擎，高级渲染效果等一些资源较大的功能；其次对于wasm文件也是可以进行首次加载后进行缓存的，将其缓存到浏览器的indexeddb数据库中进行本地缓存。具体的实现手段如下：

对wasm文件做了优化，即在自研引擎C++代码中会设置一些Emscripten编译的宏定义，将一些大块的功能进行区分隔离，可以在编译配置模块12中进行设置，这样编译模块11再通过Emscripten编译的时候可以选择性的开发一些功能和关闭不需要的功能，从而进一步减少wasm文件大小。

众所周知，Web平台对于本地数据的读取是有很大限制的，处于浏览器的同源策略以及保护用户数据的限制，浏览器基本是无法做到直接读取本地数据文件的。所以即使是对模型进行了优化，优化了网络环境的情况下还是每次打开网页系统时都需要每次进行模型数据的下载这也是对用户体验上大打折扣的，针对这个问题。本方案首先对引擎下载后进行了wasm文件的缓存，其次对后面模型资源文件的下载后也进行了模型数据的缓存，可通过模型缓存模块16实现，均通过目前最新的浏览器大文件缓存技术indexeddb(浏览器本地数据库存储方式)数据库缓存，并指定了对应的缓存机制和版本管理，即：对首次加载的wasm文件进行全部缓存至浏览器的indexeddb数据库中并记录版本信息，在首次加载后的每一次加载wasm文件之前，先进行版本信息的比对，仅下载和缓存有更新部分的wasm文件并记录更新的版本信息。

进一步的，由于wasm文件下载和加载会占用浏览器的渲染线程，这样在加载的过程中浏览器的UI渲染是被阻塞的，针对这点问题，本方案对wasm文件的加载使用了WebAssembly.instantiate(compiled，imports)(浏览器异步实例化wasm文件的方法)方法进行加载，此方法为异步方法，这样可以避免于浏览器的渲染线程阻塞，不会造成UI卡顿。

进一步的，针对模型的优化，本方案制定了模型进行细致的拆分和加载规则，由模型拆分模块15实现，会将模型在建模阶段让建模工程师按照拆分规则进行建模，规则大致为场景的地面植被，楼宇外立面，楼宇内部智能康复港，智能康复港相关设备，智能康复港附属的灯光等细节模型。并且模型的下载顺序制定也是按照这样的顺序，这样排序的是因为地面植被比较小会快速的被下载完成并加载出来使得用户可以快速的得到反馈，其次的拆分的模型都是相对比较大的，可以按照顺序以此的下载加载，这样以来会让用户能打开网页可以尽快的看到加载效果，来提升用户的体验感。此处本方案结合自身模型情况制定了细致的拆分和加载规则。

具体的，需要加载的模型资源文件按照制定规则进行拆分，在建模阶段建模工程师就是按照开发制定的节点命名规则进行节点命名的，例如：如图4所示，Ground节点下是地面相关的模型，Building节点下是建筑物，Equipment节点下是设备，Other是一些附属物件。方案中会提供给建模开发工具，将节点按照自定义顺序进行转换压缩成Mode1...2...3...4...5等模型压缩包，还可以对模型资源文件中使用到的图片资源进行压缩处理，打包成的模型资源文件也进行了LZ4压缩格式的处理，此步骤是模型拆分准备阶段。

针对模型进行了拆分优化后，整体模型被拆分除了四五个小的模型压缩文件，如果是一个一个的去下载的话又是比较耗时的，所以本方案结合Emscripten编译工具对语言转成WebAssembly语言带的编译成多线程模式，此处本方案是直接在引擎编程语言C++上来编写多线程加载模型的功能并将实现逻辑封装成接口通过编译工具进行编译成多线程版本，省去了使用浏览器的work(在浏览器web端，原生代码中需要实现多线程的代名词)多线程进行编程，使得前端使用引擎的开发人员省去了编写多线程逻辑的烦恼，同时也是使得拆分后的模型资源可以进行多线程下载和加载，最大程度的利用电脑的多核资源。

具体的，应用到多线程部分的说明：自研引擎C++端会对模型加载部分以及模型调度方案进行多线程代码编写，并提供开放接口给前端业务开发人员使用，此处需要使用到Emscripten编程多线程命令-sUSE_PTHREADS＝1(编译工具的编译功能命令行命令，用于编译多线程版本)，编译出的wasm文件运行到浏览器中运行系统后即可实现多线程调度模型，无需在web端写work多线程代码了。

应用到模型调度逻辑的说明：模型进行了拆分压缩后，自研引擎C++代码部分做了模型调度，一种情况下，本方案使用了LOD(根据距离模型的远近程度，自动的切换加载高中低精度模型的一项技术)技术对不同距离下的模型进行高中低模型资源的分配，通过越近的距离加载越高精度的模型资源，越远的距离加载越低精度的模型资源。另一种情况下，本方案通过LOD技术的技术理念自己实现了一套对模型加载调度的方案，在镜头可视范围内的模型进行显示加载，范围外的模型在3s后进行卸载操作，并对距离镜头300m外的体积小于设定范围的物体进行剔除，不予以加载(其中，3s和300m都可以根据实际情况自定义配置和更改)。再一种情况下，本方案同时采用了对不同距离下的模型压缩包进行高中低模型资源的分配，越近的距离加载越高精度的模型资源，越远的距离加载越低精度的模型资源；以及，对距离镜头设定距离外的体积小于设定范围的物体进行剔除，不予以加载。进一步的，通过Emscripten编译后进行使得wasm文件具备了多线程调度模型的能力。在wasm文件下载加载实例化之后对模型进行按顺序的多线程下载并加载。程序运行起来后，模型加载出来后，会执行模型调度逻辑。

具体来说，LOD的技术是针对不同距离加载不同精度的模型，本发明采用的是对于设定距离外并且体积小于设定体积的物体模型直接去除，不进行加载操作，举例如下：当进入场景时，镜头被设定在距离场景150m处，镜头角度是俯视45度正好看到场景全貌状态，此时场景内部的智能设备是可以被加载出来的，设备附属的小物体例如：鼠标键盘等是不会被加载的，随着鼠标滚轮拉近镜头到设备50m内的距离，附属小物体鼠标键盘同时被加载出来。对于附属小物体被剔除的规则是通过建模提供建模后自己设定的，将镜头拉至到多远距离后想让场景中具体多大的设备剔除，设定一个基准。同时这边还可以结合LOD技术来做出更加的方案，举例如下：当进入场景时，镜头被设定在距离场景150m处，镜头角度是俯视45度正好看到场景全貌状态，此时场景内部的智能设备是可以被加载出来的，设备附属的小物体例如：鼠标键盘等是不会被加载的，并且此时康复设备由于距离镜头较远，加载的也是对应精细度较低的模型，随着鼠标滚轮拉近镜头到设备50m内的距离，会将设备换成精细程度高的模型，并且附属小物体鼠标键盘同时被加载出来。对于附属小物体被剔除的规则是通过建模提供建模后自己设定的，将镜头拉至到多远距离后想让场景中具体多大的设备剔除，设定一个基准。

配合图3所示，本发明实施例提供的一种提升Web端下载加载模型速度及离线加载的方法，通过上述引擎系统实现以下步骤：

S1、获取待加载的源文件，具体的，可以通过打开自研引擎文件和模型资源文件部署在服务器中映射的公网地址来获取源文件。

S2、通过下载wasm文件(自研引擎通过编译工具编译成的浏览器可运行的二进制程序文件)及版本信息，进行版本信息的比对工作，如果版本号大于本地版本号就进行下载并将下载完成的wasm文件进行缓存到浏览器的indexeddb数据库，进行本地缓存，如果等于(或小于)本地版本号则从indexeddb数据库缓存中获取wasm文件。

S3、使用下载后的wasm文件的buffer(缓存)数据进行异步实例化，此处使用WebAssembly.instantiate(compiled,imports)方法来实现异步实例化，异步操作能使得浏览器的渲染线程不被阻塞，UI会流畅，提升用户的体验。

S4、在wasm文件被实例化之后，就会自动运行启动引擎了，此时前端业务人员会先去从服务端获取需要加载模型资源文件进行与本地缓存的模型版本信息进行比对，如果版本号大于本地版本号就进行调用多线程下载接口进行下载并将下载完成的模型文件进行缓存到indexeddb，如果等于(或小于)本地版本号则从indexeddb数据库缓存中获取模型资源文件。

S5、多线程下载完成的模型就会通过自研引擎的模型调度逻辑进行调度加载卸载来进行模型的显示了。模型调度逻辑包括：借鉴了LOD技术的思想，对不同距离下的模型压缩包进行高中低模型资源的分配，越近的距离加载越高精度的模型资源，越远的距离加载越低精度的模型资源；借鉴了LOD技术的思想对距离镜头设定距离外的体积小于设定范围的物体进行剔除，不予以加载。

S6、至此本方案对于C++引擎转化编译成WebAssembly语言在Web平台实现下载加载模型得提速方案以及离线加载模型得方案就结束了。

进一步地，在S1步骤之前细化部分说明：

对于网络环境也做了常规的处理，使用CDN通过中心平台的负载均衡、内容分发、调度等功能模块，使用户就近获取所需内容，降低网络拥塞，提高用户访问响应速度和命中率。同时也会对电脑的硬件配置进行相应的升级处理使得CPU的处理能力得到加强，这样对模型得加载和卸载调度过程会更加得顺畅。

进一步地，在S2步骤上细化部分说明：

S2.1、自研引擎使用的是C++语言，由于C++语言高效并且有丰富的开源库可以接入这样开发效率是可以大幅提升的(引擎的语言选择上也可以是Java语言)。如图2所示使用Emscripten编译工具，将C++开发的引擎通过编译工具中WebIDL接口绑定的方案进行接口开放，供前端的业务开发人员使用。由于WebIDL接口绑定仅支持C++和javascript语言的基本类型的转换，自研引擎C++端自己写的封装类型无法进行转换，此处为了实现多语言的类型转换，本方案通过查看编译工具编译过程中产生的中间层文件包括xxx.cpp和xxx.js，再结合Emscripten编译工具的实现机制，使用python语言对中间层文件进行IO操作，对中间层文件xxx.cpp和xxx.js分别注入符合Emscripten编译转换规则的代码片段来实现，多语言接口的类型转换。例如：自研引擎C++会有Vector<Vector<T>>,Vector中嵌套Vector的类型，这种在类型绑定中就没办法进行绑定转换，所以使用Emscripten工具链提供的WeblDL-Binder脚本来生成对应的“胶水”脚本文件，然后对对应xxx.cpp中涉及到Vector<Vector<T>>参数的方法中进行js语言部分的类型转换，然后再对xxx.js中涉及到Vector<Vector<T>>参数的部分进行C++语言部分的调用转换。

S2.2、本方案对wasm文件也是做了优化，即在自研引擎C++代码中会设置一些Emscripten编译的宏定义，将一些大块的功能进行区分隔离，这样再通过Emscripten编译的时候可以选择性的开发一些功能和关闭不需要的功能，从而进一步减少wasm文件大小。

进一步的，在S4步骤上细化部分说明：

具体需要加载的模型资源文件按照制定规则进行拆分，在建模阶段建模工程师就是按照开发制定的节点命名规则进行节点命名的，例如：如图4所示，Ground节点下是地面相关的模型，Building节点下是建筑物，Equipment节点下是设备，Other是一些附属物件。方案中会提供给建模开发工具，将节点按照自定义顺序进行转换压缩成Mode1...2...3...4...5等模型压缩包，也对模型资源进行了使用到得图片资源进行压缩处理，打包成得模型资源也进行了LZ4压缩格式得处理，此步骤是模型拆分准备阶段。

进一步的，在S5步骤上细化部分说明：

应用到多线程部分的说明：自研引擎C++端会对模型加载部分以及模型调度方案进行多线程代码编写，并提供开放接口给前端业务开发人员使用，此处需要使用到Emscripten编程多线程命令-sUSE_PTHREADS＝1，编译出的wasm文件运行到浏览器中运行系统后即可实现多线程调度模型，无需在web端写work多线程代码了。

应用到模型调度逻辑的说明：模型进行了拆分压缩后，自研引擎C++代码部分做了模型调度，本方案使用了LOD技术对不同距离下的模型进行高中低模型资源的分配，通过越近的距离加载越高精度的模型资源，越远的距离加载越低精度的模型资源，并通过LOD技术的技术理念实现了一套对模型加载调度的方案，在镜头可视范围内的模型进行显示加载，范围外的模型在3s后进行卸载操作，并对距离镜头300m外的体积小于设定范围的物体进行剔除，不予以加载(其中3s和300m可根据实际情况自定义配置和更改)。通过Emscripten编译后进行使得wasm具备了多线程调度模型的能力。在wasm下载加载实例化之后对模型进行按顺序的多线程下载并加载。程序运行起来后，模型加载出来后，会执行模型调度逻辑。

进一步的，在S2.1的步骤上还有一种替代方案就是使用Cheerp编译工具(将C++语言转化编译成WebAssembly语言的一种编译工具链合集)，专门用于将基于C/C++语言编写的原生应用平滑地跨平台移植到Web浏览器上运行的WebAssembly/Asm.js应用开发工具包。

使用Cheerp与Emscripten不同之处在于以下几点：

1.Cheerp无需直接生成用于运行应用的HTML文件，因此我们可以自定义编写HTML页面，来将编译生成的Wasm模块与JavaScript“胶水”脚本文件整合在一起。

2.Emscripten的定位是可以在不修改或少量修改源代码的情况下，将原有的C/C++应用直接转译到Web平台上来运行；而Cheerp则完全自定义了一套新的规则体系，专门用于使用C/C++语言来编写Web应用，这样可以将一些接口的封装工作前置到C++端，带来的好处就是这样可以减轻前端使用人员的接口封装的压力，可以更关注业务逻辑。

3.Cheerp并不是基于MIT协议开源的，如果要将其用于商业用途，则需要购买Cheerp的商用所有权证书，商业虽然会增加一定的成本但是后期维护性会比较好，会持续有商业团队进行后期的维护升级。

本发明可以在计算机代码或机器可用指令的一般上下文中描述，包括由计算机或其他机器(例如个人数据助理或另一手持设备)执行的计算机可执行指令，例如程序模块。通常，程序模块包括例程、程序、对象、部件、数据结构等，指执行特定任务或实现特定抽象数据类型的代码。本发明可以在各种系统配置中实施，包括手持设备、消费电子产品、通用计算机、更专业的计算设备等。本发明也可以在分布式计算环境中实施，其中任务由通过通信网络链接的远程处理设备执行。

与现有技术相比，采用本发明提升Web端下载加载模型速度及离线加载的系统和方法，具有以下有益效果：

详见下表所示，通过本方案的优化后，对于模型大小在三四百兆，网速在4兆左右每秒的，电脑配置为750TI，i5处理器，内存16G的环境下实现了首次下载并加载出现模型的时间控制在10～12s左右，首次之后的加载控制在6～8s左右。

未使用本方案时，相同环境和相同模型大小的情况下，首次下载并加载出现模型的时间基本在90～100s左右。

首次下载并加载速度上提升了10倍左右。

在智能医疗系统中，无论是建筑楼宇还是智能康复设备对模型的精细化要求都比较高，所以模型都比较大，针对这种使用情况使用本方案就尤为的合适，更能对模型的提速加载有明显的效果，大大提高了用户的体验感和满意度。配合本方案的模型调度方案，理论上是可以加载无限体量的模型，因为实现了动态的对模型的加载和卸载的调度方案。

以上段落中描述的实施例可以与一个或多个具体描述的替代方案相结合。特别地，所要求保护的实施例可以包含对多于一个其他实施例的引用。所要求保护的实施例可以指定所要求保护的主题的进一步限制。

在不脱离本发明的范围的情况下，可以对本发明的图示实施例进行许多变化。这种修改在本发明的范围内。本文呈现的实施例已经结合特定实施例进行了描述，这些实施例在所有方面都是说明性的而不是限制性的。替代实施例和修改对于本领域普通技术人员来说是显而易见的，但是不会脱离本发明的范围。

从上述内容可以看出，本发明很好地适用于实现上述所有目的和目标，以及其它明显的和该结构固有的优点。应当理解，某些特征和子组合是有用的，并且可以在不参考其他特征和子组合的情况下使用。这是在本发明的范围内。

在前面的详细描述中，参考了构成说明书一部分的附图，其中相同的附图标记始终表示相同的部件，并且其中通过图示的方式示出了可以实施的实施例。应当理解，在不脱离本公开的范围的情况下，可以利用其他实施例，并且可以进行结构或逻辑改变。因此，前面的详细描述不是限制性的，实施例的范围由所附权利要求及其等同物限定。

已经使用本领域技术人员通常使用的术语描述了说明性实施例的各个方面，以向本领域其他技术人员传达其工作的实质。然而，对于本领域的技术人员来说，显然可以仅利用所描述的一些方面来实施替代实施例。出于解释的目的，阐述了具体的数字、材料和配置，以便提供对说明性实施例的透彻理解。然而，对于本领域技术人员来说，显然可以在没有具体细节的情况下实施替代实施例。在其他情况下，为了不模糊说明性实施例，省略或简化了众所周知的特征。

以最有助于理解说明性实施例的方式，将各种操作描述为多个分离的操作；然而，描述的顺序不应被解释为暗示这些操作必然是顺序相关的。特别是，这些操作不需要按照呈现的顺序来执行。此外，将操作描述为单独的操作不应被解释为要求这些操作必须独立地和/或由单独的实体来执行。将实体和/或模块描述为单独的模块同样不应被解释为要求模块是单独的和/或执行单独的操作。在各种实施例中，图示和/或描述的操作、实体、数据和/或模块可以被合并、分解成更多的子部分和/或被省略。

短语“在一个实施例中”或“在实施例中”被重复使用。该短语通常不是指同一实施例；然而，它也可能是指同一实施例。术语“包括”、“具有”和“包含”是同义的，除非上下文另有规定。短语“A/B”是指“A或B”。短语“A和/或B”是指“(A)、(B)或(A和B)。”短语“A、B和C中的至少一个”是指“(A)、(B)、(C)、(A和B)、(A和C)、(B和C)或(A、B和C)。”。

Claims (10)

1.提升Web端下载加载模型速度及离线加载的方法，其特征在于，包括以下步骤：

获取待加载的源文件，在源文件上编写多线程加载模型的功能并将实现逻辑封装成接口；

通过WebAssembly开源编译器工具把源文件编译成wasm文件和中间层代码文件，将封装接口编译成多线程下载接口，供浏览器调用；

下载wasm文件及版本信息，根据制定的缓存机制和版本管理进行下载并缓存到浏览器的indexeddb数据库；

通过获取的wasm文件的缓存数据，进行异步实例化操作；

在wasm文件被实例化之后，通过调用多线程下载接口，对模型资源文件进行多线程加载调度。

2.根据权利要求1所述的提升Web端下载加载模型速度及离线加载的方法，其特征在于，通过打开源文件部署在服务器中映射的公网地址，获取源文件。

3.根据权利要求1所述的提升Web端下载加载模型速度及离线加载的方法，其特征在于，所述WebAssembly开源编译器工具采用Emscripten编译工具，所述源文件采用C++语言，在编译源文件的步骤中，还包括将C++语言通过Emscripten编译工具中WebIDL接口绑定的操作进行接口开放，供浏览器调用。

4.根据权利要求3所述的提升Web端下载加载模型速度及离线加载的方法，其特征在于，在编译源文件的步骤中，还包括使用python语言对中间层代码文件进行IO操作，对中间层代码文件xxx.cpp和xxx.js分别注入符合Emscripten编译转换规则的代码片段来实现多语言接口的类型转换。

5.根据权利要求3所述的提升Web端下载加载模型速度及离线加载的方法，其特征在于，在编译源文件的步骤中，还包括在C++语言中设置Emscripten编译的宏定义，将功能进行区分隔离，实现在Emscripten编译中自定义的开发和关闭相应功能，减少wasm文件大小。

6.根据权利要求1所述的提升Web端下载加载模型速度及离线加载的方法，其特征在于，下载wasm文件的步骤中，制定的缓存机制和版本管理包括：对首次加载的wasm文件进行全部缓存至浏览器的indexeddb数据库中并记录版本信息，在首次加载后的每一次加载wasm文件之前，先进行版本信息的比对，仅下载和缓存有更新部分的wasm文件并记录更新的版本信息。

7.根据权利要求1所述的提升Web端下载加载模型速度及离线加载的方法，其特征在于，所述方法还包括模型拆分步骤，将需要加载的模型资源文件按照指定规则进行拆分和节点命名，将各个节点按照自定义顺序进行转换压缩成各个模型压缩包，供浏览器调用。

8.根据权利要求1所述的提升Web端下载加载模型速度及离线加载的方法，其特征在于，所述方法还包括：对多线程加载的模型资源文件根据制定的模型调度逻辑进行调度加载卸载来进行模型的显示；

所述模型调度逻辑包括：

对不同距离下的模型压缩包进行高中低模型资源的分配，越近的距离加载越高精度的模型资源，越远的距离加载越低精度的模型资源；和/或

对距离镜头设定距离外的体积小于设定范围的物体进行剔除，不予以加载。

9.根据权利要求1所述的提升Web端下载加载模型速度及离线加载的方法，其特征在于，对wasm文件的加载使用异步实例化操作进行加载。

10.根据权利要求1所述的提升Web端下载加载模型速度及离线加载的方法，其特征在于，所述WebAssembly开源编译器工具采用Cheerp编译工具或Emscripten编译工具。

Images