cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Search instead for 
Did you mean: 

Async preload of libraries described in manifest file of the Component.

evgeny_turovsky
Participant

on ‎2020 May 12 8:23 AM

0 Kudos
1,456

Hi experts!

During researching of the SAP UI5 bootstrap process, there are two parameters for asynchronous loading process:

data-sap-ui-async=true / false
data-sap-ui-preload="auto / async / sync"

So, data-sap-ui-preload="async" parameter as I understood, can activate async preload only for libraries which declared in

data-sap-ui-libs="sap.m,sap.tnt,....."

And it's OK. In DevTools I see this async preload. ui5loader-dbg uses it's async function "loadJSResourceAsync".

If I set data-sap-ui-async=true parameter, this parameter does the same as data-sap-ui-preload="async" parameter for bootstrap libs, but it works for other modules as well.

So, my bootstrap uses data-sap-ui-async=true parameter.

I expected that libriaries from manifest-file of my Component should loading asynchronously but no..

manifest.json has, for example, four libs which I want to preload, but in DevTools I see Sync loading..

...
"sap.ui5": {
 "dependencies": {
   "minUI5Version": "1.30.00",
   "libs": {
     "sap.tnt": {},
     "sap.gantt": {},
     "sap.fileviewer": {},
     "sap.ndc": {}
   }
 }

Look at this picture

And the ui5loader-dbg uses it sync function as well: requireSync.

What am I missing?

Best regards, Evgeny T.

Show replies
Show replies
boghyon
Product and Topic Expert
Product and Topic Expert
‎2020 May 12 4:21 PM
0 Kudos

Could you share the whole index.html? With which UI5 version was the app launched? Generally, it would be nice if the question could contain an mcve so that readers can reproduce the issue.

evgeny_turovsky
Participant
‎2020 May 12 6:50 PM
0 Kudos

App was launched with the 1.77.2 version.

Below is the code which was without async loading of libraries which was declared in manifest.json of Component.js.

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Test</title>        

  </head>
  <body class="sapUiBody sapUiSizeCompact" id="content">
    <div id="content"></div>
  </body>

  <script type="text/javascript">
    function compLoad() {
      new sap.ui.core.ComponentContainer({
          name: "InitTest",
          settings : {
            id : "initTest"
          }
        }).placeAt("content");
    }
  </script>
  <script id="sap-ui-bootstrap"
          type="text/javascript"
          src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
          data-sap-ui-resourceRoots='{"InitTest": "./"}'
          data-sap-ui-theme="sap_fiori_3"
          data-sap-ui-onInit="compLoad"
          data-sap-ui-libs="sap.m"
          data-sap-ui-async=true>
  </script>
</html>

manifest.json

{
  "sap.app": {
    "id": "InitTest",
    "type": "application",
    "applicationVersion": {
      "version": "1.0.0"
    }
  },

  "sap.ui5": {
    "dependencies": {
      "minUI5Version": "1.30.00",
      "libs": {
        "sap.tnt": {},
        "sap.gantt": {}
      }
    },
    "rootView": {
      "viewName": "InitTest.view.Main",
      "type": "XML",
      "async": true,
      "id": "app"
    }
  }
}

Component.js

sap.ui.define([
  "sap/ui/core/UIComponent"
], function (UIComponent) {
  "use strict";
  return UIComponent.extend("InitTest.Component", {
     metadata : {
      manifest: "json"
     },
     init : function () {
        UIComponent.prototype.init.apply(this, arguments);
     }
  });
});
boghyon
Product and Topic Expert
Product and Topic Expert
‎2020 May 21 12:49 PM
0 Kudos

Did the answer below help?

Answer
View Entire Topic
evgeny_turovsky
Participant
‎2020 May 12 12:08 PM
0 Kudos

I could load libraries of Component asynchronously only so:

I added in ComponentContainer constructor parameter manifest: "./manifest.json" 

<script type="text/javascript">
 function compLoad() {
   new sap.ui.core.ComponentContainer({
     name: "InitTest",
     settings : {
       id : "initTestBlabla"
     },
     manifest: "./manifest.json"
   }).placeAt("content");
 }
 </script>
 <script id="sap-ui-bootstrap"
         type="text/javascript"
         src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
         data-sap-ui-theme="sap_fiori_3"
         data-sap-ui-onInit="compLoad"
         data-sap-ui-libs="sap.m,sap.tnt"
         data-sap-ui-async=true>
 </script>

As a result, manifest.json of the Component was loaded before Component.js and all of libriaries from manifest.json was loaded asynchroniously:

Show replies
Show replies
Ask a Question