Skeleton Screen Generation via Page Structure Mapping
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Existing application program loading processes are inefficient, requiring users to wait for a significant time before the first screen is displayed, and current methods for implementing skeleton screens are either inefficient or not suitable for dual-threaded applet architectures.
Innovation Solution
A method to generate a skeleton screen view file based on the target page's structure, allowing for efficient and flexible display of a skeleton screen before the target page is loaded, without requiring separate code for the skeleton screen, by processing page elements and establishing a mapping relationship between the target page and skeleton screen view files.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Loss of time
If a traditional loading page is displayed during page loading, then the user can see something during the loading process, but the user needs to wait for a certain time and the loading experience is poor
Solution Approach 1:
The skeleton screen is generated in advance based on the target page's structure before actual data loading completes. The system pre-processes the page structure to create a template that can be immediately displayed, eliminating the need for users to wait for content to load before seeing any visual feedback.
Solution Approach 2:
The skeleton screen creates a visual copy or placeholder representation of the target page structure. Instead of showing a blank loading screen, the system generates a simplified version of the page layout with placeholder elements that mirror the actual page structure, giving users immediate visual feedback about what to expect.
2Ease of manufacture
If separate code is written for skeleton screen implementation, then the skeleton screen can be displayed, but the code complexity increases and maintenance becomes difficult
Solution Approach 1:
The system uses a universal approach where the same page structure processing mechanism that generates the final page view also generates the skeleton screen. By reusing the existing page structure parsing and rendering infrastructure, the system avoids writing separate dedicated code for skeleton screens, reducing overall code complexity.
Solution Approach 2:
The page structure processing system serves itself by automatically generating skeleton screens as part of its normal operation. The existing page structure analysis code is reused to create skeleton screens without requiring separate manual implementation, allowing the system to maintain consistency and reduce maintenance burden.
3Manufacturing precision
If the skeleton screen is updated frequently to match page changes, then the skeleton screen remains accurate, but the implementation efficiency decreases
Solution Approach 1:
The skeleton screen is generated in advance based on the target page's structure before actual data loading completes. The system pre-processes the page structure to create a template that can be immediately displayed, eliminating the need for users to wait for content to load before seeing any visual feedback.
Solution Approach 2:
The skeleton screen creates a visual copy or placeholder representation of the target page structure. Instead of showing a blank loading screen, the system generates a simplified version of the page layout with placeholder elements that mirror the actual page structure, giving users immediate visual feedback about what to expect.
Data Source
AI summary
Embodiments of this application provide a page processing method and related apparatus. The method includes previewing a target page in an application program; obtaining a page structure of the previewed target page, the page structure of the target page identifying a layout of page elements of the target page in the target page; obtaining a page structure of a skeleton screen corresponding to the target page based on the page structure of the target page, the page structure of the skeleton screen identifying a layout of placeholder elements of the skeleton screen on the skeleton screen, the placeholder elements being obtained by processing the page elements; and generating a view file of the skeleton screen according to the page structure of the skeleton screen, the skeleton screen being displayed before the target page is loaded.