如何加载sap.ui.comp.smarttable.SmartTable更快？

Question

在SAPUI5中，当您第一次向应用添加sap.m.DatePicker时，需要几秒钟才能加载所需文件并打开日期选择器。在他们解释的API中：

  

注意：仅当打开DatePicker（不用于初始渲染）时，才会在内部使用sap.ui.unified.Calendar。如果在打开DatePicker之前未加载sap.ui.unified库，则会在打开时加载它。这可能会导致第一次打开DatePicker时的等待时间。为了防止这种情况，使用DatePicker的应用程序也应该加载sap.ui.unified库。

所以这就是他们建议加快DatePicker加载的解决方案。

当我使用sap.ui.comp.smarttable.SmartTable时，用户第一次看到该应用时，至少需要10到15秒。

实际上它会加载大量个人JavaScript文件。这是加载的文件的一小部分。

现在的问题是，无论如何都要加快这种加载速度吗？

我在清单的dependencies中尝试了以下代码，但没有帮助。

"sap.ui.comp": {
    "minVersion": "1.52.1"
}

Answer 1

SmartTable是一个巨大的控件，它依赖于以下库：

• sap.ui.core
• sap.m
• sap.ui.comp
• sap.ui.table，again, depends on ..
• sap.ui.unified

这可以在模块的source code中看到：

  

sap.ui.comp.smarttable.SmartTable

sap.ui.define([
    'jquery.sap.global',
    'sap/m/VBoxRenderer',
    'sap/m/Column',
    // ...
    'sap/ui/comp/library',
    'sap/ui/comp/providers/TableProvider',
    'sap/ui/comp/smartfilterbar/FilterProvider',
    'sap/ui/comp/smartvariants/SmartVariantManagement',
    // ...
    'sap/ui/table/AnalyticalColumn',
    'sap/ui/table/AnalyticalTable',
    'sap/ui/table/Column',
    'sap/ui/table/Table',
    'sap/ui/table/TreeTable',
    // ...
], function(/*...*/) {/*...*/});

尝试异步预加载这些库，例如，

• 使用这些引导程序配置设置：

  // since 1.58.2
  data-sap-ui-libs="sap.ui.core, sap.m, sap.ui.comp, sap.ui.table, sap.ui.unified"
  data-sap-ui-async="true" // replaces preload="async" and xx-async="true"
  

  // for 1.58.1 and below
  data-sap-ui-libs="sap.ui.core, sap.m, sap.ui.comp, sap.ui.table, sap.ui.unified"
  data-sap-ui-preload="async"
  data-sap-ui-xx-async="true"
  

• 如果应用程序应该在FLP上运行（没有 index.html ），则在app descriptor中：

  "sap.ui5": {
    "dependencies": {
      "libs": {
        "sap.ui.core": {},
        "sap.m": {},
        "sap.ui.comp": {},
        "sap.ui.table": {},
        "sap.ui.unified": {}
      },
      ...
    },
    ...
  }
  

这应该加快表的速度，因为它的依赖关系不再需要按需加载和同步加载，这样可以避免冻结浏览器的UI线程。

注释

• 从v1.52 ^src 开始，preload="async"还包含预加载not the case until then的messagebundle*.properties个文件。

• 其他与效果相关的最佳做法可在主题Performance: Speed Up Your App中找到。