A data display method, apparatus, device, and storage medium

Abstract

This application discloses a data display method, apparatus, device, and storage medium. The method includes, upon detecting a jump trigger instruction for a target page, obtaining rendering configuration data corresponding to a target page object in the target page based on native components, and obtaining page data of the target page based on web page components; rendering the target page object based on the native components and the rendering configuration data to obtain rendering result data corresponding to the target page object; determining display position information corresponding to the target page object based on the native components and the page data; and displaying the rendering result data corresponding to the target page object in the target page based on the display position information during the page rendering process based on the web page components and the page data. The technical solution provided by this application enables pre-rendering of target page objects based on native components, improving the efficiency and stability of target page object display and enhancing the flexibility of data display.

Description

Technical Field

[0001] This application relates to the field of computer technology, specifically to a data display method, apparatus, device, and storage medium. Background Technology

[0002] Hybrid mobile applications are typically native applications (such as standalone Android applications) that embed a web browser component, i.e., applications with embedded web pages. This allows them to leverage the strong adaptability and real-time updates of web pages (such as H5 web pages) to achieve rich content display.

[0003] In practical applications, loading web pages often requires retrieving web page data for overall rendering. This process is highly dependent on network speed and stability. If the network speed is slow or unstable, page content cannot be displayed correctly, users cannot obtain the information they need in a timely manner, impacting user experience and resulting in poor data display. Therefore, a more reliable solution is needed. Summary of the Invention

[0004] To address the problems of existing technologies, this application provides a data display method, apparatus, device, and storage medium. The technical solution is as follows:

[0005] This application provides a data display method, the method comprising:

[0006] When a jump trigger command for the target page is detected, the rendering configuration data corresponding to the target page object in the target page is obtained based on the native component, and the page data of the target page is obtained based on the web page component;

[0007] Based on the native component and the rendering configuration data, the target page object is rendered to obtain the rendering result data corresponding to the target page object;

[0008] Based on the native components and the page data, determine the display position information corresponding to the target page object;

[0009] During the process of rendering the target page based on the web page components and the page data, the rendering result data corresponding to the target page object is displayed on the target page based on the display position information.

[0010] Another aspect of this application provides a data display device, the device comprising:

[0011] The data acquisition module is used to acquire the rendering configuration data corresponding to the target page object in the target page based on the native component and to acquire the page data of the target page based on the web page component when a jump trigger instruction of the target page is detected.

[0012] The object rendering module is used to render the target page object based on the native component and the rendering configuration data, and obtain the rendering result data corresponding to the target page object;

[0013] The display location determination module is used to determine the display location information corresponding to the target page object based on the native component and the page data;

[0014] The data display module is used to display the rendering result data corresponding to the target page object on the target page based on the display position information during the page rendering process based on the web page components and the page data.

[0015] This application also provides an apparatus comprising a processor and a memory, wherein the memory stores at least one instruction or at least one program, the at least one instruction or the at least one program being loaded and executed by the processor to implement the above-described data display method.

[0016] In another aspect, this application provides a computer-readable storage medium storing at least one instruction or at least one program, which is loaded and executed by a processor to implement the above-described data display method.

[0017] The data display method, apparatus, equipment, and storage medium provided in this application have the following technical effects:

[0018] In this application, when a redirection command to the target page is detected, the rendering configuration data corresponding to the target page object in the target page is obtained based on native components, and the page data of the target page is obtained based on web page components. Based on the native components and the rendering configuration data, the target page object is rendered to obtain the rendering result data corresponding to the target page object. Based on the native components and the page data, the display position information corresponding to the target page object is determined. During the page rendering process based on web page components and page data, the rendering result data corresponding to the target page object is displayed on the target page based on the display position information. This enables pre-rendering of the target page object based on native components, improving the efficiency and stability of target page object display and enhancing the flexibility of data display.

[0019] Additional aspects and advantages of this application will be set forth in part in the description which follows, and in part will be obvious from the description, or may be learned by practice of this application. Attached Figure Description

[0020] To more clearly illustrate the technical solutions and advantages in the embodiments of this application or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are only some embodiments of this application. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0021] Figure 1 This is a schematic diagram of an application environment provided in an embodiment of this application;

[0022] Figure 2 This is a flowchart of a data display method provided in an embodiment of this application;

[0023] Figure 3 This is a flowchart of another data display method provided in the embodiments of this application;

[0024] Figure 4 This is a flowchart of another data display method provided in an embodiment of this application;

[0025] Figure 5 This is a flowchart of another data display method provided in an embodiment of this application;

[0026] Figure 6 This is a flowchart of another data display method provided in an embodiment of this application;

[0027] Figure 7 This is a flowchart of another data display method provided in the embodiments of this application;

[0028] Figure 8 This is a schematic diagram of a target page provided in an embodiment of this application;

[0029] Figure 9 This is a flowchart of another data display method provided in the embodiments of this application;

[0030] Figure 10 This is a schematic diagram of a data display device provided in an embodiment of this application;

[0031] Figure 11 This is a hardware structure block diagram of a data display client provided in an embodiment of this application. Detailed Implementation

[0032] The technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, and not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those of ordinary skill in the art without creative effort are within the scope of protection of this application. Examples of the embodiments are shown in the accompanying drawings, wherein the same or similar reference numerals denote the same or similar elements or elements having the same or similar functions throughout.

[0033] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments of this application described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, system, product, or server that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or devices.

[0034] Cloud technology refers to a hosting technology that unifies a series of resources such as hardware, software, and networks within a wide area network or local area network to achieve data computing, storage, processing, and sharing.

[0035] Cloud technology is a collective term for network technologies, information technologies, integration technologies, management platform technologies, and application technologies applied to the cloud computing business model. It can form resource pools, providing flexible and convenient on-demand access. Cloud computing technology will become a crucial support. Backend services of technical network systems require substantial computing and storage resources, such as video websites, image websites, and many portal websites. With the rapid development and application of the internet industry, every item may have its own identification mark in the future, requiring transmission to backend systems for logical processing. Data at different levels will be processed separately, and various industry data will all require robust system support, which can only be achieved through cloud computing.

[0036] As disclosed in this application, the server can be a cloud server.

[0037] It should be noted that all types of data involved in this application (including but not limited to page data, data used for display, and obtained object attribute information) are information and data authorized by the user or fully authorized by all parties.

[0038] Please see Figure 1 , Figure 1 This is a schematic diagram of an application environment provided in an embodiment of this application, such as... Figure 1 As shown, the application environment may include client 01 and server 02.

