什么是 SAP UI5 的 Hybrid Web Containers
我們可以將移動應用程序開發為包含原生應用程序包裝器(例如 PhoneGap),和用于在用戶界面上顯示內容的 HTML 查看器的混合應用程序(Hybrid Web Container)。
混合應用的優勢在于可以在應用商店中發布它們。此外,通過將應用程序代碼和 SAP UI5 庫文件嵌入到混合容器中,用戶只需安裝一次文件,無需每次啟動應用程序時下載。
但是庫的大小變得很重要,因為每個用戶都必須安裝文件,而在 Web 應用程序中,庫部署在服務器上,用戶只需要在運行時下載庫的所需部分。
要在混合應用程序中包含需要的資源,可以使用靜態移動運行時包 openui5-runtime-mobile*.zip。該包不包含在 SAP UI5 中,而是包含在開源版本 OpenUI5中。
這些包的庫大小相當小,因為最有可能不需要的內容已被刪除,例如測試頁面。一個 package 包含所有 JavaScript 文件的調試版本以及優化和最小化的版本。因此,可以將包用于生產用途以及調試目的。要在應用程序包裝器(例如 PhoneGap)中使用此包,請將包解壓縮到應用程序開發項目的相應資源位置。然后,應用程序包裝器構建包含文件并使其在運行時可用。
為了控制文件構建出的包文件尺寸,它只包含最有可能使用的控件庫,而不是所有控件庫。根據混合應用程序的不同,可能需要通過從運行時的相應文件夾復制庫來添加庫,或者刪除庫以減小包大小,從而減少用戶的安裝大小。
該文件包含以下控制庫:
-
sap.f
-
sap.m
-
sap.tnt
-
sap.ui.core
-
sap.ui.layout
-
sap.ui.suite
-
sap.ui.unified
-
sap.uxap
包含或不包含哪些庫的決定可能不存在絕對客觀的標準。它僅基于經驗法則,并且無論如何都需要對許多應用程序進行調整。
此外,移動/混合包不包括通常不需要的某些類型的文件。每個客戶實際的應用場合都可能會有所不同,因此需要根據特定應用的要求添加相應的文件。本來 SAP UI5 應用里設計出的 library-preload.js,包含了該 library 里的所有控件。采用這種文件來加載庫,可以減少 HTTP 請求數量。
但是 SAP UI5 的 Hybrid Web Containers 不再需要 library-preload.js 文件,因為在混合應用程序的執行環境里是從本地加載庫文件,沒有任何的 HTTP 延遲。SAPUI5 默認會嘗試訪問它們,因此您可能會在日志文件或開發人員工具中看到加載這些文件的嘗試失敗。但是,這些錯誤消息并沒有什么影響,您可以通過聲明不存在此類文件并在 SAPUI5 引導腳本標記中設置以下配置來消除它們:
data-sap-ui-preload=""package 尺寸的優化
盡管靜態包足夠小,可以包含在混合應用程序中,但仍然可以通過刪除其他文件來進一步減小大小并優化特定應用程序的內容。以下列表提供了一些示例:
-
如果不需要相應的控制庫,您可以刪除所有庫文件夾。例如,在 OpenUI5 版本中可以刪除 suite 和 unified 文件夾。
-
在每個/resources/sap/* … */themes文件夾中,可以刪除所有主題文件夾,但正在使用的主題文件夾除外。
device ready event
混合 Web 容器需要一些時間進行初始化。在此期間,AJAX 請求的發送被阻止,這意味著一旦發送 AJAX 請求,JavaScript 代碼就會停止,代碼執行也會停止。這會導致 UI 處于 freeze 狀態。
SAPUI5 中的 OData 模型在內部使用 AJAX 請求,因此必須在混合容器準備好后再進行 OData 模型初始化,以避免用戶界面凍結。初始化后,混合 Web 容器會觸發一個 device ready 事件。為了避免 UI freeze,請將創建 OData 模型并進行模型綁定的相關代碼,移至 device ready 事件偵聽器中。
例子:
<!-- put the following code in the beginning of the application code --> function appReady(){sap.ui.getCore().setModel(new sap.ui.model.odata.v2.ODataModel(<ODATA_URL>)); } <!-- bind to the deviceready event --> document.addEventListener("deviceready", appReady, false); </script>跨域限制(Cross Domain Restrictions)
如果使用 AJAX 從外部服務器或服務加載數據,則必須在混合 Web 容器內配置外部域,以使 AJAX 請求通過跨域限制。
總結
以上是生活随笔為你收集整理的什么是 SAP UI5 的 Hybrid Web Containers的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 华为中国合作伙伴大会今日举行 参会人员达
- 下一篇: 日本计划拓展本土 Michibiki 卫