Expression Engine Asynchronous Data Handling Prevents UI Flickering
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Current expression engines evaluate formulas synchronously and cannot handle asynchronous data sources effectively, leading to UI flickering and exposure of incomplete or inaccurate data in user interfaces, as they require users to manage asynchronous results manually.
Innovation Solution
Implement a signaling mechanism to determine when enough data is available for expression evaluation, preventing UI generation until all necessary data is retrieved, and using methods like Promise objects in JavaScript-based engines and Future<> objects in Java-based engines to handle asynchronous data sources.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Adaptability or versatility
If asynchronous data sources are used to retrieve data, then data retrieval capability is improved, but UI flickering occurs and data accuracy deteriorates
Solution Approach 1:
The system performs preliminary actions by pre-loading data from asynchronous sources before the user interface is fully rendered. Data providers are instantiated and their data retrieval operations are initiated in advance, so that when the UI rendering completes, all necessary data should already be available, preventing flickering and ensuring data accuracy.
Solution Approach 2:
The system implements feedback mechanisms where data providers signal when their data is ready through callbacks or promises. The expression engine monitors these feedback signals and only renders the UI once all required data is available, ensuring data accuracy while maintaining the benefits of asynchronous retrieval.
2Productivity
If asynchronous data retrieval is implemented, then data fetching is improved, but UI flickering occurs
Solution Approach 1:
Data retrieval operations are performed in advance before UI rendering completes. The system waits for all asynchronous data to be fetched and ready before finalizing the UI composition, ensuring stability while maintaining fetching efficiency.
Solution Approach 2:
The system merges the data retrieval process with the UI rendering process by coordinating their timing. All data providers are instantiated and their data is fetched concurrently, then the results are combined and used to render the complete UI without flickering, achieving both efficiency and stability.
3Speed
If synchronous expression evaluation is used, then evaluation speed is improved, but inability to handle asynchronous data sources occurs
Solution Approach 1:
The expression engine is enhanced to be universal, capable of handling both synchronous and asynchronous data sources. It maintains synchronous evaluation speed for synchronous sources while adding the ability to wait for asynchronous data through promise-based mechanisms, achieving multi-functionality without sacrificing performance.
Solution Approach 2:
An intermediary layer is introduced between the synchronous expression evaluator and asynchronous data sources. This mediator translates asynchronous data requests into promise objects that can be consumed by the synchronous evaluator, allowing the engine to maintain its synchronous evaluation speed while gaining asynchronous data handling capability.
Data Source
AI summary
Systems and methods are provided for receiving, at a computing system, an expression in a formula language to generate a user interface to be displayed, where the expression includes data to be retrieved. The computing system may determine whether a first portion of the data for the expression has been retrieved from at least one data source when the user interface is to be generated based on a signal received by the computing system from the at least one data source. When the first portion of the data is available, the user interface may be output. When the signal is received by the computing system that the first portion of the data for the expression is not available, the computing system outputs the user interface without the first portion of the data and revises the user interface to include the first portion of the data when the first portion of data becomes available.