成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

SAP Fiori里的List是如何做到懶加載Lazy load的

Zhuxy / 2922人閱讀

摘要:從調(diào)用棧能清楚發(fā)現(xiàn)是這個(gè)事件觸發(fā)的第二批的讀取動(dòng)作。然后再去這一個(gè)調(diào)用棧,發(fā)現(xiàn)一個(gè)屬性維護(hù)了一個(gè)開始索引,每次到底部的事件觸發(fā)之后,該屬性值都會(huì)被累加。這些庫(kù)文件一覽在開發(fā)者工具查看從后臺(tái)加載的庫(kù)文件,能發(fā)現(xiàn)屬性在此處被硬編碼成。

今天一同事問(wèn)我這個(gè)問(wèn)題:S/4HANA Fiori應(yīng)用里的列表,一旦Scroll到底部就會(huì)自動(dòng)向后臺(tái)發(fā)起新的請(qǐng)求把更多的數(shù)據(jù)讀取到前臺(tái)顯示。

以Product Master這個(gè)應(yīng)用為例,我點(diǎn)擊搜索之后,結(jié)果區(qū)域顯示當(dāng)前系統(tǒng)一共有140個(gè)product,但是只有前25個(gè)返回并顯示在瀏覽器里。

這個(gè)分頁(yè)效果是UI5 OData的參數(shù)實(shí)現(xiàn)的:$skip=0&top=25。

而總數(shù)140,是通過(guò)參數(shù)$inlinecount實(shí)現(xiàn),其原理和ABAP Open SQL的SELECT COUNT(*)類似。

從Chrome開發(fā)者工具能觀察到頭25個(gè)product的payload:

當(dāng)將列表滾動(dòng)至底部時(shí),第二批共25個(gè)product從后臺(tái)讀取出來(lái),顯示在前臺(tái):

這個(gè)http請(qǐng)求的參數(shù):$skip=25&top=25,用于讀取從第25個(gè)到第50個(gè)product。

從調(diào)用棧能清楚發(fā)現(xiàn)是scroll這個(gè)事件觸發(fā)的第二批product的讀取動(dòng)作。

然后再去GrowingEnablement.requestNewPage這一個(gè)調(diào)用棧,發(fā)現(xiàn)一個(gè)屬性_iLimit維護(hù)了一個(gè)開始索引,每次scroll到底部的事件觸發(fā)之后,該屬性值都會(huì)被GrowingThreshold累加。 因?yàn)锳PI this._oControl.getGrowingThreshold每次返回的是一個(gè)常量25, 因此_iLimit的值每次scroll到底部之后看起來(lái)是這樣的:25,50,75,100 ... 這些值會(huì)被用來(lái)作為HTTP請(qǐng)求參數(shù)$skip的值傳到后臺(tái):

我同事的問(wèn)題:growingThreshold在文件sap.m.ListBase.js里被硬編碼成20, 但是運(yùn)行時(shí)在何處被改寫成了25?

要回答這個(gè)問(wèn)題,需要了解一些UI5 Smart Template的知識(shí),因?yàn)槔永镞@個(gè)Product Master的Fiori應(yīng)用,也是基于Smart Template開發(fā)的。可以參考我的博客My understanding about how object page in Smart Template is rendered 來(lái)了解其工作原理。

當(dāng)Product Master這個(gè)應(yīng)用的UI Component被加載并馬上開始渲染時(shí),需要先加載Smart Template的庫(kù)文件:

在我博客My understanding about how object page in Smart Template is rendered 提到,ListReport.view.xml這個(gè)文件里有若干view fragment的聲明,每個(gè)聲明指向了一些其他的Smart Template庫(kù)文件。

這些庫(kù)文件一覽:

在Chrome開發(fā)者工具查看從ABAP后臺(tái)加載的庫(kù)文件SmartTable.fragment.xml,能發(fā)現(xiàn)屬性growingThreshold在此處被硬編碼成25。

當(dāng)SmartTable.fragment.xml被加載之后其內(nèi)容會(huì)被解析, growingThreshold值為25,會(huì)通過(guò)控件的setter API寫入到控件屬性里。這樣接下來(lái)在處理列表的scroll事件是,25這個(gè)值就會(huì)通過(guò)控件的getter API返回并累加到_iLimit上。

關(guān)于XML view從ABAP后臺(tái)加載到瀏覽器后是如何被解析并生成對(duì)應(yīng)的UI5控件,可以參考我的博客Why my formatter does not work? A trouble shooting example to know how it works

