CN-122019900-A - Skeleton screen generation method, device, computer equipment and storage medium

CN122019900ACN 122019900 ACN122019900 ACN 122019900ACN-122019900-A

Abstract

The application relates to a skeleton screen generation method, a skeleton screen generation device, computer equipment and a storage medium, and relates to the technical field of front-end development. The method comprises the steps of responding to a loading request for a target page, determining the category and the weight of each element in the target page according to page element information of the target page, generating skeleton space components corresponding to each element according to the category of each element and layout information of the target page, wherein the skeleton space components corresponding to each element are components of the elements in a target skeleton screen corresponding to the target page, and generating the target skeleton screen according to the weight and the skeleton space components corresponding to each element. By adopting the method, the page structure complexity of the skeleton screen can be reduced, and the page loading performance can be improved.

Inventors

CAI ZHILONG
CHEN XUEYONG
YAN LEI
QI JUNYU

Assignees

湖南长银五八消费金融股份有限公司

Dates

Publication Date: 20260512
Application Date: 20260114

Claims (10)

1. A skeleton screen generation method, the method comprising: Responding to a loading request aiming at a target page, and determining the category and weight of each element in the target page according to page element information of the target page; Generating skeleton space occupying components corresponding to the elements according to the categories of the elements and the layout information of the elements on the target page, wherein the skeleton space occupying components corresponding to the elements are components of the elements in a target skeleton screen corresponding to the target page; And generating the target skeleton screen according to the weight and the skeleton occupying component corresponding to each element.
2. The method of claim 1, wherein the generating the target skeleton screen according to the weights and skeleton placeholders corresponding to the elements comprises: for each element, processing a skeleton occupation component corresponding to the element according to the size relation between the weight corresponding to the element and a preset threshold value; And generating the target skeleton screen according to the processing result of the skeleton occupying component corresponding to each element.
3. The method according to claim 2, wherein the processing the skeleton occupation component corresponding to the element according to the magnitude relation between the weight corresponding to the element and the preset threshold value includes: if the weight of the element is greater than a preset threshold, reserving a skeleton occupying component of the element; and if the weight of the element is smaller than or equal to the preset threshold value, deleting the skeleton occupation component of the element or combining the skeleton occupation component of the element with skeleton occupation components of other elements.
4. The method according to claim 2, wherein the generating the target skeleton screen according to the processing result of the skeleton occupation component corresponding to each element includes: generating an initial skeleton screen corresponding to the target page according to the processing result of the skeleton occupying component corresponding to each element; and responding to the adjustment operation for the initial skeleton screen, and adjusting the initial skeleton screen to obtain the target skeleton screen.
5. The method of claim 4, wherein adjusting the initial skeletal screen in response to the adjustment operation for the initial skeletal screen results in the target skeletal screen, comprising: Responding to the adjustment operation for the initial skeleton screen, and adjusting the initial skeleton screen to obtain an intermediate skeleton screen; determining a redundant component according to the influence degree of the skeleton occupying component corresponding to each element on the integrity of the skeleton screen; and eliminating redundant components in the intermediate skeleton screen to obtain the target skeleton screen.
6. The method according to any one of claims 1-5, wherein the generating a skeleton stub corresponding to each element according to the category of each element and layout information on the target page includes: For each element, determining the size and the position of the element in the target page according to the layout information of the element in the target page; And generating a skeleton occupation component corresponding to the element according to the category of the element and the size and the position of the element in the target page.
7. The method according to any one of claims 1-5, wherein the determining, in response to a load request for a target page, a category and a weight of each element in the target page according to page element information of the target page includes: Responding to a loading request aiming at a target page, adopting an architecture of an IFrame embedded in a management end page, and acquiring page element information of the target page by taking MESSAGECHANNE as a cross-domain communication channel between the management end and the target page in the IFrame; And inputting the page element information into an element identification model to obtain the category and the weight of each element in the target page.
8. A skeleton screen generating apparatus, the apparatus comprising: the determining module is used for responding to a loading request aiming at a target page and determining the category and the weight of each element in the target page according to the page element information of the target page; The system comprises a first generation module, a second generation module and a third generation module, wherein the first generation module is used for generating skeleton space occupying components corresponding to elements according to the types of the elements and the layout information of the elements on the target page, and the skeleton space occupying components corresponding to the elements are components of the elements in the target skeleton screen corresponding to the target page; and the second generation module is used for generating the target skeleton screen according to the weight corresponding to each element and the skeleton occupying component.
9. A computer device comprising a memory and a processor, the memory storing a computer program, characterized in that the processor implements the steps of the method of any of claims 1 to 7 when the computer program is executed.
10. A computer readable storage medium, on which a computer program is stored, characterized in that the computer program, when being executed by a processor, implements the steps of the method of any of claims 1 to 7.

