What is hybrid web containers for SAP ui5

We can develop mobile applications to include native application wrappers （ for example PhoneGap）, And... For displaying content on the user interface HTML Viewer's hybrid application (Hybrid Web Container).

The advantage of hybrid apps is that they can be published in the app store . Besides , By combining application code with SAP UI5 The library file is embedded in the mixing container , Users only need to install the file once , There is no need to download... Every time you start the application .

But the size of the library becomes very important , Because every user must install files , And in the Web In the application , The library is deployed on the server , Users only need to download the required part of the library at run time .

To include the required resources in a hybrid application , You can use static mobile runtime packages openui5-runtime-mobile*.zip. The package is not included in SAP UI5 in , It's contained in Open source version OpenUI5 in .

The library size of these packages is quite small , Because the most likely unwanted content has been deleted , For example, test page . One package Contains all the JavaScript Debug version of the file and optimized and minimized version . therefore , Packages can be used for production and debugging purposes . In the application wrapper （ for example PhoneGap） Use this package in , Please extract the package to the corresponding resource location of the application development project . then , The application wrapper builds the include file and makes it available at run time .

In order to control the size of the package file , It contains only the most likely control Libraries , Not all control Libraries . Depending on the hybrid application , You may need to add libraries by copying them from the appropriate folder at run time , Or delete the library to reduce the package size , This reduces the user's installation size .

This file contains the following control libraries ：

• sap.f

• sap.m

• sap.tnt

• sap.ui.core

• sap.ui.layout

• sap.ui.suite

• sap.ui.unified

• sap.uxap

There may be no absolute objective criteria for deciding which libraries to include or not to include . It is based only on rules of thumb , And many applications need to be tuned anyway .

Besides , Move / Hybrid packages do not include certain types of files that are not normally required . The actual application situation of each customer may be different , Therefore, it is necessary to add corresponding files according to the requirements of specific applications . Originally SAP UI5 Designed in the application library-preload.js, Contains the library All the controls in . Use this file to load the library , Can reduce the HTTP Number of requests .

however SAP UI5 Of Hybrid Web Containers No longer need library-preload.js file , Because in the execution environment of hybrid applications, the library files are loaded locally , There is nothing HTTP Delay .SAPUI5 By default, you will try to access them , Your developer may see these files fail to load in the log . however , These error messages have no effect , You can declare that such a file does not exist and SAPUI5 Set the following configuration in the boot script tag to eliminate them ：

data-sap-ui-preload=""

package Size optimization

Although the static package is small enough , Can be included in hybrid applications , But you can still further reduce the size and optimize the content of a particular application by deleting other files . The following list provides some examples ：

• If you don't need the corresponding control library , You can delete all library folders . for example , stay OpenUI5 Version can be deleted suite and unified Folder .

• At every /resources/sap/* … */themes In the folder , You can delete all theme folders , Except for the theme folder in use .

device ready event

blend Web The container takes some time to initialize . in the meantime ,AJAX The sending of the request is blocked , This means that once sent AJAX request ,JavaScript The code will stop , Code execution will also stop . This can lead to UI be in freeze state .

SAPUI5 Medium OData The model is used internally AJAX request , Therefore, it must be carried out after the mixing container is ready OData Model initialization , To avoid freezing the user interface . After the initialization , blend Web The container triggers a device ready event . for fear of UI freeze, Please create OData Model and related code for model binding , Moved to device ready In the event listener .

Example ：

<!-- 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 (Cross Domain Restrictions)

If you use AJAX Load data from an external server or service , Must be mixed Web Configure external domain in container , In order to make AJAX Requests are restricted across domains .