为什么 SAPUI5 多次加载相似的片段？

Question

我有一个 XML 片段并在 XML 视图的多个地方使用它。

<IconTabFilter text="ABC" key="1" icon="sap-icon://alphabetical-order">
    <content>
        <Table id="table1" width="auto" items="{path:'/ContactSet',parameters:{expand:'BusinessAddress,HomeAddress,OtherAddress,Photo'},filters:[{path:'Surname',operator:'StartsWith',value1:'A'},{path:'Surname',operator:'StartsWith',value1:'B'},{path:'Surname',operator:'StartsWith',value1:'C'}]}" noDataText=" {worklistView>/tableNoDataText}" busyIndicatorDelay="{worklistView>/tableBusyDelay}" growing="true" growingScrollToLoad="true" updateFinished="onUpdateFinished">
            <headerToolbar>
                <core:Fragment fragmentName="de.cimt.cimply.AddressBook.view.worklist.tablesHeader" type="XML"/>
            </headerToolbar>
            <columns>
                <core:Fragment fragmentName="de.cimt.cimply.AddressBook.view.worklist.tablesColumns" type="XML"/>
            </columns>
            <items>
                <core:Fragment fragmentName="de.cimt.cimply.AddressBook.view.worklist.tablesRows" type="XML"/>
            </items>
        </Table>
    </content>
</IconTabFilter>
<IconTabSeparator icon="sap-icon://process"/>
<IconTabFilter text="DEF" key="2" icon="sap-icon://alphabetical-order">
    <content>
        <Table id="table2" width="auto" items="{path:'/ContactSet',parameters:{expand:'BusinessAddress,HomeAddress,OtherAddress,Photo'},filters:[{path:'Surname',operator:'StartsWith',value1:'D'},{path:'Surname',operator:'StartsWith',value1:'E'},{path:'Surname',operator:'StartsWith',value1:'F'}]}" noDataText="{worklistView>/tableNoDataText}" busyIndicatorDelay="{worklistView>/tableBusyDelay}" growing="true" growingScrollToLoad="true" updateFinished="onUpdateFinished">
            <headerToolbar>
                <core:Fragment fragmentName="de.cimt.cimply.AddressBook.view.worklist.tablesHeader" type="XML"/>
            </headerToolbar>
            <columns>
                <core:Fragment fragmentName="de.cimt.cimply.AddressBook.view.worklist.tablesColumns" type="XML"/>
            </columns>
            <items>
                <core:Fragment fragmentName="de.cimt.cimply.AddressBook.view.worklist.tablesRows" type="XML"/>
            </items>
        </Table>
    </content>
</IconTabFilter>

但是视图加载时间太长，尤其是在 WEBIDE 中。

原因是多次加载相似的片段文件。这是一个证据：

问题是如何提高性能？

我不想重复代码，我需要将那部分代码放在一个片段中，但我希望我的浏览器不会多次加载同一个文件。

Answer 1

如果您运行您的应用程序不在网络端测试环境中，则应从缓存中加载碎片。

但是，您可以将片段加载到控制器中并使用工厂函数代替模板。类似于：

查看：

<mvc:View controllerName="test.test.controller.View1" xmlns:mvc="sap.ui.core.mvc" xmlns:core="sap.ui.core" displayBlock="true" xmlns="sap.m">
<Shell id="shell">
    <App id="app">
        <pages>
            <Page id="page" title="{i18n>title}">
                <content>
                    <List  items="{ path: '/myList', factory: '.myListFactory' }"/>
                </content>
            </Page>
        </pages>
    </App>
</Shell>

在你的控制器中：

    onInit: function () {

        this.getView().setModel(new JSONModel({
            "myList" : [{
                "Name": "Test1"
            }, {
                "Name": "Test2"
            }]
        }));


    },

    myListFactory: function (sId) {
        if(!this._myListFragment){
            this._myListFragment = new sap.ui.xmlfragment("test.test.view.myListFragment", this);
        }
        return this._myListFragment.clone(sId);
    }

片段：

<core:FragmentDefinition xmlns="sap.m" xmlns:core="sap.ui.core">
<StandardListItem icon="sap-icon://warning" title="{Name}" />

Answer 2

在这种情况下无需更改您的代码。 SAP Web IDE / SCP 利用开箱即用的 App Cache Buster 概念，只要这些资源不是，它就会从浏览器缓存中获取应用程序资源（例如片段）之前改过。

请参阅下面的示例屏幕截图：

给定

代码：

<core:Fragment fragmentName="demo.view.fragment.MyFragment" type="XML" />
<core:Fragment fragmentName="demo.view.fragment.MyFragment" type="XML" />
<core:Fragment fragmentName="demo.view.fragment.MyFragment" type="XML" />
<core:Fragment fragmentName="demo.view.fragment.MyFragment" type="XML" />
<core:Fragment fragmentName="demo.view.fragment.MyFragment" type="XML" />
<core:Fragment fragmentName="demo.view.fragment.MyFragment" type="XML" />

URL 属性 sap-ui-appCacheBuster=...，Web IDE 在应用程序启动时自动附加（描述 sap-ui-cachebuster-info.json 所在的位置）
如果开发工具打开：禁用缓存 未选中 <-- 可能是在您的情况下仍处于激活状态

结果

如您所见，片段（和其他资源）从磁盘缓存加载，而不是一次又一次地重新获取它们。

此外，如果应用程序是为最终生产环境捆绑的，那么这些片段甚至不会被多次请求，因为它们通常已经包含在捆绑文件中（例如 Component-preload.js）。

为什么 SAPUI5 多次加载相似的片段？

Why SAPUI5 loads similar fragment several times?

performance

caching

sapui5

sap-web-ide

sap-business-technology-platform

给定

结果