HTML Element Add-On Rendering via Native Bridge
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Existing web application add-ons experience lag due to being executed on a server-based engine, which compromises security and limits developer flexibility, as they are isolated from the native application and cannot utilize well-known programming languages or previously written code.
Innovation Solution
Implementing add-ons within a document object model (DOM) using HTML elements like iframes, which isolate third-party code and allow user interactions, enabling seamless integration and synchronization across devices while maintaining security.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Reliability
If add-ons are executed using a server-based engine with isolation, then security is improved, but responsiveness and rendering time deteriorate due to lag
Solution Approach 1:
The patent introduces a bridge component that mediates between the isolated add-on execution environment and the native web application. This bridge enables direct communication and data exchange, allowing add-ons to render and respond within the native application's context while maintaining security isolation, thus resolving the contradiction between security and responsiveness
Solution Approach 2:
The system segments the add-on execution environment from the native application using isolated contexts (such as iframes or separate JavaScript contexts), allowing add-ons to run securely in isolation while the bridge enables selective interaction. This segmentation maintains security boundaries while permitting responsive communication through the bridge mechanism
2Reliability
If add-ons are isolated from the native application, then security is improved, but adaptability and ease of operation deteriorate due to limited access to programming languages and existing code
Solution Approach 1:
The bridge component provides universal access mechanisms that allow add-ons written in various programming languages to interact with the native web application through standardized interfaces. This enables developers to use their preferred languages and existing code libraries while maintaining security isolation, thus resolving the contradiction between security and developer flexibility
3Reliability
If add-ons are isolated from the native application, then security is improved, but device synchronization capability deteriorates
Solution Approach 1:
The bridge establishes feedback mechanisms between isolated add-on instances running on different devices, enabling state synchronization and coordinated operation. Through the bridge, add-ons can exchange data and events across devices while maintaining security isolation, resolving the contradiction between security and synchronization capability
Data Source
AI summary
A method includes receiving a user event associated with content of an add-on for a web application displayed on a first user interface. The add-on is a non-native application executed using a hypertext markup language (HTML) element. The method further includes passing the user event to a document object model of the web application using a blank native element. The blank native element links the add-on to the document object model. The method further includes processing the user event using an HTML element renderer. The method further includes displaying updated content associated with the add-on based on the processed user event.