也許您按照我上面描述的步驟操作,但是無(wú)法觸發(fā)斷點(diǎn)。原因是因?yàn)閁I5框架針對(duì)基于Smart Template開發(fā)的Fiori應(yīng)用的XML view設(shè)計(jì)了一套緩存機(jī)制。當(dāng)待渲染的XML view已經(jīng)在緩存中存在時(shí),不會(huì)去ABAP后臺(tái)加載Smart Template的庫(kù)文件, 而是直接執(zhí)行第428行的IF分支。

通過(guò)調(diào)試我們可以發(fā)現(xiàn)緩存是通過(guò)IndexedDB加上LRU(Least?recently?used)算法實(shí)現(xiàn)的。

通過(guò)Chrome開發(fā)者工具可以觀察到待渲染的view已經(jīng)有記錄存儲(chǔ)在IndexedDB里了:

如果想觀察Smart Template庫(kù)文件的加載,需點(diǎn)擊"Delete database"以手動(dòng)清除緩存。

緩存清除完畢后,即可觀察到期望中的Smart Template庫(kù)文件加載。


這篇文章介紹了如何通過(guò)調(diào)試找到同事提出問(wèn)題的答案。我把它加在了我UI5調(diào)試文章分享的合集里:My UI5 debugging tips and experience collection - how to resolve UI5 issues through debugging by yourself

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/52115.html

相關(guān)文章

  • SAP FioriList如何做到加載Lazy load

    摘要:從調(diào)用棧能清楚發(fā)現(xiàn)是這個(gè)事件觸發(fā)的第二批的讀取動(dòng)作。然后再去這一個(gè)調(diào)用棧,發(fā)現(xiàn)一個(gè)屬性維護(hù)了一個(gè)開始索引,每次到底部的事件觸發(fā)之后,該屬性值都會(huì)被累加。這些庫(kù)文件一覽在開發(fā)者工具查看從后臺(tái)加載的庫(kù)文件,能發(fā)現(xiàn)屬性在此處被硬編碼成。 今天一同事問(wèn)我這個(gè)問(wèn)題:S/4HANA Fiori應(yīng)用里的列表,一旦Scroll到底部就會(huì)自動(dòng)向后臺(tái)發(fā)起新的請(qǐng)求把更多的數(shù)據(jù)讀取到前臺(tái)顯示。 以Produc...

    RyanQ 評(píng)論0 收藏0
  • SAP FioriList如何做到加載Lazy load

    摘要:從調(diào)用棧能清楚發(fā)現(xiàn)是這個(gè)事件觸發(fā)的第二批的讀取動(dòng)作。然后再去這一個(gè)調(diào)用棧,發(fā)現(xiàn)一個(gè)屬性維護(hù)了一個(gè)開始索引,每次到底部的事件觸發(fā)之后,該屬性值都會(huì)被累加。這些庫(kù)文件一覽在開發(fā)者工具查看從后臺(tái)加載的庫(kù)文件,能發(fā)現(xiàn)屬性在此處被硬編碼成。 今天一同事問(wèn)我這個(gè)問(wèn)題:S/4HANA Fiori應(yīng)用里的列表,一旦Scroll到底部就會(huì)自動(dòng)向后臺(tái)發(fā)起新的請(qǐng)求把更多的數(shù)據(jù)讀取到前臺(tái)顯示。 以Produc...

    SolomonXie 評(píng)論0 收藏0
  • SAP UI 搜索分頁(yè)技術(shù)

    摘要:搜索分頁(yè)技術(shù)往往和另一個(gè)術(shù)語(yǔ)懶加載聯(lián)系起來(lái)。該搜索分頁(yè)的實(shí)現(xiàn)歸功于請(qǐng)求的參數(shù),,意為從請(qǐng)求命中的第條記錄開始總共返回條記錄。更多細(xì)節(jié),請(qǐng)參考我的博客應(yīng)用的搜索分頁(yè)實(shí)現(xiàn)原理,全稱為,開發(fā)技術(shù)仍然采用。 搜索分頁(yè)技術(shù)往往和另一個(gè)術(shù)語(yǔ)Lazy Loading(懶加載)聯(lián)系起來(lái)。今天由Jerry首先介紹S/4HANA,CRM Fiori和S4CRM應(yīng)用里的UI搜索分頁(yè)的實(shí)現(xiàn)原理。后半部分由SA...

    dack 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<