[0039] In this embodiment, client 01 can run a target application (app). This target application can be a hybrid mobile application, which combines the advantages of native applications (fast running speed, convenient access to underlying client functions) with the advantages of web applications (low development cost, convenient and quick updates) to achieve more flexible and powerful application functions. In other words, a hybrid mobile application includes both native and web components. In practical applications, the target application can include, but is not limited to, news and information applications, lifestyle applications (e.g., medical applications, travel applications, or content sharing applications), video applications, or game applications. In this embodiment, client 01 can include native components and web components. Specifically, native components can be used to support the operation of the native part of the target application, such as calling underlying functions (e.g., camera, Bluetooth functions); web components can be used to support the operation of the web part of the target application, such as sending requests to server 02 to obtain page data to render the page in the application and display the rendering results. In this embodiment, when a jump trigger instruction for a target page is detected, client 01 can obtain rendering configuration data corresponding to the target page object in the target page based on native components, and obtain page data of the target page based on web page components. Then, client 01 can render the target page object based on the native components and the rendering configuration data to obtain rendering result data corresponding to the target page object. Based on the native components and the page data, the display position information corresponding to the target page object is determined. Finally, during the page rendering process of the target page based on the web page components and the page data, client 01 can display the rendering result data corresponding to the target page object in the target page based on the display position information. This achieves priority display of the target page object and improves the efficiency and stability of the target page object display. In one embodiment, the aforementioned client 01 may include, but is not limited to, smartphones, tablets, laptops, desktop computers, smart speakers, smartwatches, in-vehicle terminals, smart TVs, etc.

[0040] In this embodiment, server 02 can be a server that provides background computing and storage services for the target application in client 01. In this embodiment, server 02 can be an independent physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communication, middleware services, domain name services, security services, CDN, and big data and artificial intelligence platforms.

[0041] In addition, it should be noted that, Figure 1 This is merely a schematic diagram of an application environment provided by an embodiment of this application. The client 01 and server 02 described above can be directly or indirectly connected through wired or wireless communication methods, and this application is not limited thereto.

[0042] Figure 2 This is a flowchart illustrating a data display method provided in an embodiment of this application. This specification provides the operational steps of the method described in the embodiments or flowchart, but based on conventional or non-inventive labor, more or fewer operational steps may be included. The order of steps listed in the embodiments is merely one possible execution order among many and does not represent the only possible execution order. In actual system or server product execution, the method can be executed sequentially or in parallel (e.g., in a parallel processor or multi-threaded processing environment) as shown in the embodiments or accompanying drawings. Specifically, as... Figure 2 As shown, the method may include:

[0043] S201: When a redirection command to the target page is detected, the client obtains the rendering configuration data corresponding to the target page object in the target page based on the native component, and obtains the page data of the target page based on the web page component.

[0044] In this embodiment, the target page can be a webpage within a target application, such as an activity details page, user center page, or content display page corresponding to each section within the target application. The target application can include, but is not limited to, news and information applications, lifestyle applications (e.g., medical applications, travel applications, or content sharing applications), video applications, or game applications. Specifically, the aforementioned jump trigger instruction can represent a trigger instruction that will jump to the target page. In an optional embodiment, the jump trigger instruction can be triggered by a control in the preceding page of the target page.

[0045] In this embodiment, the client includes native components and web page components. Native components represent functional components that support the operation of the native portion of the target application, such as calling underlying functions (e.g., camera, Bluetooth). Web page components represent functional components that support the operation of the web page portion of the target application, such as sending requests to the server to obtain page data to render the page in the application and displaying the rendering results. The native portion operates quickly and has low network speed requirements, but its development cost is high, and its versatility is limited, requiring software packages for development and updates. The web page portion has low development cost, high versatility, and rapid updates, but its loading requires high network speed.

[0046] Specifically, the aforementioned target page object can represent the key objects on the target page, such as advertising objects on various pages, traffic information on map navigation pages, and epidemic prevention tips on medical information pages. In practical applications, the target page objects (key objects) on the target page often require high display efficiency and stability. If the display of the target page objects is achieved by rendering the entire target page using page data based on web page components, it is highly dependent on network speed and stability. When the network is poor, the overall loading effect of the target page is poor, and key information cannot be displayed in a timely manner, prolonging the waiting time and greatly affecting the display effect of key information. For example, the prompting effect of the prompt information is affected, and the advertising effect is reduced. In the embodiments of this application, the aforementioned rendering configuration data can represent the configuration information required to render the aforementioned target page object. Specifically, the aforementioned rendering configuration data can include multiple component elements corresponding to the target page object, as well as the relationship information between the multiple component elements (such as the coverage relationship between component elements, the rendering order, etc.). The page data of the target page can represent the structural and style information of the target page. In a specific embodiment, the page data of the target page can be the DOM data of the target page. The client can send a loading request for the target page to the server based on the web page component to obtain the page data of the target page.

[0047] Therefore, this case obtains the rendering configuration data corresponding to the target page object in the target page through the client based on the native component, and obtains the page data of the target page based on the web component. Then, the key object (target page object) can be rendered first based on the native component, and then the rendering result data corresponding to the target page object can be added to the target page and displayed during the page rendering process of the web component based on the page data. This improves the efficiency and stability of the target page object display and enhances the flexibility of data display.

[0048] Step S201 may specifically include S201-A: When a jump trigger instruction for the target page is detected, the client obtains the rendering configuration data corresponding to the target page object in the target page based on the native component; and S201-B: When a jump trigger instruction for the target page is detected, the client obtains the page data of the target page based on the web page component.

[0049] Please see Figure 3 In one specific embodiment, when a redirection trigger instruction for the target page is detected, the client obtaining the rendering configuration data corresponding to the target page object in the target page based on native components may include:

[0050] S301: When a redirection command to the target page is detected, the client obtains the object attribute information of the target page object based on the native component.

[0051] In this embodiment, the object attribute information described above can characterize the feature information of the target page object. Specifically, the object attribute information may include, but is not limited to, the type of the target page object, the links of its constituent elements (e.g., images), the coordinates of the interactive areas in the target page object, the address of the page to which the target page object is redirected after being triggered, the width and height of the target page object, and the identifier of the page in which the target page object is located (i.e., the identifier of the target page). In an optional embodiment, when the target page object is an advertisement object, the object attribute information may include, but is not limited to, the advertisement type of the advertisement object (e.g., carousel advertisement, video advertisement, or single image advertisement), the advertisement slot identifier (used to distinguish different advertisement areas on the same page), the advertisement identifier (used to distinguish different advertisements), the advertisement name, the links of the image elements in the advertisement, the coordinates of the interactive areas in the advertisement object, the width and height of the advertisement, the address of the page to which the advertisement object is redirected after being triggered, and the identifier of the page in which the advertisement is located (i.e., the identifier of the target page).

