简体   繁体   English

为什么 Qt Webassembly 应用程序启动时间过长?

[英]Why does Qt Webassembly app start too long?

I am checking the examples (QtQuickControls 2.0) with QT Webassembly (6.3), and it takes too long to load the app in webbrowser over LAN, especially on smartphones compared to the laptop.我正在使用 QT Webassembly (6.3) 检查示例 (QtQuickControls 2.0),通过 LAN 将应用程序加载到网络浏览器中需要很长时间,尤其是在智能手机上与笔记本电脑相比。 Too slow is around 40 seconds.太慢了大约 40 秒。 Most of the time as I can see on the screen it is "Compiling".正如我在屏幕上看到的那样,大多数时候它是“正在编译”。

  1. What is "compiling" in this case?在这种情况下,什么是“编译”? I thought webassembly code is already compiled and just needs to be run.我认为 webassembly 代码已经编译,只需要运行。
  2. Is QT Webassembly app always slow like this? QT Webassembly 应用程序总是这样慢吗? Is there any means to make it load faster?有什么办法让它加载得更快吗? At least load for the first time, then run it from cache, as now it spends the same much time to reload the app if page is refreshed.至少第一次加载,然后从缓存中运行它,因为现在如果页面被刷新,它会花费同样多的时间来重新加载应用程序。

I have checked the Felgo demo apps (I hope they are pretty much polished), but on my smartphone it takes around 20-30 seconds to load for the heavy example.我已经检查了 Felgo 演示应用程序(我希望它们非常完善),但在我的智能手机上,加载重型示例大约需要 20-30 秒。 https://felgo.com/try-wasm/ https://felgo.com/try-wasm/

The "Compiling" in this case refers to the WebAssembly.compile() that the qtloader.js internally calls.本例中的“编译”指的是 qtloader.js 内部调用的WebAssembly.compile() This basically loads the WASM binary code into the web page.这基本上将 WASM 二进制代码加载到网页中。

According to the comments in qtloader.js default template, the "Compiling" is displayed when a fallback is used.根据qtloader.js默认模板中的注释,使用回退时会显示“正在编译”。 Normally it should say "Downloading/Compiling" which is the faster method.通常它应该说“下载/编译”,这是更快的方法。

  return WebAssembly.compileStreaming(response).catch(function(error) {
      // compileStreaming may/will fail if the server does not set the correct
      // mime type (application/wasm) for the wasm file. Fall back to fetch,
      // then compile in this case.
      return fetchThenCompileWasm(response);
  });

So check if the mime type is set correctly as the comment suggests.因此,请检查是否按照评论建议正确设置了 mime 类型。

The second option to improve performance is to enable gzip compression in your web server settings.提高性能的第二个选项是在您的 Web 服务器设置中启用 gzip 压缩。 The WASM files compress quite well, in my test for example a 13 MB file was compressed to 5 MB. WASM 文件压缩得很好,例如在我的测试中,一个 13 MB 的文件被压缩到了 5 MB。 This will make the otherwise quite large download a bit faster.这将使原本相当大的下载速度更快一些。

But even after all the optimizations, the Qt for WASM must still download and load a full Qt GUI framework and this will take time.但即使经过所有优化,Qt for WASM 仍必须下载并加载完整的 Qt GUI 框架,这需要时间。 On my Android phone, a smaller WASM GUI will load in about 3 to 4 seconds on local network but this very much depends how powerful the device is (I tested withCDP Browser WASM GUI which is basically a QTreeView showing some data).在我的 Android 手机上,较小的 WASM GUI 将在大约 3 到 4 秒内加载到本地网络上,但这在很大程度上取决于设备的强大程度(我使用CDP Browser WASM GUI 进行了测试,它基本上是一个显示一些数据的 QTreeView)。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM