Proxy Server Mobile Browser Rendering Optimization
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Mobile browsers face limitations in rendering complex HTML objects due to limited computing resources, leading to less rewarding user experiences, and thin-client browsers suffer from low-bandwidth and latency issues.
Innovation Solution
A proxy-based browser architecture that extracts web elements, captures images, and uses slice-based screen encoding to compress background images, providing progressive updates and optimizing element-level interactivity, thus enhancing user experience on mobile devices.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Adaptability or versatility
If a native browser directly downloads and renders web pages on a mobile device, then the browser can display web content, but the limited computing resources on the mobile device prevent it from supporting complicated HTML objects, resulting in less rewarding user experiences
Solution Approach 1:
The system segments the browser functionality into two parts: the mobile device runs a lightweight browser client for display and input, while the proxy server handles complex rendering and HTML object processing. This segmentation allows complicated HTML objects to be supported without overloading the mobile device's limited computing resources.
Solution Approach 2:
A proxy server is introduced as an intermediary between the mobile device and web servers. The proxy server receives web pages, renders them to bitmaps, compresses the bitmaps, and sends them to the mobile device. This intermediary handles the computationally intensive tasks that the mobile device cannot perform, enabling support for complicated HTML objects while keeping the mobile device's resource usage low.
2Ease of operation
If a thin-client based browser decouples application logic and display by executing browser logic on a proxy server, then the mobile device can display web content, but low-bandwidth and latency issues arise due to the need to transmit and compress bitmaps over the network
Solution Approach 1:
The system changes the parameter of image transmission by compressing rendered bitmaps before transmission over the network. The proxy server renders web pages to bitmaps and applies compression algorithms to reduce the data size, thereby reducing network bandwidth consumption and transmission time, which addresses the low-bandwidth and latency issues of thin-client browsers.
Solution Approach 2:
The proxy server performs preliminary rendering and compression of web pages before transmission to the mobile device. By pre-processing the web content into compressed bitmap format, the system reduces the amount of data that needs to be transmitted over the network, thereby reducing latency and bandwidth consumption during actual browsing operations.
3Device complexity
If web providers create simplified versions of web pages for mobile browsers, then the pages can be displayed on devices with limited computing capability, but users experience less rewarding or rich browsing experiences compared to desktop browsers
Solution Approach 1:
Instead of creating simplified versions of web pages, the system uses the proxy server to render the original web pages to bitmap copies that are optimized for mobile display. The proxy server fetches the full-featured web pages from web servers, renders them to images, and transmits the rendered output to the mobile device. This approach preserves the richness and completeness of the original web content while adapting it for mobile display capabilities, thereby maintaining high-quality browsing experiences without requiring simplified page versions.
Data Source
AI summary
Techniques describe providing a web page for a proxy-based browser on a mobile device to enhance user experience. A proxy server receives a layout of the web page, extracts web elements from the web page, and captures images of the web elements of the web page. The web elements are incorporated with a background screen image to form a composite screen format to represent a display of the web page. The background screen image is compressed by splitting an encoded frame into fixed-size slices and splitting a previous screen frame into fixed-size slices. The proxy server provides the web page synchronized with the mobile device based on the composite screen format and the compressed background screen image. Furthermore, the proxy server receives input from a user to provide updates to web elements that are dynamic on the web page to be displayed on the screen of the mobile device.