[0052] In one specific embodiment, the jump trigger instruction for the target page is generated based on the trigger of the target control, which is located in the preceding page of the target page. In an optional embodiment, the target control can be an interactive button in the preceding page. For example, the preceding page can be the homepage of the target application, and the target control can be a "View Details" button in the homepage. When the button is triggered, the jump trigger instruction for the target page is generated, which will jump to the target page. At this time, the target page can be the details page of a preset activity or preset section in the target application.

[0053] Please see Figure 4When a redirection command to the target page is detected, the client can obtain the object attribute information of the target page object based on the native components mentioned above, which may include:

[0054] S401: When a jump trigger instruction based on the target control is detected, the client obtains the control association object data corresponding to the target control based on the above native components.

[0055] Specifically, the aforementioned control-associated object data is obtained by sending a data configuration request for the target control to the server during the page rendering process of the aforementioned front-end page. Then, the client can store the control-associated object data corresponding to the target control returned by the server locally. When a jump trigger instruction based on the target control is detected, the client can read the pre-stored control-associated object data corresponding to the target control from the local storage based on the aforementioned native component.

[0056] In one embodiment, before the client obtains the rendering configuration data corresponding to the target page object in the target page based on the native component, and obtains the page data of the target page based on the web page component, the above method may further include:

[0057] 1) When a jump instruction from the preceding page is detected, the client obtains the page data of the preceding page.

[0058] In this embodiment, the jump instruction of the preceding page can indicate an upcoming jump to the preceding page. The client can send a loading request carrying the page identifier of the preceding page to the server based on the aforementioned web page component. Then, the server can determine the page data of the preceding page based on the page identifier and send it to the client. Specifically, the page data of the preceding page may include the structural information and style information of the preceding page. In a specific embodiment, the page data of the preceding page may be the DOM data of the preceding page.

[0059] 2) During the process of rendering the front page based on the page data of the front page on the client side, a data configuration request for the target control is sent to the server.

[0060] In this embodiment, the target control is located in the front-end page. In an optional embodiment, when the client renders the target control, a data configuration request for the target control can be sent to the server. The data configuration request can carry the identifier of the target control and the type of field to be obtained, such as the type of the target page object associated with the target control, the links of the constituent elements (e.g., images), the coordinate information of the interactive area in the target page object, the identifier of the target page, etc. The server can determine the specific field values ​​and return them to the client.

[0061] 3) The server determines the control association object data corresponding to the target control.

[0062] In this embodiment, the server can determine the corresponding type of data from the target database as the control association object data corresponding to the target control based on the identifier of the target control and the field type requested. Specifically, the target database can be an advertising database or a database of epidemic prevention information, etc. The server can calculate and determine the control association object data corresponding to the target control based on the display requirements and priorities of each data in the database. For example, if an advertisement needs to be displayed 3 times a day and has a high priority, then the attribute information corresponding to the advertisement can be used as the control association object data corresponding to the target control.

[0063] 4) The server sends the data of the control-associated object to the client.

[0064] 5) The client stores the data of the control-associated objects as object attribute information of the target page object locally.

[0065] In this embodiment of the application, the control association data corresponding to the target control is determined by server configuration, which helps to improve the real-time performance and reliability of the control association data configuration, and is also highly efficient.

[0066] S403: The client uses the data of the control-associated object as the object attribute information of the target page object.

[0067] In this embodiment, after the client obtains the control-associated object data corresponding to the target control, it can use it as the object attribute information of the target page object. By pre-determining the control-associated object data corresponding to the target control and storing it locally on the client, when the target control is triggered subsequently, its corresponding control-associated object data can be directly obtained as the object attribute information of the target page object. This allows the client to use the object attribute information of the target page object to send a request to the server to obtain the rendering configuration data corresponding to the target page object. This enables priority rendering of the target page object in the native component, improving the efficiency and stability of data acquisition. Furthermore, the server can flexibly configure the control-associated object data corresponding to the target control based on display requirements.

[0068] S303: The client sends the aforementioned object attribute information to the server based on the aforementioned native components.

[0069] S305: The server performs rendering configuration based on the above object attribute information and generates rendering configuration data corresponding to the above target page object.

[0070] In this embodiment, the server can configure rendering based on the aforementioned object attribute information. For example, it can determine the overall width and height of the target page object, determine the coverage relationship between the constituent elements of the target page object, and calculate the rendering order of multiple constituent elements. Specifically, the rendering configuration data may include multiple constituent elements corresponding to the target page object, as well as the association information between these constituent elements (e.g., the coverage relationship between constituent elements, the rendering order, etc.).

[0071] In an optional embodiment, the server can also perform information verification based on the above-mentioned object attribute information. For example, when the above-mentioned object attribute information includes the address information of the page to which the target page object is redirected after being triggered, the identifier of the page where the target page object is located (i.e., the identifier of the target page), and the link of the constituent elements (e.g., images), the server can respectively verify the address information of the page to which the target page object is redirected after being triggered and the identifier of the page where the target page object is located to determine whether they are valid or changed. If they are invalid or have changed, the server can perform redirection, determine the updated address information or the identifier of the page, and return it to the client along with the rendering configuration data. The server can also determine whether the element resource exists based on the link of the constituent elements (e.g., images), and perform element adaptation (e.g., adjusting the element size) based on the client's device information (e.g., model), generate the binary address for element download, and return it to the client along with the rendering configuration data. This application is not limited to this.

[0072] S307: The client receives the rendering configuration data sent by the server based on the aforementioned native components.

[0073] By obtaining object attribute information of the target page object based on native components on the client side, and sending the object attribute information to the server to enable the server to generate rendering configuration data, the native components can be used flexibly and efficiently to obtain the data required to execute the rendering of the target page object. This enables the priority rendering and display of the target page object, improves the flexibility of data display, and makes the display of key objects in the target page more efficient and stable.

[0074] In one specific embodiment, please refer to Figure 5 When a redirection command to the target page is detected, the client can obtain the rendering configuration data corresponding to the target page object based on the native components, which may include:

[0075] S501: When a redirection command to the target page is detected, the client creates a data processing sub-thread based on the native components mentioned above.

[0076] S503: In the above data processing sub-thread, obtain the rendering configuration data corresponding to the target page object in the above target page.

[0077] In this embodiment, the step of obtaining the rendering configuration data corresponding to the target page object in the target page within the data processing sub-thread is similar to S301-S307, but the step of obtaining the rendering configuration data corresponding to the target page object in the target page is implemented within the data processing sub-thread. For details, please refer to the relevant descriptions in S301-S307, which will not be repeated here. In this embodiment, while obtaining the rendering configuration data corresponding to the target page object in the target page within the data processing sub-thread, the main thread can execute the step of jumping to the target page. The main thread and the data processing sub-thread do not interfere with each other, which helps improve the efficiency of obtaining the rendering configuration data, thereby improving the efficiency of rendering and displaying the target page object. In practical applications, depending on the network environment, when obtaining the rendering configuration data corresponding to the target page object in the data processing sub-thread, it may be during the process of displaying the page jump animation effect, or when the page jump is about to load.

[0078] In this embodiment, when a redirection command to the target page is detected, the client can simultaneously obtain the rendering configuration data corresponding to the target page object based on the native component, and obtain the page data of the target page based on the webpage component. In a specific embodiment, please refer to... Figure 6 The above-mentioned acquisition of page data of the target page based on web page components may include:

[0079] S601: The client sends a loading request for the target page to the server based on the web page component.

[0080] Specifically, the loading request may carry the page identifier information of the target page and the layout parameters corresponding to the target page object. In one embodiment, the page identifier information of the target page may be the URL (Uniform Resource Locator) corresponding to the target page, and the layout parameters corresponding to the target page object may represent the space information required for the target page object to be displayed on the target page, such as the required display width and height. In a specific embodiment, when the target page object is an advertisement object, the layout parameters may be an advertisement slot identifier. The server can determine its corresponding width and height in the configuration file based on the advertisement slot identifier, and then update the layout of the original page data to reserve sufficient space for the display of the target page object. In this embodiment, the layout parameters (e.g., the advertisement slot identifier) ​​may be concatenated into the URL corresponding to the target page to generate a loading request for the target page and send it to the server.

[0081] S603: The server determines the original page data corresponding to the target page based on the above page identification information.

[0082] In this embodiment, the aforementioned original page data can represent the original structural and style information of the target page. Specifically, the original page data may include multiple page nodes and node style data corresponding to each page node. These multiple page nodes include the page node corresponding to the target page object, and the position of this page node is used to subsequently add rendering result information of the target page object. In practical applications, the style information of the page node corresponding to the target page object in the original page data may not match the requirements.

[0083] S605: The server updates the layout of the original page data based on the above layout parameters to obtain the page data of the target page.

[0084] In one specific embodiment, the server can determine the page node corresponding to the target page object in the original page data, and then update the node style data corresponding to the page node based on the above layout parameters, such as adapting the width and height, and adjusting the original display width and height to be consistent with the above layout parameters.

[0085] S607: The client receives the page data sent by the server based on the aforementioned web page components.

[0086] In this embodiment, after the server updates the layout of the original page data, it can send the updated original page data as the page data of the target page to the client. The client can receive the data based on the web page component and render the page based on the page data. By updating the layout of the original page data of the target page based on the layout parameters, the server obtains the page data of the target page and sends it to the web page component on the client, ensuring reliable page data, avoiding data display errors, and improving the reliability of data display effects.

[0087] In practical applications, after a web page component receives the aforementioned page data from the server, it needs to parse the data and then perform overall rendering of the target page (i.e., loading the target page). This process is cumbersome and complex, relies on the network, and requires high network speed. Therefore, this application addresses this issue by having the client obtain the rendering configuration data corresponding to the target page object based on native components when a redirection command is detected. It also obtains the page data of the target page based on the web page component, thereby enabling the native components to prioritize rendering of the target page object and obtain the corresponding rendering result data. This allows the rendering result of the target page object to be displayed preferentially on the target page subsequently. Please continue reading. Figure 2 The above methods may also include:

[0088] S203: The client renders the target page object based on the aforementioned native components and rendering configuration data, and obtains the rendering result data corresponding to the target page object.

[0089] Specifically, the aforementioned rendering result data can indicate the UI (User Interface) object obtained after the target page object is rendered. This UI object can be an interactive object. When the target page object is an advertisement object, the aforementioned rendering result data can be a rendered advertisement view. In this embodiment, the aforementioned rendering configuration data can include multiple component elements corresponding to the target page object, as well as the association information between these multiple component elements (e.g., the overlay relationship between component elements, the rendering order, etc.). The client can use the aforementioned rendering configuration data in the aforementioned native component to render the target page object and obtain the rendering result data corresponding to the target page object. This enables the priority rendering of the target page object, improves the rendering efficiency and stability of the target page object, and thus helps to improve the display efficiency and stability of key objects (target page objects) on the page.

[0090] S205: Based on the aforementioned native components and page data, the client determines the display location information corresponding to the aforementioned target page object.

[0091] In this embodiment, the native component can obtain the page data when the web page component receives the page data sent by the server, and then use the page data to determine the display position information corresponding to the target page object. In this embodiment, the display position information can indicate the addition position of the target page object in the target page; specifically, the display position information can be display coordinates.

[0092] In one specific embodiment, the page data includes multiple page nodes and node style data corresponding to each page node, wherein the node style data may be CSS data. Please refer to [link to relevant documentation]. Figure 7 The client, based on the aforementioned native components and page data, determines the display location information corresponding to the target page object, which may include:

[0093] S701: The client obtains the object identification information corresponding to the target page object based on the above native components.

[0094] In one specific embodiment, when the target page object is an advertisement object, the object identification information corresponding to the target page object can be an advertisement identifier.

[0095] S703: Based on the aforementioned native components, the client determines the target page node that matches the aforementioned object identification information from among the aforementioned multiple page nodes.

[0096] In this embodiment, the multiple page nodes of the aforementioned page data include page nodes corresponding to the target page object. The page nodes corresponding to the target page object can be pre-configured by the server. In a specific embodiment, each page node may include a corresponding node identifier. The client, based on the aforementioned native component, determines the target page node that matches the object identifier information from the multiple page nodes. This can include: the client, based on the aforementioned native component, determines the node whose node identifier matches the object identifier information from the multiple page nodes, and uses this node whose node identifier matches the object identifier information as the target page node.

[0097] S705: The client determines the display position information of the target page object based on the node style data corresponding to the target page node.

[0098] Specifically, the client can use a preset capture function to obtain the node style data corresponding to the target page node, which may specifically be CSS style data. Then, the client can determine the node coordinates based on the CSS values ​​corresponding to the target page node, which will serve as the aforementioned display position information. In a specific embodiment, the initial coordinates of the target page object can be replaced with the aforementioned node coordinates, thereby enabling the subsequent display of the rendering result data on the target page using these node coordinates.

[0099] In an optional embodiment, the node style data can also be parsed to obtain style parsing data corresponding to the node. The style parsing data may include, for example, the spacing between the node and other nodes, and the background color corresponding to the node. Then, the display layout information of the target page object is generated using the style parsing data. The rendering result data is updated according to the display layout information to obtain updated rendering result data, which is then added to the target page. This makes the rendering result data corresponding to the target page object more adaptable to the target page, blends more naturally, and improves the data display effect.

[0100] S207: During the process of rendering the target page on the client side based on the above web page components and the above page data, the rendering result data corresponding to the above target page object is displayed on the target page based on the above display position information.

[0101] In this embodiment, during the rendering of the target page by the client based on the aforementioned web page components and page data, the client can display the rendering result data corresponding to the target page object on the target page based on the aforementioned display location information, thereby realizing the display of the target page object. Due to limitations such as network speed, network stability, and system performance, other objects on the target page have not yet been loaded, thus enabling efficient and stable display of the target page object. It can determine the key objects on the page according to actual needs, improving the display efficiency and reliability of key objects on the page. Combining the rendering results of key objects by native components, the addition and display of key objects are realized during the overall rendering of the web page by the web page components, improving the flexibility of data display.

[0102] In an optional embodiment, JavaScriptCore technology can be used to initialize JSContext, create a context object, call the target method and pass in a preset capture function, use the preset capture function to capture node style data, and leverage JavaScriptCore's ability to interact with JS code and native code to add the rendering result data corresponding to the target page object to the target page. Specifically, the size of the overall page display content can be obtained (not just the display content corresponding to the screen size, but all display content within the scrollable range), and the method function for adding a subview can be called to add the rendering result data of the target page object to the corresponding position in the overall page display content, that is, indirectly add it to WKWebview (the container that hosts the webpage on the client side), so that the target page object can slide together with other page content, instead of being fixed on the screen, which is beneficial to improving the flexibility and reliability of data display.

[0103] Please see Figure 8 , Figure 8 This is a schematic diagram of a target page provided in an embodiment of this application. During the process of rendering the target page on the client based on the aforementioned web page components and page data, after displaying the rendering result data corresponding to the target page object on the target page based on the aforementioned display position information, the display effect of the target page can be referred to... Figure 8 At this point, the rendering result data corresponding to the target page object in the target page (i.e., the prompt information 801 in the figure) has been displayed, while other parts of the target page have not yet been loaded. As a result, the user can view the displayed prompt information 801 first and can interact with it, which ensures the display efficiency and stability of key objects in the target page and improves the flexibility of data display.

[0104] In the embodiments of this application, please refer to Figure 9 The above methods may also include:

[0105] S901: When the client detects an object interaction command triggered based on the above rendering result data, the client obtains the target interaction event corresponding to the object interaction command based on the above web page component.

[0106] In this embodiment of the application, the user can click, swipe, or long-press the interactive area in the rendering result data to generate the object interaction command. Then, the client can capture the target interaction event corresponding to the object interaction command by using the JavaScript element corresponding to the area based on the web page component.

[0107] In an optional embodiment, the page node corresponding to the above rendering result data may include original interaction information. For example, when using an existing webpage to achieve the overlay display of the target page object, the corresponding page node may include original interaction information. The original interaction information can be disabled, and the original jump can be not performed. Then, the target interaction event corresponding to the object interaction instruction captured and triggered by the above webpage component is captured.

[0108] S903: The client sends the target interaction event to the native component based on the above web page component.

[0109] S905: Based on the preset page monitoring object in the above native components, the client sends the target interaction event to the functional module corresponding to the target interaction event.

[0110] Specifically, the functional module corresponding to the target interaction event can be a low-level functional module in the client (such as camera, Bluetooth, player, etc.) or other modules, which can then perform operations such as launching other pages, calling low-level client functions, or jumping to other applications.

[0111] In this embodiment, a JS module table class can be generated in the aforementioned native component and embedded in WKWebview to receive data input from the aforementioned web page component (such as the input of the target interaction event). Then, the target interaction event is input to the aforementioned preset page monitoring object, and the preset page monitoring object distributes the target interaction event to the corresponding functional module.

[0112] In this embodiment, a preset page monitoring object can be created in advance (e.g., when rendering configuration data is received). The preset page monitoring object can be used to realize data and element communication between web page components and native components. Since the web page is loaded through WKWebView, the proxy object of WKWebView can also be set to the above-mentioned preset page monitoring object when the page starts loading, thereby realizing callbacks for monitoring information such as the start of web page loading, the start of receiving messages, and successful or failed loading.

[0113] By obtaining the target interaction event corresponding to the interaction command of the object based on the aforementioned web page component, and sending the target interaction event to the aforementioned native component based on the aforementioned web page component, and then sending the target interaction event to the functional module corresponding to the target interaction event based on the preset page monitoring object in the aforementioned native component, the system can directly interact with the application system using the native component, and can quickly and conveniently call the system's own functions, thereby improving the interaction effect of the target page object.

[0114] In this embodiment, by having the client obtain object attribute information of the target page object based on native components and send the object attribute information to the server to generate rendering configuration data, the client can flexibly and efficiently utilize native components to independently obtain the data required for rendering the target page object. This enables priority rendering and display of the target page object, improving the flexibility of data display and making the display of key objects on the target page more efficient and stable. During the page rendering process of the target page based on the aforementioned web page components and page data, the client displays the rendering result data corresponding to the target page object on the target page based on the aforementioned display position information. This achieves the display of the target page object, enabling efficient and stable display. It allows for the identification of key objects on the page according to actual needs, improving the display efficiency and reliability of key objects. Combined with the rendering results of key objects by native components, the addition and display of key objects are achieved during the overall rendering process of the web page, enhancing the flexibility of data display. By obtaining the target interaction event corresponding to the interaction command of the object based on the aforementioned web page component, and sending the target interaction event to the aforementioned native component based on the aforementioned web page component, and then sending the target interaction event to the functional module corresponding to the target interaction event based on the preset page monitoring object in the aforementioned native component, the system can directly interact with the application system using the native component, and can quickly and conveniently call the system's own functions, thereby improving the interaction effect of the target page object.

[0115] This application also provides an embodiment of a data display device, such as... Figure 10 As shown, the device may include:

[0116] The data acquisition module 1010 is used to acquire the rendering configuration data corresponding to the target page object in the target page based on the native component and to acquire the page data of the target page based on the web page component when a jump trigger instruction of the target page is detected.

[0117] The object rendering module 1020 is used to render the target page object based on the native component and the rendering configuration data to obtain the rendering result data corresponding to the target page object;

[0118] The display position determination module 1030 is used to determine the display position information corresponding to the target page object based on the native component and the page data;

[0119] The data display module 1040 is used to display the rendering result data corresponding to the target page object on the target page based on the display position information during the page rendering process of the target page based on the web page components and the page data.

[0120] In one specific embodiment, the data acquisition module 1010 may include:

[0121] The attribute acquisition unit is used to acquire the object attribute information of the target page object based on the native component when a jump trigger instruction of the target page is detected;

