Merging Server and Client UI Elements in DOM
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Existing technologies face challenges in creating web pages that can be seamlessly displayed across different platforms, such as servers and clients, due to the need for distinct pages with overlapping content, where server-side and client-side UI elements often require separate creation despite shared content.
Innovation Solution
A method and apparatus that combine server-supplied UI elements with client-supplied UI elements within a Document Object Model (DOM), allowing for intelligent merging and conflict resolution, enabling dynamic modification and rendering of pages across various platforms by inserting server UI elements into a client object model and utilizing client access to user information for modifying server-supplied UI elements.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Adaptability or versatility
If separate server-side and client-side pages are created, then platform-specific customization is achieved, but development complexity and maintenance burden increase
Solution Approach 1:
The patent merges server-side and client-side UI elements into a single unified page structure. The server generates a master page containing both server-supplied UI elements (headers, footers, navigation) and client-supplied UI elements (content areas, interactive components) in one DOM tree, eliminating the need for separate page files and reducing development complexity while maintaining platform adaptability through conditional rendering logic.
Solution Approach 2:
The unified page structure serves multiple functions simultaneously: it acts as both a server-rendered template and a client-interactive application. The same DOM structure is used across different platforms (server and client), with a single page file serving as the universal template that adapts its content based on the execution environment, reducing maintenance burden while supporting platform-specific customization.
2Adaptability or versatility
If duplicate UI elements are maintained across server and client pages, then platform independence is achieved, but redundancy and file size increase
Solution Approach 1:
The patent combines all UI elements into a single unified page structure where server-side elements and client-side elements coexist in one DOM tree. This eliminates redundant copies of UI elements across separate files, reducing file size and maintenance burden while maintaining platform independence through environmental detection and conditional rendering that ensures the appropriate elements are activated on each platform.
3Adaptability or versatility
If server-supplied UI elements are modified by client, then user personalization is enabled, but conflict resolution complexity increases
Solution Approach 1:
The patent performs preliminary conflict resolution during the server-side rendering phase by establishing a predefined hierarchy where server-supplied UI elements (headers, footers, navigation) take precedence over client-supplied elements. This preliminary structuring eliminates conflicts before they occur, allowing client personalization within designated content areas without complex runtime conflict resolution, thus enabling user personalization while maintaining manageable complexity.
Solution Approach 2:
The patent applies different levels of modifiability to different parts of the UI: server-supplied structural elements (headers, footers) are protected from modification, while client-supplied content areas are fully customizable. This local differentiation of quality allows user personalization in appropriate areas while preventing conflicts in critical structural areas, enabling personalization without increasing conflict resolution complexity.
Data Source
AI summary
A method and apparatus are disclosed for combining server-supplied user interface elements with client-supplied user interface elements. The server-supplied user interface elements can be received by a client device and inserted into a client-supplied object model, such as a Document Object Model (DOM). The object model can then be used to render a page, such as a webpage. By injecting server-supplied user interface elements into a client object model, the client can intelligently combine UI elements from a server with UI elements from a client. In the situation where there are conflicting or overlapping UI elements, the client device can modify the object model to eliminate such conflicts or overlaps.