Browser Event Delegation via DOM Path Segmentation
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Web applications face performance issues due to the inefficiency in processing large numbers of event handlers, leading to slow response times when user interactions trigger events, as all handlers must be checked for execution, resulting in a time-consuming process.
Innovation Solution
The implementation of a hierarchical structure representing the markup language document as a DOM tree, where node types are mapped to handler functions, allowing only the relevant handlers associated with the path from the event node to the root node to be executed, reducing the need to inspect all handlers.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Reliability
If all event handlers are checked for execution in response to user interactions, then comprehensive event handling coverage is achieved, but application response time deteriorates due to the large number of handlers requiring inspection
Solution Approach 1:
The patent segments the event handler set into two categories: handlers associated with the event path (from event node to root) and all other handlers. Only the segmented path-associated handlers are inspected and executed, while other handlers are skipped. This segmentation resolves the contradiction by maintaining reliable event handling for relevant events while dramatically reducing the time spent checking irrelevant handlers.
Solution Approach 2:
The patent extracts and isolates the subset of handlers that are actually relevant to the event (those associated with nodes on the path from event node to root). By taking out only these necessary handlers for inspection and execution, the system achieves both comprehensive handling of relevant events and fast response time by avoiding inspection of unnecessary handlers.
2Adaptability or versatility
If the number of event handlers is increased to handle more user interactions, then application functionality is improved, but performance deteriorates due to the increased time required to process all handlers
Solution Approach 1:
The patent applies segmentation by dividing handlers into path-associated handlers and non-path handlers. This allows the system to support a large number of handlers for comprehensive functionality while only processing the small subset that is relevant to each specific event, thereby maintaining high performance despite increased adaptability.
Solution Approach 2:
The patent implements partial action by executing only the necessary subset of handlers (those on the event path) rather than all handlers. This partial execution is sufficient to handle the current event effectively, avoiding the excessive action of checking and potentially executing all handlers, thus maintaining productivity while supporting versatile functionality.
Data Source
AI summary
Event handlers associated with markup language documents represented in a web browser are identified efficiently in response to an event. The markup language document is represented as a hierarchical structure comprising nodes and edges. Nodes are associated with node types, each node type defining how descendants of the node respond to events. The markup language document provides mappings of sets of node types to sets of handlers. In response to an event associated with a node, the types of nodes encountered in a path connecting the node with the root node are identified. Handler sets of the node types encountered in the path connecting a node with the root node are used to determine the handlers to be executed in response to the event. Data is associated with nodes to allow handler code to distinguish between nodes of the same node type.