[0122] A rendering configuration unit is used to send the object attribute information to the server based on the native component, so that the server performs rendering configuration based on the object attribute information and generates rendering configuration data corresponding to the target page object.

[0123] A rendering configuration data receiving unit is used to receive the rendering configuration data sent by the server based on the native component.

[0124] In one specific embodiment, the jump trigger instruction of the target page is generated based on the trigger of a target control, and the target control is located in the preceding page of the target page; the aforementioned attribute acquisition unit may include:

[0125] The associated object data receiving unit is used to obtain the control associated object data corresponding to the target control based on the native component when a jump trigger instruction triggered based on the target control is detected. The control associated object data is obtained by sending a data configuration request for the target control to the server during the page rendering process of the front page.

[0126] The attribute determination unit is used to use the control-associated object data as the object attribute information of the target page object.

[0127] In one embodiment, the page data includes multiple page nodes and node style data corresponding to each page node; the aforementioned display position determination module 1030 may include:

[0128] The object identification information acquisition unit is used to acquire the object identification information corresponding to the target page object based on the native component;

[0129] A node matching unit is used to determine, based on the native component, a target page node that matches the object identification information from the plurality of page nodes;

[0130] The location determination unit is used to determine the display location information corresponding to the target page object based on the node style data corresponding to the target page node.

[0131] In one specific embodiment, the data acquisition module 1010 may further include:

[0132] A loading request sending unit is used to send a loading request for the target page to the server based on the web page component. The loading request carries the page identification information of the target page and the layout parameters corresponding to the target page object, so that the server can determine the original page data corresponding to the target page based on the page identification information and update the layout of the original page data based on the layout parameters to obtain the page data of the target page.

[0133] A page data receiving unit is used to receive page data sent by the server based on the web page component.

[0134] In one embodiment, the above-mentioned apparatus may further include:

[0135] The target interaction event acquisition module is used to acquire the target interaction event corresponding to the object interaction instruction based on the web page component when an object interaction instruction triggered based on the rendering result data is detected.

[0136] The event forwarding module is used to send the target interactive event to the native component based on the web page component;

[0137] The event distribution module is used to send the target interaction event to the functional module corresponding to the target interaction event based on the preset page monitoring object in the native component.

[0138] In another embodiment, the data acquisition module 1010 described above may include:

[0139] A sub-thread creation unit is used to create a data processing sub-thread based on the native component when a jump trigger instruction of the target page is detected;

[0140] The sub-thread data acquisition unit is used to acquire rendering configuration data corresponding to the target page object in the target page in the data processing sub-thread.

[0141] The components and method embodiments described in the device embodiments are based on the same application concept.

[0142] This application provides a computer device including a processor and a memory. The memory stores at least one instruction or at least one program, which is loaded and executed by the processor to implement the data display method provided in the above method embodiments.

[0143] Memory can be used to store software programs and modules. The processor executes various functional applications and data processing by running the software programs and modules stored in the memory. Memory can primarily include a program storage area and a data storage area. The program storage area can store the operating system, application programs required for the functions, etc.; the data storage area can store data created based on the use of the device, etc. Furthermore, memory can include high-speed random access memory, and can also include non-volatile memory, such as at least one disk storage device, flash memory device, or other volatile solid-state storage device. Accordingly, memory can also include a memory controller to provide the processor with access to the memory.

[0144] The methods and embodiments provided in this application can be executed on a mobile terminal, computer terminal, server, or similar computing device; that is, the aforementioned computer device may include a mobile terminal, computer terminal, server, or similar computing device. Taking running on a client as an example... Figure 11 This is a hardware structure block diagram of a client for a data display method provided in an embodiment of this application. For example... Figure 11 As shown, this client can be used to implement the data display method provided in the above embodiments. Specifically:

[0145] The aforementioned client may include an RF (Radio Frequency) circuit 1110, a memory 1120 including one or more computer-readable storage media, an input unit 1130, a display unit 1140, a sensor 1150, an audio circuit 1160, a WiFi (Wireless Fidelity) module 1170, a processor 1180 including one or more processing cores, and a power supply 1190, etc. Those skilled in the art will understand that... Figure 11 The client structure shown does not constitute a limitation on the client and may include more or fewer components than illustrated, or combine certain components, or have different component arrangements. Wherein:

[0146] The RF circuit 1110 can be used for receiving and transmitting signals during information transmission or calls. Specifically, it receives downlink information from the base station and hands it over to one or more processors 1180 for processing; additionally, it transmits uplink data to the base station. Typically, the RF circuit 1110 includes, but is not limited to, an antenna, at least one amplifier, a tuner, one or more oscillators, a Subscriber Identity Module (SIM) card, a transceiver, a coupler, an LNA (Low Noise Amplifier), a duplexer, etc. Furthermore, the RF circuit 1110 can also communicate wirelessly with networks and other clients. The wireless communication can use any communication standard or protocol, including but not limited to GSM (Global System for Mobile Communication), GPRS (General Packet Radio Service), CDMA (Code Division Multiple Access), WCDMA (Wideband Code Division Multiple Access), LTE (Long Term Evolution), email, SMS (Short Messaging Service), etc.

[0147] The memory 1120 can be used to store software programs and modules. The processor 1180 executes various functional applications and data processing by running the software programs and modules stored in the memory 1120. The memory 1120 may mainly include a program storage area and a data storage area. The program storage area may store the operating system, application programs required for the functions, etc.; the data storage area may store data created according to the use of the client, etc. In addition, the memory 1120 may include high-speed random access memory, and may also include non-volatile memory, such as at least one disk storage device, flash memory device, or other volatile solid-state storage device. Accordingly, the memory 1120 may also include a memory controller to provide access to the memory 1120 by the processor 1180 and the input unit 1130.

[0148] Input unit 1130 can be used to receive input numerical or character information, and generate keyboard, mouse, joystick, optical, or trackball signal inputs related to user settings and function control. Specifically, input unit 1130 may include touch-sensitive surface 1131 and other input devices 1132. Touch-sensitive surface 1131, also known as a touch display screen or touchpad, can collect touch operations by the user on or near it (such as operations by the user using a finger, stylus, or any suitable object or accessory on or near the touch-sensitive surface 1131), and drive the corresponding connection device according to a pre-set program. Optionally, touch-sensitive surface 1131 may include two parts: a touch detection device and a touch controller. The touch detection device detects the user's touch position and the signal generated by the touch operation, and transmits the signal to the touch controller; the touch controller receives touch information from the touch detection device, converts it into touch point coordinates, sends it to processor 1180, and can receive and execute commands from processor 1180. In addition, the touch-sensitive surface 1131 can be implemented using various types such as resistive, capacitive, infrared, and surface acoustic wave. Besides the touch-sensitive surface 1131, the input unit 1130 may also include other input devices 1132. Specifically, other input devices 1132 may include, but are not limited to, one or more of the following: a physical keyboard, function keys (such as volume control buttons, power buttons, etc.), a trackball, a mouse, and a joystick.

