【问题标题】：Qooxdoo application's build size optimisationQooxdoo 应用程序的构建大小优化
【发布时间】：2015-03-29 19:01:03
【问题描述】：

我想对 qooxdoo 生成的文件进行一些大小优化。 800Ko 是相当庞大的...关于信息，它是基于桌面方法的。

我正在使用这个配置：

"OPTIMIZE"      : ["basecalls", "comments", "privates", "strings", "variables", "variants", "whitespace"]

没有成功...

有什么想法吗？

【问题讨论】：

使用 qooxdoo，您只有两个可部署文件（不是图片）：index.html 和 script.js。如果您的 script.js 为 800K，我会说您的应用程序非常大。
如果没有完整的配置文件，很难说为什么优化对你不起作用。查看创建的 script.js。如果它看起来不像完全乱码，则说明没有应用优化。
OTOH，我的经验是，真正适合 qooxdoo 桌面应用程序开发模型的 qpooxdoo 应用程序通常会增长到超过 2MB，因为您添加了更多的小部件和 qooxdoo 类，然后随着您慢慢增长添加特定于应用程序的类。
如果您觉得 800K 很大，请做一个实验。考虑以更传统的方式编写 html 模板、CSS 和 JS，使用 jQuery、jQueryUI、jQuery 插件、backbone、require 等。然后将所有尺寸加起来。如果你真的为你使用的所有 qooxdoo 组件包含等效项，我会感到惊讶，如果结果会更小。

标签： optimization build qooxdoo

【解决方案1】：

客户端优化

这是最简单的方法。在您的网络服务器中设置 gzip 压缩。它将使您的构建文件约为 200-300 kB。您甚至可以预压缩您的构建并直接提供app.js.gz。

然后设置您的网络服务器缓存。方法是配置合理的缓存过期时间，例如一周或一个月。对于更积极的缓存，过期设置为永久（年），并且您的构建 URL 看起来像 /static/app.js?v=123。您可以使用简单的递增数字、VCS 修订版或文件哈希。

部分构建

更难但更灵活的方法是use parts 并将其与上述客户端优化相结合。这样，您可以以按需加载其组件的方式构建您的应用程序，而无需预先加载所有内容。然而，这需要更改您的应用程序，使其更加模块化且耦合度更低，但这通常是件好事。

在您的config.json 中，您需要定义部分，即通常对应于不同功能的应用程序组件。我通常会像这样扩展common 的工作：

"common" :
{            
  "packages" :
  {
    "sizes" : 
    {
      "min-package"          : 64,
      "min-package-unshared" : 16
    },
    "additional-merge-constraints" : true,
    "parts" :
    {
      "boot" :
      {
        "include" : ["${QXTHEME}", "${APPLICATION}.Application"]
      },
      "functionality1" :
      {
        "include" : ["${APPLICATION}.controller.Functionality1"] 
      },
      "functionality2" :
      {
        "include" : ["${APPLICATION}.controller.Functionality2"] 
      },
      ...
    }
  }
}

此处的引导部分包含引导应用程序所需的最小 Qooxdoo 依赖项。请注意，您的引导部分不太可能小于 500 kB（未压缩）。

然后当你想使用某些功能时：

qx.io.PartLoader.require(['functionality1'], function()
{
  new (qx.Class.getByName('app.controller.Functionality1')).doSomething();
}, this);

请注意，部件加载器会为您解析依赖关系，因为部件 functionality1 可能有其依赖关系。事实上，上面定义的 3 个部分的部分构建可能会导致结果中的文件少于或多于 3 个。生成器使用复杂的依赖管理，因此如果有利于负载性能，它可以拆分和折叠部分。

【讨论】：

【解决方案2】：

您使用的优化配置是默认配置。因此，当您运行 ./generate.py build 时，您应该已经获得了优化的构建。查看build/script/{myNamespace}.js。脚本的第一部分（可以说是管理或加载代码）未优化，但框架代码和您的应用程序代码已优化（最后一行很长，已缩小等）。

手册有更多细节：

【讨论】：