Yesterday I was challenged by my colleague: in the CRM Fiori application “My Opportunity”, although the OData request for logo url is set as false ( means Synchronous ), why we still observe in UI that this request is done like Asynchronously?
For the complete story about Image display logic in Fiori, please refer to this blog: CRM Fiori Application – how is image maintained and displayed in Fiori UI.
My colleague’s doubt is that he observed even the response of image url is not returned by backend, still end user could continue to work on UI – it seems UI is not blocked so my colleague considered that the request is done in an Asynchronous way.
I just would like to share with you how I persuade him to accept this is really an Synchronous request.
The key idea here is: We are doing test in our internal system, the request for image url is almost immediately returned ( less than 2 seconds ), so it is really difficult to judge by eye whether it is synchronous or asynchronous.
As a result, I add another 13 seconds’ latency in OData service implementation:
Synchronous mode
Afterwards the synchronous behavior is quite obvious now. I click one item in navigation list to trigger the synchronous request for Image url retrieval. And after that, I cannot do any operation on UI – it is completely freezed.
Asynchronous mode
Then I change the manual latency to 20 seconds and retest the UI.
Now every time I click one opportunity in the navigation list, still one http request for image logo is sent out. Compared with synchronous mode, this time the UI is not blocked – I can continue to work on UI without waiting for the response.
This asynchronous behavior could also easily be found in the timechart in Chrome network:
Conclusion
code is correct, our eye is wrong. Any OData request with async set as false, would and must be done synchronously.
Further reading – A list of my debugging posts
I have written a collection of blogs which contains my experience how to resolve some issue or figure out the logic of UI5 framework under the hood via self-debugging. See a list below:
- Chrome development tool
- UI5 inspector
- Deal with “blank screen issue”
- UI5 field formatter
- Negative cache
- Control registration and deregistration
- Fiori flower animation
- Fiori Icon logic
- Find out the origin of suspicious HTTP roundtrips
- Date Picker
- Contact support button behavior
- Two types of popup Dialog in Fiori
- Fiori globalization – amount display truncation logic
- An example of Fiori Globalization implementation – the number format mystery
- HTTP 200 OK and HTTP 304 Not Modified
- An example of how to find back button implementation on Smart Template generated application
- FullScreenPageRoutes in Component.js
- An easy way to find location where Unique id of UI5 control is created
- More detail about Bootstrap script tag
- A small tip I learn from UI5 Diagnostics tool – a practice of AOP programming
- Another reason of empty screen issue and how I analyze the issue
- Why Adapt UI button is visible in some system but missing in some other system
- Open your SAP GUI transaction in Fiori launchpad
- Why sometimes my OData request is cancelled automatically
要获取更多Jerry的原创文章,请关注公众号"汪子熙":
相关推荐
SAP Fiori OData Services. OData is used to define best practices that are required to build and consume RESTful APIs. It helps you to find out changes, defining functions for reusable procedures and ...
Jerry 从 2014 年加入 SAP成都研究院 CRM Fiori 开发团队之后开始接触 SAP UI5,曾经在 SAP 社区和“汪子熙”微信公众号上发表过多篇关于 SAP UI5 工作原理和源码解析的文章。 Jerry 也是从 SAP UI5 菜鸟一路走过来...
以下是SAP Fiori的三种方案:交易应用程序(Transactional apps),分析应用程序(Analytical apps)和实况报告报表(Fact sheets)。每个方案都有其特定的系统或软件要安装。通过阅读本文档,它可以根据所需的系统...
SAP Fiori SAP Fiori SAP Fiori Architecture Architecture Overview to Deep Overview to Deep Dive -with with focus on S/4 HANA focus on S/4 HANA
SAP fiori的简易开发过程指南,从开发者角度出发,分后面ODATA开发环境和前端SAP UI5环境搭建,以及发布进行了讲解
SAP ODATA Training Agenda • Session 1: Introduction to SAPUI5 / FIORI (40 mins) ▫ Basic MVC concept: Model, View, Controller ▫ UI5 Control libraries • Session 2: Introduction to SAP Web IDE (20 ...
SAP Fiori 官方最新培训中使用的现金流案例。与你分享。
SAP Fiori Launchpad是移动或桌面设备上Fiori应用程序的入口,...本配置指南提供了设置SAP Fiori Launchpad和Launchpad Designer所需的信息。 此外,它还提供了将所有类型的SAP Fiori应用程序添加到Launchpad中的步骤。
SAP FIORI OVERVIEW FIORI概览
SAP Fiori - Adding a Custom Workflow in 6 Steps
SAP Fiori---快速指南 共82页 2018年编著 word文档,写的不错,快速入门的好教材。
OData Service function import ▫ Controller extension in FIORI Elements • Session 3: Introduction to FIORI Launchpad (30 • Hands on 3: Register FIORI application with proper role assignment(60 mins)...
SAP Fiori UX overview 2015/03
SAP Fiori Implementation Guide This document describes exploring SAP Fiori Implementation options and planning a typical SAP Fiori on premise implementation.
SAP OData Training Agenda • Session 1: Introduction to REST (20 mins) • Session 2: Introduction to OData Service (40 mins) • Hands on 1: Build your 1 st OData Service (60 mins) ▫ Transaction: SEGW...
Take a deep dive into SAP Fiori and discover Fiori architecture, Fiori landscape installation, Fiori standard applications, Fiori Launchpad configuration, tools for developing Fiori applications and ...
SAP S4HANA frontend fiori详细配置文档,以及简单权限配置
SAP Fiori 官方新产品发布体验 F110自动付款样例.希望您喜欢。
SAP UI5作为前端开发框架,使用SAP Gataway开发后端OData Service
什么是SAP Fiori SAP UX策略 SAP Fiori设计指南(Design Guideline) SAP Fiori运行环境 SAPUI5与OpenUI5 OpenUI演示