[0149] Display unit 1140 can be used to display information input by the user or information provided to the user, as well as various graphical user interfaces of the client. These graphical user interfaces can be composed of graphics, text, icons, videos, and any combination thereof. Display unit 1140 may include display panel 1141, which may optionally be configured as an LCD (Liquid Crystal Display), OLED (Organic Light-Emitting Diode), or similar form. Further, touch-sensitive surface 1131 may cover display panel 1141. When touch-sensitive surface 1131 detects a touch operation on or near it, it transmits the information to processor 1180 to determine the type of touch event. Subsequently, processor 1180 provides corresponding visual output on display panel 1141 according to the type of touch event. Touch-sensitive surface 1131 and display panel 1141 can be two independent components to implement input and output functions. However, in some embodiments, touch-sensitive surface 1131 and display panel 1141 can be integrated to achieve input and output functions.

[0150] The client may also include at least one sensor 1150, such as a light sensor, a motion sensor, and other sensors.

[0151] Audio circuitry 1160, speaker 1161, and microphone 1162 provide an audio interface between the user and the client.

[0152] WiFi is a short-range wireless transmission technology. The client, through the WiFi module 1170, can help users send and receive emails, browse web pages, and access streaming media, providing users with wireless broadband internet access. Although Figure 11 WiFi module 1170 is shown, but it is understood that it is not a necessary component of the aforementioned client and can be omitted as needed without changing the nature of the application.

[0153] The processor 1180 is the control center of the client, connecting various parts of the client through various interfaces and lines. It executes software programs and / or modules stored in the memory 1120, and calls data stored in the memory 1120 to perform various functions and process data, thereby enabling overall monitoring of the client. Optionally, the processor 1180 may include one or more processing cores; preferably, the processor 1180 may integrate an application processor and a modem processor, wherein the application processor mainly handles the operating system, user interface, and applications, and the modem processor mainly handles wireless communication. It is understood that the modem processor may not be integrated into the processor 1180.

[0154] The client also includes a power supply 1190 (such as a battery) to power various components. Preferably, the power supply can be logically connected to the processor 1180 through a power management system, thereby enabling functions such as charging, discharging, and power consumption management through the power management system. The power supply 1190 may also include one or more DC or AC power supplies, recharging systems, power fault detection circuits, power converters or inverters, power status indicators, and other arbitrary components.

[0155] Although not shown, the client may also include a camera, Bluetooth module, etc., which will not be described in detail here. Specifically, in this embodiment, the display unit of the client is a touch screen display, and the client also includes a memory and one or more programs, one or more of which are stored in the memory and configured to be executed by one or more processors of the instructions in the method embodiments of this application.

[0156] Embodiments of this application also provide a computer-readable storage medium, which can be disposed in a server to store at least one instruction or at least one program related to implementing a data display method in the method embodiments. The at least one instruction or the at least one program is loaded and executed by the processor to implement the data display method provided in the above method embodiments.

[0157] Optionally, in this embodiment, the storage medium may be located at at least one of the multiple network servers in a computer network. Optionally, in this embodiment, the storage medium may include, but is not limited to, various media capable of storing program code, such as USB flash drives, read-only memory (ROM), random access memory (RAM), portable hard drives, magnetic disks, or optical disks.

[0158] Embodiments of this application also provide a computer program product or computer program that includes computer instructions stored in a computer-readable storage medium. A processor of a computer device reads the computer instructions from the computer-readable storage medium and executes the computer instructions, causing the computer device to perform the methods provided in the various optional implementations described above.

[0159] As can be seen from the embodiments of the data display method, apparatus, computer equipment, storage medium, or computer program provided in this application, this application obtains object attribute information of the target page object based on native components by the client, and sends the object attribute information to the server to enable the server to generate rendering configuration data. This allows for flexible and efficient use of native components to obtain the data required for rendering the target page object, thereby achieving priority rendering and display of the target page object, improving the flexibility of data display, and making the display of key objects in the target page more efficient and stable. During the page rendering process of the target page by the client based on the aforementioned web page components and page data, the rendering result data corresponding to the target page object is displayed on the target page based on the aforementioned display position information, realizing the display of the target page object. This achieves efficient and stable display of the target page object, allows for the determination of key objects in the page according to actual needs, improves the display efficiency and reliability of key objects in the page, and combines the rendering results of key objects by native components to achieve the addition and display of key objects during the overall rendering process of the web page, thus improving the flexibility of data display. By obtaining the target interaction event corresponding to the interaction command of the object based on the aforementioned web page component, and sending the target interaction event to the aforementioned native component based on the aforementioned web page component, and then sending the target interaction event to the functional module corresponding to the target interaction event based on the preset page monitoring object in the aforementioned native component, the system can directly interact with the application system using the native component, and can quickly and conveniently call the system's own functions, thereby improving the interaction effect of the target page object.

[0160] It should be noted that the order of the embodiments described above is merely for descriptive purposes and does not represent the superiority or inferiority of the embodiments. Furthermore, specific embodiments have been described above. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps described in the claims can be performed in a different order than that shown in the embodiments and still achieve the desired result. Additionally, the processes depicted in the drawings do not necessarily require a specific or sequential order to achieve the desired result. In some embodiments, multitasking and parallel processing are also possible or may be advantageous.

[0161] The various embodiments in this specification are described in a progressive manner. Similar or identical parts between embodiments can be referred to mutually. Each embodiment focuses on describing the differences from other embodiments. In particular, the embodiments of apparatus, devices, and storage media are basically similar to the method embodiments, so the descriptions are relatively simple; relevant parts can be referred to the descriptions of the method embodiments.

[0162] Those skilled in the art will understand that all or part of the steps of the above embodiments can be implemented by hardware or by a program instructing related hardware. The program can be stored in a computer-readable storage medium, such as a read-only memory, a disk, or an optical disk.

[0163] The above description is only a preferred embodiment of this application and is not intended to limit this application. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of this application should be included within the protection scope of this application.

Claims

1. A data display method, characterized in that, The method includes: When a jump trigger command for the target page is detected, the rendering configuration data corresponding to the target page object in the target page is obtained based on the native component, and the page data of the target page is obtained based on the web component. The target page is a page in a hybrid mode mobile application, and the hybrid mode mobile application is run by the native component and the web component. Based on the native component and the rendering configuration data, the target page object is rendered to obtain the rendering result data corresponding to the target page object; Based on the native components and the page data, determine the display position information corresponding to the target page object; During the overall rendering of the target page based on the web page components and the page data, while other parts have not yet been fully loaded, the rendering result data corresponding to the target page object is displayed on the target page based on the display position information. The other parts are the parts of the target page other than the target page object. The native component has a lower dependence on the network than the web page component.