Description

Skeleton screen generation method, device, computer equipment and storage medium Technical Field The present application relates to the field of front-end development technologies, and in particular, to a skeleton screen generating method, a device, a computer device, and a storage medium. Background In World Wide Web (Web) applications, there is a delay in loading page content, and directly showing a blank page can cause a user to misunderstand the page as abnormal. To enhance the user experience, a skeletal screen is typically used as a occupancy map for page loading. The skeleton screen may indicate the final page structure in gray placeholders, giving the user a visual cue that the content is being loaded. In the traditional technology, the generated skeleton screen often keeps the structure of a document object model (Document Object Model, DOM) which is irrelevant to the skeleton screen in the original page, so that the structure of the page of the skeleton screen is complex, and the page loading performance is reduced. Disclosure of Invention Based on the above, it is necessary to provide a skeleton screen generating method, device, computer equipment and storage medium, which can reduce the complexity of the skeleton screen page structure and improve the page loading performance. In a first aspect, the present application provides a skeleton screen generating method, including: Responding to a loading request aiming at a target page, and determining the category and weight of each element in the target page according to page element information of the target page; Generating skeleton space occupying components corresponding to the elements according to the categories of the elements and the layout information of the elements on the target page, wherein the skeleton space occupying components corresponding to the elements are components of the elements in a target skeleton screen corresponding to the target page; And generating the target skeleton screen according to the weight and the skeleton occupying component corresponding to each element. In one embodiment, the generating the target skeleton screen according to the weights and skeleton occupation components corresponding to the elements includes: for each element, processing a skeleton occupation component corresponding to the element according to the size relation between the weight corresponding to the element and a preset threshold value; And generating the target skeleton screen according to the processing result of the skeleton occupying component corresponding to each element. In one embodiment, the processing the skeleton occupation component corresponding to the element according to the magnitude relation between the weight corresponding to the element and the preset threshold includes: if the weight of the element is greater than a preset threshold, reserving a skeleton occupying component of the element; and if the weight of the element is smaller than or equal to the preset threshold value, deleting the skeleton occupation component of the element or combining the skeleton occupation component of the element with skeleton occupation components of other elements. In one embodiment, the generating the target skeleton screen according to the processing result of the skeleton occupying component corresponding to each element includes: generating an initial skeleton screen corresponding to the target page according to the processing result of the skeleton occupying component corresponding to each element; and responding to the adjustment operation for the initial skeleton screen, and adjusting the initial skeleton screen to obtain the target skeleton screen. In one embodiment, the adjusting the initial skeleton screen in response to the adjustment operation for the initial skeleton screen to obtain the target skeleton screen includes: Responding to the adjustment operation for the initial skeleton screen, and adjusting the initial skeleton screen to obtain an intermediate skeleton screen; determining a redundant component according to the influence degree of the skeleton occupying component corresponding to each element on the integrity of the skeleton screen; and eliminating redundant components in the intermediate skeleton screen to obtain the target skeleton screen. In one embodiment, the generating, according to the category of each element and the layout information of the target page, a skeleton occupation component corresponding to each element includes: For each element, determining the size and the position of the element in the target page according to the layout information of the element in the target page; And generating a skeleton occupation component corresponding to the element according to the category of the element and the size and the position of the element in the target page. In one embodiment, the determining, in response to a load request for a target page, a category and a weight of each element in the target page