2. The method according to claim 1, characterized in that, When a redirection command to the target page is detected, obtaining the rendering configuration data corresponding to the target page object in the target page based on the native component includes: When a jump trigger command for the target page is detected, the object attribute information of the target page object is obtained based on the native component; Based on the native component, the object attribute information is sent to the server so that the server can perform rendering configuration based on the object attribute information and generate rendering configuration data corresponding to the target page object. The native component receives the rendering configuration data sent by the server.

3. The method according to claim 2, characterized in that, The jump trigger instruction for the target page is generated based on the trigger of the target control, which is located in the preceding page of the target page; When a redirection command to the target page is detected, obtaining the object attribute information of the target page object based on the native component includes: When a jump trigger instruction based on the target control is detected, the control association object data corresponding to the target control is obtained based on the native component. The control association object data is obtained by sending a data configuration request for the target control to the server during the page rendering process of the front page. The control-associated object data is used as the object attribute information of the target page object.

4. The method according to claim 1, characterized in that, The page data includes multiple page nodes and node style data corresponding to each page node; The step of determining the display position information corresponding to the target page object based on the native component and the page data includes: Based on the native component, obtain the object identification information corresponding to the target page object; Based on the native component, a target page node that matches the object identification information is determined from the plurality of page nodes; Based on the node style data corresponding to the target page node, determine the display position information corresponding to the target page object.

5. The method according to claim 1, characterized in that, The process of obtaining page data of the target page based on web page components includes: The web page component sends a loading request for the target page to the server. The loading request carries the page identification information of the target page and the layout parameters corresponding to the target page object, so that the server can determine the original page data corresponding to the target page based on the page identification information and update the layout of the original page data based on the layout parameters to obtain the page data of the target page. The web page component receives the page data sent by the server.

6. The method according to any one of claims 1-5, characterized in that, The method further includes: When an object interaction command triggered based on the rendered result data is detected, the target interaction event corresponding to the object interaction command is obtained based on the web page component; The target interactive event is sent to the native component based on the web page component; Based on the preset page monitoring object in the native component, the target interaction event is sent to the functional module corresponding to the target interaction event.

7. The method according to any one of claims 1-5, characterized in that, When a redirection command to the target page is detected, obtaining the rendering configuration data corresponding to the target page object in the target page based on the native component includes: When a redirection command to the target page is detected, a data processing sub-thread is created based on the native component; In the data processing sub-thread, the rendering configuration data corresponding to the target page object in the target page is obtained.

8. A data display device, characterized in that, The device includes: The data acquisition module is used to acquire rendering configuration data corresponding to the target page object in the target page based on the native component and page data of the target page based on the web component when a jump trigger instruction of the target page is detected. The target page is a page in a hybrid mode mobile application, and the hybrid mode mobile application is run by the native component and the web component. The object rendering module is used to render the target page object based on the native component and the rendering configuration data to obtain the rendering result data corresponding to the target page object; The display location determination module is used to determine the display location information corresponding to the target page object based on the native component and the page data; The data display module is used to display the rendering result data corresponding to the target page object on the target page based on the display position information during the overall rendering of the target page based on the web page components and the page data, when other parts have not yet been loaded. The other parts are the parts of the target page other than the target page object. The native component has a lower dependence on the network than the web page component.

9. The apparatus according to claim 8, characterized in that, The data acquisition module includes: The attribute acquisition unit is used to acquire the object attribute information of the target page object based on the native component when a jump trigger instruction of the target page is detected; A rendering configuration unit is used to send the object attribute information to the server based on the native component, so that the server performs rendering configuration based on the object attribute information and generates rendering configuration data corresponding to the target page object. A rendering configuration data receiving unit is used to receive the rendering configuration data sent by the server based on the native component.

10. The apparatus according to claim 9, characterized in that, The jump trigger instruction for the target page is generated based on the trigger of the target control, which is located in the preceding page of the target page; The attribute acquisition unit includes: The associated object data receiving unit is used to obtain the control associated object data corresponding to the target control based on the native component when a jump trigger instruction triggered based on the target control is detected. The control associated object data is obtained by sending a data configuration request for the target control to the server during the page rendering process of the front page. The attribute determination unit is used to use the control-associated object data as the object attribute information of the target page object.

11. The apparatus according to claim 8, characterized in that, The page data includes multiple page nodes and node style data corresponding to each page node; The display location determination module includes: The object identification information acquisition unit is used to acquire the object identification information corresponding to the target page object based on the native component; A node matching unit is used to determine, based on the native component, a target page node that matches the object identification information from the plurality of page nodes; The location determination unit is used to determine the display location information corresponding to the target page object based on the node style data corresponding to the target page node.

12. The apparatus according to claim 8, characterized in that, The data acquisition module further includes: A loading request sending unit is used to send a loading request for the target page to the server based on the web page component. The loading request carries the page identification information of the target page and the layout parameters corresponding to the target page object, so that the server can determine the original page data corresponding to the target page based on the page identification information and update the layout of the original page data based on the layout parameters to obtain the page data of the target page. A page data receiving unit is used to receive page data sent by the server based on the web page component.

13. The apparatus according to any one of claims 8-12, characterized in that, The device further includes: The target interaction event acquisition module is used to acquire the target interaction event corresponding to the object interaction instruction based on the web page component when an object interaction instruction triggered based on the rendering result data is detected. The event forwarding module is used to send the target interactive event to the native component based on the web page component; The event distribution module is used to send the target interaction event to the functional module corresponding to the target interaction event based on the preset page monitoring object in the native component.

14. The apparatus according to any one of claims 8-12, characterized in that, The data acquisition module further includes: A sub-thread creation unit is used to create a data processing sub-thread based on the native component when a jump trigger instruction of the target page is detected; The sub-thread data acquisition unit is used to acquire rendering configuration data corresponding to the target page object in the target page in the data processing sub-thread.

15. A data display device, characterized in that, The device includes a processor and a memory, the memory storing at least one instruction or at least one program, the at least one instruction or the at least one program being loaded and executed by the processor to implement the data display method as described in any one of claims 1 to 7.

16. A computer-readable storage medium, characterized in that, The storage medium stores at least one instruction or at least one program segment, which is loaded and executed by a processor to implement the data display method as described in any one of claims 1 to 7.

17. A computer program product comprising computer instructions loaded and executed by a processor to implement the data display method as described in any one of claims 1 to 7.

Images