Web client interface rendering and display methods, electronic devices, storage media and program products

By combining device performance testing and pre-trained rendering strategy models in the background thread of the webpage, the rendering strategy of the webpage client interface is dynamically optimized, which solves the display lag problem, improves the interface rendering efficiency and user experience, and avoids the risk of privacy leakage.

CN122309872APending Publication Date: 2026-06-30DAWNING INT INFORMATION IND CO LTD

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
DAWNING INT INFORMATION IND CO LTD
Filing Date
2026-03-13
Publication Date
2026-06-30

AI Technical Summary

Technical Problem

In existing technologies, web client interfaces suffer from display lag, especially when there are significant differences in user device performance and a wide variety of application scenarios, resulting in excessive rendering pressure and affecting user experience.

Method used

By performing device performance tests in the background thread of the webpage, target performance evaluation results are generated. Then, a pre-trained rendering strategy model is used to generate rendering strategy data based on user operation data, which guides the main thread of the webpage to render the client interface, optimizes resource allocation and rendering strategy, and avoids the main thread being passively responding.

Benefits of technology

It enables dynamic adaptation of user device performance evaluation and rendering strategies, improving interface rendering efficiency and user operation response speed, solving display lag issues, and avoiding the risk of user privacy leakage.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN122309872A_ABST
    Figure CN122309872A_ABST
Patent Text Reader

Abstract

This application provides a method for rendering and displaying the client interface of a web client, an electronic device, a storage medium, and a program product. By responding to a web client startup command, a web background thread is created; the web background thread performs device performance testing based on user operation data to generate a target performance evaluation result; the web background thread inputs the target performance evaluation result and user historical operation data into a pre-trained rendering strategy model to generate rendering strategy data; the web background thread sends the rendering strategy data to the web main thread, so that the web main thread renders the client interface to be displayed according to the rendering strategy data to obtain the rendered client interface, enabling the display unit of the terminal device to display the rendered client interface. This solves the problem of display lag in web client interfaces caused by existing solutions.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This application relates to the field of web client technology, and in particular to a web client interface rendering and display method, electronic device, storage medium and program product. Background Technology

[0002] In today's complex web application development and deployment environment, user devices exhibit significant performance differences (e.g., mobile devices, low-end PCs, high-end servers), and the diversity of application scenarios (e.g., data visualization, real-time collaboration, AI interaction) places higher demands on front-end performance. For example, in big data chart display scenarios in the financial industry, users may need to simultaneously manipulate complex charts involving multiple interconnected canvases, while low-end devices may experience lag or even crashes due to excessive rendering pressure; in remote diagnostic systems in the medical industry, the real-time rendering of high-precision medical images may affect diagnostic efficiency due to insufficient device performance.

[0003] In existing technologies, APM tools are typically run in the main thread to collect user operation data (such as click and swipe frequency), resource utilization (memory, CPU), and rendering performance metrics (FPS, frame rate) in real time to render and display the client interface of a web page client.

[0004] However, existing solutions have resulted in display lag issues on web client interfaces. Summary of the Invention

[0005] The web client interface rendering and display method, electronic device, storage medium, and program product provided in this application are used to solve the problem of display lag in the web client interface caused by the prior art.

[0006] In a first aspect, embodiments of this application provide a method for rendering and displaying a client interface of a web client, comprising: in response to a web client startup command, creating a web background thread; using the web background thread to perform device performance testing based on user operation data, generating a target performance evaluation result; using the web background thread to input the target performance evaluation result and user historical operation data into a pre-trained rendering strategy model to generate rendering strategy data; and sending the rendering strategy data to the web main thread through the web background thread, so that the web main thread renders the client interface to be displayed according to the rendering strategy data to obtain a rendered client interface, so that the display unit of the terminal device displays the rendered client interface.

[0007] In this application, a webpage background thread is created in response to the webpage client's startup command. This background thread performs device performance testing based on user operation data, generating a target performance evaluation result. The background thread then inputs the target performance evaluation result and historical user operation data into a pre-trained rendering strategy model to generate rendering strategy data. Finally, the background thread sends the rendering strategy data to the main webpage thread, enabling the main thread to render the client interface to be displayed, resulting in a rendered client interface that is then displayed on the terminal device's display unit. This solution completes device performance evaluation, user behavior prediction, and rendering strategy adjustment locally on the computer device, solving the problem of the main thread passively responding to display the client interface. This addresses the display lag issues inherent in existing solutions and avoids the risk of user privacy theft and leakage associated with cloud-based monitoring.

[0008] Optionally, in the method described above, the device performance test includes a CPU computing power test, a graphics processing unit (GPU) rendering power test, and a memory read / write performance test. The step of using the webpage background thread to perform the device performance test based on user operation data and generate a target performance evaluation result includes: using the webpage background thread to perform the CPU computing power test based on the user operation data and generate a CPU performance evaluation result; using the webpage background thread to perform the GPU rendering power test based on the user operation data and generate a GPU performance evaluation result; using the webpage background thread to perform the memory read / write performance test based on the user operation data and generate a memory performance evaluation result; and weighting and quantizing the CPU performance evaluation result, the GPU performance evaluation result, and the memory performance evaluation result based on the user operation data to generate the target performance evaluation result.

[0009] This application achieves a comprehensive evaluation of computer device performance by refining the testing dimensions (CPU, GPU, and memory). For example, in a financial charting system, CPU computing power testing determines whether the computer device can support high-frequency data processing, GPU rendering power testing determines whether the computer device can smoothly render complex charts, and memory read / write performance testing determines whether the computer device may crash due to insufficient memory. This multi-dimensional testing and evaluation provides accurate data references for the subsequent generation of rendering strategy data, improving the computer device's performance adaptability in complex demand environments.

[0010] Optionally, in the method described above, the step of using the webpage background thread to perform device performance testing based on user operation data and generate a target performance evaluation result includes: using the webpage background thread to perform basic device performance testing based on the user operation data and generate a basic performance evaluation result; determining a performance test time based on the user operation data and the basic performance evaluation result; performing device performance testing based on the user operation data and the performance test time and generating a target performance evaluation result; and re-determining the target performance evaluation result as a basic performance evaluation result to return to the step of determining the performance test time based on the user operation data and the basic performance evaluation result.

[0011] In this application, basic device performance testing is performed based on user operation data through a background thread of the webpage, generating basic performance evaluation results. This allows for an initial assessment of device capabilities without interfering with front-end interaction. Determining the performance testing time by combining user operation data and basic performance results avoids peak user operation periods, preventing resource consumption and impacting the user experience. Furthermore, within the determined performance testing time, tests are performed on the target processor's computing power, graphics processor's rendering power, and memory read / write performance based on user operation characteristics. This yields target performance evaluation results that align with actual usage scenarios, improving the accuracy, adaptability, and reliability of the performance evaluation and providing accurate data support for determining subsequent rendering strategy data.

[0012] Optionally, in the method described above, determining the performance test time based on the user operation data and the basic performance evaluation result includes: determining the sliding window length based on the user operation data; performing a sliding window evaluation on the basic performance evaluation result based on the sliding window length to obtain the device performance variation degree under the sliding window length; determining the relationship between the device performance variation degree and a preset performance variation degree threshold; if the device performance variation degree is greater than or equal to the preset performance variation degree threshold, then determining the current time as the performance test time; if the device performance variation degree is less than the preset performance variation degree threshold, then returning to the step of using the webpage background thread to perform basic device performance testing based on the user operation data and generate basic performance evaluation results, and determining the performance test time according to a preset time interval.

[0013] In this application, the length of the sliding window is determined by user operation data, ensuring that the performance evaluation closely matches the actual operating characteristics of users and avoiding evaluation bias caused by unreasonable window settings. The sliding window dynamically monitors the degree of device performance change, accurately capturing performance fluctuations and solving the problem that static evaluation cannot detect performance anomalies in a timely manner. The performance testing time is determined by comparing the degree of device performance change with a preset performance change threshold. This allows for timely testing when device performance fluctuations are large, ensuring that the test results reflect the true performance of the device. Simultaneously, it avoids blind testing when device performance fluctuations are small through cyclical monitoring, preventing interference with user operations. This approach balances the accuracy and timeliness of performance testing with the user experience, providing an accurate time basis for subsequent device performance testing.

[0014] Optionally, in the method described above, the pre-trained rendering strategy model includes a sampling ratio matching model, a time series prediction model, a graph neural network model, and a rendering strategy data generation model; the step of inputting the target performance evaluation result and user historical operation data into the pre-trained rendering strategy model to generate rendering strategy data includes: using the webpage background thread to input the target performance evaluation result into the sampling ratio matching model to output global sampling ratio data; using the webpage background thread to input the user historical operation data into the time series prediction model to output user operation prediction time; using the webpage background thread to input the user historical operation data into the graph neural network model to output user operation prediction region; and using the webpage background thread to input the global sampling ratio data, the user operation prediction time, and the user operation prediction region into the rendering strategy data generation model to output the rendering strategy data.

[0015] In this application, user operation prediction results (user operation prediction time and user operation prediction region) are generated through a time series prediction model and a graph neural network model. Combined with the global sampling ratio data output by the sampling ratio matching model, the rendering strategy data generation model outputs rendering strategy data based on the global sampling ratio data, user operation prediction time, and user operation prediction region. This rendering strategy data includes region division and the configuration of corresponding sampling ratios for different regions. This improves the interface rendering efficiency and user operation response speed without blocking the main thread of the webpage, and solves the problem of display lag in the client interface of the webpage client caused by the existing technology.

[0016] Optionally, in the method described above, the step of using the webpage background thread to input the global sampling ratio data, the user operation prediction time, and the user operation prediction region into the rendering strategy data generation model and outputting the rendering strategy data includes: using the webpage background thread to input the global sampling ratio data, the user operation prediction time, and the user operation prediction region into the rendering strategy data generation model; using the rendering strategy data generation model to divide the client interface to be displayed into a target rendering region and a non-target rendering region according to the user operation prediction region; and using the rendering strategy data generation model to adjust the global sampling ratio data, the user operation prediction time, and the user operation prediction region according to the user operation prediction time. The global sampling ratio data is updated to obtain updated global sampling ratio data. The rendering strategy data generation model is used to determine the region sampling ratio corresponding to the target rendering region based on the updated global sampling ratio data and the target rendering region. The rendering strategy data generation model is also used to determine the region sampling ratio corresponding to the non-target rendering region based on the updated global sampling ratio data and the region size of the non-target rendering region. Finally, the rendering strategy data generation model is used to summarize the target rendering region, the region sampling ratio corresponding to the target rendering region, the non-target rendering region, and the region sampling ratio corresponding to the non-target rendering region to obtain and output the rendering strategy data.

[0017] In this application, the target rendering area, the region sampling ratio corresponding to the target rendering area, the non-target rendering area, and the region sampling ratio corresponding to the non-target rendering area are determined by using a rendering strategy data generation model. This achieves the priority of using a high sampling ratio to render the target rendering area that the user will operate on, and fast loading of the non-target rendering area by using a low sampling ratio, thus ensuring the overall smoothness and display effect.

[0018] Optionally, in the method described above, determining the region sampling ratio corresponding to the target rendering region based on the updated global sampling ratio data and the target rendering region includes: performing layer separation on the target rendering region to obtain at least two target rendering region layers; determining the layer rendering priority of each target rendering region layer based on its layer type; determining the layer region sampling ratio of each target rendering region layer based on the updated global sampling ratio data, the region size of the target rendering region, and the layer rendering priority of each target rendering region layer; and summing the layer region sampling ratios of each target rendering region layer to obtain the region sampling ratio corresponding to the target rendering region.

[0019] In this application, rendering priorities are divided through a layer separation strategy, thereby enabling precise allocation of rendering resources by setting differentiated layer area sampling ratios, which ensures the rendering effect of core content and overall rendering efficiency.

[0020] Optionally, in the method described above, after the rendered client interface is displayed on the display unit of the terminal device, the method further includes: obtaining the actual user operation time; calculating the difference between the actual user operation time and the predicted user operation time to obtain a prediction time deviation; incrementally updating the model parameters of the time series prediction model based on the prediction time deviation to obtain an updated time series prediction model; re-determining the updated time series prediction model as a time series prediction model to return to the step of using the webpage background thread to input the user's historical operation data into the time series prediction model and output the predicted user operation time; and / or, obtaining the actual user operation area; calculating the distance between the regional centers of the actual user operation area and the predicted user operation area to obtain a prediction area deviation; updating the model parameters of the graph neural network model based on the prediction area deviation to obtain an updated graph neural network model; re-determining the updated graph neural network model as a graph neural network model to return to the step of using the webpage background thread to input the user's historical operation data into the graph neural network model and output the predicted user operation area.

[0021] In this application, based on the deviation between the user's actual operation and the prediction result (such as the deviation between the prediction area and the actual operation area), the incremental correction of the time series prediction model and / or graph neural network model is triggered. Under the condition of limited computer equipment resources, the model is updated so that the prediction results output by the updated time series prediction model and / or the updated graph neural network model in subsequent calls are closer to the user's actual operation.

[0022] Secondly, embodiments of this application provide a client interface rendering and display device for a web page client, comprising:

[0023] Create a module to create a background thread for the webpage in response to the webpage client's startup command;

[0024] The processing module is used to perform device performance testing based on user operation data using the webpage background thread, and generate target performance evaluation results; and to input the target performance evaluation results and user historical operation data into a pre-trained rendering strategy model using the webpage background thread to generate rendering strategy data.

[0025] The sending module is used to send the rendering strategy data to the main thread of the webpage through the background thread of the webpage, so that the main thread of the webpage can render the client interface to be displayed according to the rendering strategy data to obtain the rendered client interface, so that the display unit of the terminal device can display the rendered client interface.

[0026] Optionally, in the apparatus described above, the device performance test includes a central processing unit (CPU) computing power test, a graphics processing unit (GPU) rendering power test, and a memory read / write performance test. When the processing module uses the webpage background thread to perform the device performance test based on user operation data and generate a target performance evaluation result, it specifically performs the following: uses the webpage background thread to perform the CPU computing power test based on the user operation data and generates a CPU performance evaluation result; uses the webpage background thread to perform the GPU rendering power test based on the user operation data and generates a GPU performance evaluation result; uses the webpage background thread to perform the memory read / write performance test based on the user operation data and generates a memory performance evaluation result; and performs a weighted quantization of the CPU performance evaluation result, the GPU performance evaluation result, and the memory performance evaluation result based on the user operation data to generate the target performance evaluation result.

[0027] Optionally, in the apparatus described above, when the processing module uses the webpage background thread to perform device performance testing based on user operation data and generate a target performance evaluation result, it is specifically configured to: use the webpage background thread to perform basic device performance testing based on the user operation data and generate a basic performance evaluation result; determine the performance test time based on the user operation data and the basic performance evaluation result; perform device performance testing based on the user operation data and the performance test time and generate a target performance evaluation result; re-determine the target performance evaluation result as a basic performance evaluation result, so as to return to the step of determining the performance test time based on the user operation data and the basic performance evaluation result.

[0028] Optionally, in the apparatus described above, when the processing module determines the performance test time based on the user operation data and the basic performance evaluation result, it specifically performs the following steps: determining the sliding window length based on the user operation data; performing a sliding window evaluation on the basic performance evaluation result based on the sliding window length to obtain the device performance variation degree under the sliding window length; determining the relationship between the device performance variation degree and a preset performance variation degree threshold; if the device performance variation degree is greater than or equal to the preset performance variation degree threshold, then determining the current time as the performance test time; if the device performance variation degree is less than the preset performance variation degree threshold, then returning to the step of using the webpage background thread to perform basic device performance testing based on the user operation data and generate basic performance evaluation results, and determining the performance test time according to a preset time interval.

[0029] Optionally, in the apparatus described above, the pre-trained rendering strategy model includes a sampling ratio matching model, a time series prediction model, a graph neural network model, and a rendering strategy data generation model. When the processing module inputs the target performance evaluation result and user historical operation data into the pre-trained rendering strategy model to generate rendering strategy data, it specifically performs the following: inputting the target performance evaluation result into the sampling ratio matching model using the webpage background thread to output global sampling ratio data; inputting the user historical operation data into the time series prediction model using the webpage background thread to output user operation prediction time; inputting the user historical operation data into the graph neural network model using the webpage background thread to output user operation prediction region; and inputting the global sampling ratio data, the user operation prediction time, and the user operation prediction region into the rendering strategy data generation model using the webpage background thread to output the rendering strategy data.

[0030] Optionally, in the apparatus described above, when the processing module inputs the global sampling ratio data, the user operation prediction time, and the user operation prediction region into the rendering strategy data generation model using the webpage background thread, and outputs the rendering strategy data, it is specifically configured to: input the global sampling ratio data, the user operation prediction time, and the user operation prediction region into the rendering strategy data generation model using the webpage background thread; divide the client interface to be displayed into a target rendering region and a non-target rendering region according to the user operation prediction region using the rendering strategy data generation model; and, according to the user operation prediction time, process the rendering strategy data... The global sampling ratio data is updated to obtain updated global sampling ratio data; the rendering strategy data generation model is used to determine the region sampling ratio corresponding to the target rendering region based on the updated global sampling ratio data and the target rendering region; the rendering strategy data generation model is used to determine the region sampling ratio corresponding to the non-target rendering region based on the updated global sampling ratio data and the region size of the non-target rendering region; the rendering strategy data generation model is used to summarize the target rendering region, the region sampling ratio corresponding to the target rendering region, the non-target rendering region, and the region sampling ratio corresponding to the non-target rendering region to obtain and output the rendering strategy data.

[0031] Optionally, in the apparatus described above, when the processing module determines the region sampling ratio corresponding to the target rendering region based on the updated global sampling ratio data and the target rendering region, it is specifically configured to: perform layer separation on the target rendering region to obtain at least two target rendering region layers; determine the layer rendering priority of each target rendering region layer based on the layer type of each target rendering region layer; determine the layer region sampling ratio of each target rendering region layer based on the updated global sampling ratio data, the region size of the target rendering region, and the layer rendering priority of each target rendering region layer; and summarize the layer region sampling ratios of each target rendering region layer to obtain the region sampling ratio corresponding to the target rendering region.

[0032] Optionally, in the apparatus described above, after the rendered client interface is displayed on the display unit of the terminal device, the client interface rendering and display device of the web client is further configured to: obtain the actual user operation time; calculate the difference between the actual user operation time and the predicted user operation time to obtain the prediction time deviation; incrementally update the model parameters of the time series prediction model according to the prediction time deviation to obtain an updated time series prediction model; re-determine the updated time series prediction model as a time series prediction model to return to the step of using the web background thread to input the user's historical operation data into the time series prediction model and output the predicted user operation time; and / or, obtain the actual user operation area; calculate the distance between the regional centers of the actual user operation area and the predicted user operation area to obtain the prediction area deviation; update the model parameters of the graph neural network model according to the prediction area deviation to obtain an updated graph neural network model; re-determine the updated graph neural network model as a graph neural network model to return to the step of using the web background thread to input the user's historical operation data into the graph neural network model and output the predicted user operation area.

[0033] Thirdly, embodiments of this application provide an electronic device, including: a memory and a processor;

[0034] The memory stores computer-executed instructions;

[0035] The processor executes computer execution instructions stored in the memory, causing the processor to perform the first aspect and / or various possible implementations of the first aspect as described above.

[0036] Fourthly, embodiments of this application provide a computer-readable storage medium storing computer-executable instructions, which, when executed by a processor, are used to implement the first aspect and / or various possible implementations of the first aspect.

[0037] Fifthly, embodiments of this application provide a computer program product, including a computer program that, when executed by a processor, implements the first aspect and / or various possible implementations of the first aspect.

[0038] The web client interface rendering and display method, electronic device, storage medium, and program product provided in this application embodiment create a web background thread in response to the web client startup command; the web background thread performs device performance testing based on user operation data to generate target performance evaluation results; the web background thread inputs the target performance evaluation results and user historical operation data into a pre-trained rendering strategy model to generate rendering strategy data; the web background thread sends the rendering strategy data to the web main thread, so that the web main thread renders the client interface to be displayed according to the rendering strategy data to obtain the rendered client interface, and the terminal device's display unit displays the rendered client interface. This solution completes device performance evaluation, user behavior prediction, and rendering strategy adjustment locally on the computer device, solving the problem of the main thread passively responding to display the client interface. That is, it solves the problem of display lag in the client interface of the web client caused by the prior art, and also avoids the risk of user privacy theft and leakage caused by relying on cloud monitoring. Attached Figure Description

[0039] The accompanying drawings, which are incorporated in and form part of this specification, illustrate embodiments consistent with this application and, together with the description, serve to explain the principles of this application.

[0040] Figure 1 A schematic diagram of a scenario for rendering and displaying the client interface of the web page client provided in this application;

[0041] Figure 2 A flowchart of a client interface rendering and display method for a web page client provided in one embodiment of this application;

[0042] Figure 3 A flowchart illustrating a client interface rendering and display method for a web page client provided in another embodiment of this application;

[0043] Figure 4 A schematic diagram of the structure of a client interface rendering and display device for a web page client provided in one embodiment of this application;

[0044] Figure 5 A schematic diagram of the structure of the electronic device provided in this application.

[0045] The accompanying drawings illustrate specific embodiments of this application, which will be described in more detail below. These drawings and descriptions are not intended to limit the scope of the concept in any way, but rather to illustrate the concept of this application to those skilled in the art through reference to particular embodiments. Detailed Implementation

[0046] Exemplary embodiments will now be described in detail, examples of which are illustrated in the accompanying drawings. When the following description relates to the drawings, unless otherwise indicated, the same numbers in different drawings denote the same or similar elements. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with this application. Rather, they are merely examples of apparatuses and methods consistent with some aspects of this application as detailed in the appended claims.

[0047] The technical solution of this application involves the collection, storage, use, processing, transmission, provision and disclosure of user personal information and data, which comply with the provisions of relevant laws and regulations and do not violate public order and good morals.

[0048] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, data stored, data displayed, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties. Furthermore, the collection, use and processing of the relevant data must comply with the relevant laws, regulations and standards of the relevant regions, and corresponding operation entry points are provided for users to choose to authorize or refuse.

[0049] In today's complex web application development and deployment environment, user devices exhibit significant performance differences (e.g., mobile devices, low-end PCs, high-end servers), and the diversity of application scenarios (e.g., data visualization, real-time collaboration, AI interaction) places higher demands on front-end performance. For example, in big data chart display scenarios in the financial industry, users may need to simultaneously manipulate complex charts involving multiple interconnected canvases, while low-end devices may experience lag or even crashes due to excessive rendering pressure. In remote diagnostic systems in the medical industry, real-time rendering of high-precision medical images may affect diagnostic efficiency due to insufficient device performance. Current technologies typically use APM tools running in the main thread to collect real-time user operation data (e.g., click and swipe frequency), resource utilization (memory, CPU), and rendering performance metrics (FPS, frame rate) to render and display the web client's interface. However, existing solutions result in display lag issues in the web client's interface.

[0050] To address the aforementioned technical problems, this application proposes the following technical concept: Device performance testing is performed based on a webpage background thread to generate target performance evaluation results. A pre-trained rendering strategy model is then invoked to generate rendering strategy data based on the target performance evaluation results and user historical operation data. This allows the webpage main thread to render the client interface to be displayed according to the rendering strategy data, resulting in a rendered client interface that is then displayed on the terminal device's display unit. This solves the problem of display lag in webpage client interfaces caused by existing solutions. Specifically, by performing device performance testing through a webpage background thread and combining it with a pre-trained rendering strategy model to predict user actions, matching predicted rendering strategy data is output. This achieves dynamic adaptation and resource optimization of webpage application performance. This solution completes device performance evaluation, user behavior prediction, and rendering strategy adjustment locally on the computer device, solving the problem of the main thread passively responding to display the client interface. This also solves the problem of display lag in webpage client interfaces caused by existing solutions and avoids the risk of user privacy theft and leakage due to reliance on cloud monitoring.

[0051] The application scenarios of the embodiments of this application are explained below:

[0052] Figure 1 This is a schematic diagram illustrating a scenario for the client interface rendering and display method of the web client provided in this application. The execution subject of the method provided in this application embodiment can be any form of electronic device. Taking a computer device as the execution subject, after a user accesses the web client, the computer device responds to the web client startup command, starts the web main thread to load the resources required for the web client to run (e.g., code, configuration, audio, images, video, etc.), and then starts the web client using default rendering strategy data and creates a web background thread. The web background thread then performs device performance testing based on user operation data to generate target performance evaluation results. The web background thread inputs the target performance evaluation results and user historical operation data into a pre-trained rendering strategy model to generate rendering strategy data. The web background thread sends the rendering strategy data to the web main thread, so that the web main thread renders the client interface to be displayed according to the rendering strategy data to obtain the rendered client interface, so that the display unit of the terminal device displays the rendered client interface. This solves the problem of display lag in the client interface of the web client caused by the prior art.

[0053] The technical solution of this application and how the technical solution of this application solves the above-mentioned technical problems are described in detail below with specific embodiments. These specific embodiments can be combined with each other, and the same or similar concepts or processes may not be described again in some embodiments. The embodiments of this application will now be described with reference to the accompanying drawings.

[0054] Figure 2 A flowchart of a client interface rendering and display method for a web page client provided in one embodiment of this application is shown below. Figure 2 As shown, the execution subject of the web client interface rendering and display method provided in this embodiment can be any form of electronic device. For example, this embodiment uses a computer device as the execution subject of the method. The web client interface rendering and display method provided in this embodiment includes the following steps:

[0055] Step S201: In response to the web client startup command, a web background thread is created.

[0056] For example, a webpage background thread is a thread that is allowed to run in the background of the browser to run related scripts, thereby preventing the main webpage thread (responsible for user interface rendering and user interaction) from being blocked by complex calculations and improving the response performance of the webpage client.

[0057] Specifically, in response to a web client startup command, the computer device starts the main web thread to load the resources required for the web client to run (e.g., code, configuration, audio, images, video, etc.), then starts the web client using the default rendering strategy and creates a background web thread.

[0058] Step S202: The webpage background thread performs device performance testing based on user operation data and generates target performance evaluation results.

[0059] For example, user action data is used to indicate user actions in a web client and / or user actions on a computer device (e.g., launching other applications); device performance testing is used to indicate performance testing performed on the computer device; furthermore, the computer device uses a web background thread to perform device performance testing based on the user action data to generate target performance evaluation results under different user action data.

[0060] Specifically, the device performance test includes central processing unit (CPU) computing power test, graphics processing unit (GPU) rendering power test, and memory read / write performance test; the specific implementation steps of step S202 include:

[0061] Step S2021: The webpage background thread performs a central processing unit (CPU) computing power test based on user operation data and generates CPU performance evaluation results.

[0062] For example, CPU performance can be evaluated by performing integer / floating-point arithmetic tasks, such as running a Wasm-accelerated computationally intensive script based on user operation data, to generate CPU performance evaluation results.

[0063] Step S2022: The background thread of the webpage performs a graphics processor rendering capability test based on user operation data and generates a graphics processor performance evaluation result.

[0064] For example, graphics processor performance can be evaluated through off-screen rendering tests, such as generating complex Canvas graphics based on user operation data and calculating the frame rate (FPS) to generate graphics processor performance evaluation results.

[0065] Step S2023: The webpage background thread performs memory read / write performance tests based on user operation data and generates memory performance evaluation results.

[0066] For example, memory performance can be evaluated by statistically analyzing the latency and throughput of memory allocation and deallocation, such as by simulating high-concurrency memory operation scenarios based on user operation data, in order to generate memory performance evaluation results.

[0067] Step S2024: Based on the user operation data, the performance evaluation results of the central processing unit, the graphics processing unit, and the memory are weighted and quantized to generate the target performance evaluation result.

[0068] For example, user operation data may include: frequent user interface rendering operations (60%), data calculation operations (30%), and data read / write operations (10%); the CPU performance evaluation result is 85 points, the GPU performance evaluation result is 90 points, and the memory performance evaluation result is 80 points; based on the user operation data, the weighting coefficients corresponding to the CPU performance evaluation result are determined to be 0.3, the GPU performance evaluation result is 0.6, and the memory performance evaluation result is 0.1; then, the weighted quantification calculation of the CPU performance evaluation result, GPU performance evaluation result, and memory performance evaluation result is: 85×0.3+90×0.6+80×0.1=87.5 points, that is, the target performance evaluation result is 87.5 points.

[0069] In this embodiment, by refining the test dimensions of device performance testing (CPU, GPU, and memory), a comprehensive evaluation of computer device performance is achieved. For example, in a financial charting system, CPU computing power testing determines whether the computer device can support high-frequency data processing, GPU rendering capability testing determines whether the computer device can smoothly render complex charts, and memory read / write performance testing determines whether the computer device may crash due to insufficient memory. This multi-dimensional testing and evaluation provides accurate data references for the subsequent generation of rendering strategy data, improving the computer device's performance adaptability in complex demand environments.

[0070] Step S203: The target performance evaluation results and user historical operation data are input into the pre-trained rendering strategy model using a background thread of the webpage to generate rendering strategy data.

[0071] For example, the pre-trained rendering strategy model refers to a prediction model trained based on reference performance evaluation results, reference user operation data, and reference rendering strategy data. The rendering strategy data refers to the sampling ratio and pre-rendered area predicted by the pre-trained rendering strategy model based on the target performance evaluation results and historical user operation data. Historical user operation data includes user operation habit data and spatiotemporal distribution data. User operation habit data refers to the sequence data of user operations at different business stages, such as click coordinates and swipe timestamps. Spatiotemporal distribution data refers to the time intervals and regional distribution characteristics of user operations, such as the time a user spends in a certain area.

[0072] Specifically, in one possible implementation, the pre-trained rendering strategy model includes a sampling ratio matching model, a time series prediction model, a graph neural network model, and a rendering strategy data generation model; the specific implementation steps of step S203 include:

[0073] Step S2031: The target performance evaluation results are input into the sampling ratio matching model using a background thread on the webpage to output global sampling ratio data.

[0074] For example, the sampling ratio matching model determines the corresponding global sampling ratio data based on the target performance evaluation results of the computer device. For instance, the mapping rule between the target performance evaluation results and the global sampling ratio data is as follows: 80-90 points correspond to a 1:1 base sampling ratio, and the sampling ratio increases by 0.1 for each higher point. Thus, for example, if the target performance evaluation result is 87.5 points, the corresponding global sampling ratio data is 1.75. This global sampling ratio data is adapted to the current hardware performance of the computer device and can balance rendering detail and speed.

[0075] Step S2032: The webpage background thread inputs the user's historical operation data into the time series prediction model and outputs the predicted time of the user's operation.

[0076] For example, the time series forecasting model outputs the corresponding predicted user operation time based on user operation habit data in the user's historical operation data. Here, user operation habit data refers to the sequence data of user operations at different business stages, such as click coordinates and swipe timestamps. Specifically, for example, the user operation habit data includes: the click coordinates for opening the web client are (280, 150), the timestamps for swiping the video progress are (08:15:20, 08:15:45, 08:14:35), and the click coordinates for pausing playback are (420, 380). By analyzing the time of these sequence data, the time series forecasting model determines that the user frequently swipes the video between 08:10 and 08:20 daily, therefore the final output predicted user operation time is: 08:12-08:18.

[0077] Step S2033: The webpage background thread inputs the user's historical operation data into the graph neural network model and outputs the user operation prediction area.

[0078] For example, a graph neural network model outputs a corresponding user operation prediction region based on the spatiotemporal distribution data in the user's historical operation data. Here, the spatiotemporal distribution data refers to the time intervals and regional distribution characteristics of user operations, such as the user's dwell time in a certain area. Specifically, for example, the graph neural network model constructs a graph structure using interface areas as nodes and operation jump relationships as edges, learns the spatiotemporal correlation patterns of user operations, and then, by modeling the user's dwell time, operation time intervals, and distribution characteristics in different interface areas, it can output the interface coordinate range and blocks where the user has a high probability of operating, thus obtaining the corresponding user operation prediction region.

[0079] Step S2034: The global sampling ratio data, user operation prediction time, and user operation prediction area are input into the rendering strategy data generation model using the background thread of the web page, and the rendering strategy data is output.

[0080] For example, the rendering strategy data generation model combines the user operation prediction time to determine the user's upcoming operation, locates high-priority interface areas based on the user operation prediction area, and then performs differentiated configuration based on the global sampling ratio data, using a high sampling ratio for high-priority interface areas and a low sampling ratio for non-high-priority interface areas, and finally outputs rendering strategy data containing region division and corresponding sampling ratio.

[0081] In this implementation step, user operation prediction results (user operation prediction time and user operation prediction region) are generated through a time series prediction model and a graph neural network model. Combined with the global sampling ratio data output by the sampling ratio matching model, the rendering strategy data generation model outputs rendering strategy data based on the global sampling ratio data, user operation prediction time, and user operation prediction region. This rendering strategy data includes region division and the configuration of corresponding sampling ratios for different regions. This improves the interface rendering efficiency and user operation response speed without blocking the main thread of the webpage, and solves the problem of display lag in the client interface of the webpage client caused by the existing technology.

[0082] Furthermore, in another possible implementation, the specific implementation steps of step S2034 include:

[0083] Step S20341: The global sampling ratio data, user operation prediction time, and user operation prediction area are input into the rendering strategy data generation model using a background thread of the webpage.

[0084] Step S20342: Using the rendering strategy data generation model, the client interface to be displayed is divided into target rendering area and non-target rendering area based on the user operation prediction area.

[0085] Step S20343: The rendering strategy data generation model updates the global sampling ratio data based on the user operation prediction time to obtain the updated global sampling ratio data.

[0086] For example, the rendering strategy data generation model calculates the time interval between the predicted user operation time and the current time. If the time interval is greater than or equal to a preset time interval, it indicates that the user will not operate in the short term, so the global sampling ratio data is increased to improve data granularity and rendering effect. If the time interval is less than the preset time interval, it indicates that the user is about to operate, so the global sampling ratio data is decreased to ensure rendering speed. By dynamically adapting the time interval to update the global sampling ratio data, an updated global sampling ratio data adapted to the current operation expectation is obtained, balancing rendering effect and response efficiency.

[0087] Step S20344: Using the rendering strategy data generation model, determine the region sampling ratio corresponding to the target rendering region based on the updated global sampling ratio data and the target rendering region.

[0088] Specifically, the specific implementation steps of step S20344 include:

[0089] Step S203441: Separate the target rendering area into layers to obtain at least two target rendering area layers.

[0090] Step S203442: Determine the layer rendering priority of each target rendering area layer based on the layer type of each target rendering area layer.

[0091] Step S203443: Determine the layer area sampling ratio of each target rendering area layer based on the updated global sampling ratio data, the area size of the target rendering area, and the layer rendering priority of each target rendering area layer.

[0092] Step S203444: Summarize the layer region sampling ratios of each target rendering region layer to obtain the region sampling ratio corresponding to the target rendering region.

[0093] For example, the target rendering area is the "product details area" that the user is about to interact with. The target rendering area is separated into two layers: a "product image layer" and a "text information layer." Then, based on the layer type, the rendering priority of the product image layer (visual core) is determined as high (weight 0.7), and the priority of the text information layer is medium (weight 0.3). Next, the updated global sampling ratio data is adjusted according to the area size of the target rendering area, resulting in adjusted global sampling ratio data. Then, based on the layer rendering priority of each target rendering area layer and the adjusted global sampling ratio data, the layer area sampling ratio of each target rendering area layer is determined. For example, the updated global sampling ratio data is 1.0, the adjusted global sampling ratio data is 1.2, the layer area sampling ratio of the text information layer is 0.7, and the layer area sampling ratio of the product image layer is 1.3.

[0094] For example, in medical imaging systems, it is necessary to maintain a high sampling ratio for the curve region of high-precision medical images (to ensure diagnostic accuracy) and a low sampling ratio for the coordinate system region (to reduce the load on the graphics processor). By separating the curve layer and the coordinate system layer, the sampling ratio of the layer regions of the curve layer and the coordinate system layer can be determined separately, so as to achieve high-quality rendering of the curve layer and high-efficiency rendering of the coordinate system layer respectively.

[0095] In this embodiment, rendering priorities are divided by a layer separation strategy, thereby enabling precise allocation of rendering resources by setting differentiated layer area sampling ratios, ensuring the rendering effect of core content and overall rendering efficiency.

[0096] Step S20345: Using the rendering strategy data generation model, determine the region sampling ratio corresponding to the non-target rendering region based on the updated global sampling ratio data and the region size of the non-target rendering region.

[0097] For example, the rendering strategy data generation model reduces the region sampling ratio for large non-target rendering areas while ensuring basic display quality, thus maintaining rendering speed. For smaller non-target rendering areas, the model appropriately increases the region sampling ratio to improve data detail and rendering quality. Furthermore, it determines the region sampling ratio corresponding to the size of the non-target rendering area. For instance, if the updated global sampling ratio is 1.0 and the size of the non-target rendering area is 800×400, occupying a large proportion of the overall interface (1000×800), the rendering strategy data generation model uses the updated global sampling ratio as a benchmark. Considering the large area and low user attention of the region, the model lowers the sampling ratio by a preset proportion, calculating a region sampling ratio of 0.4 for the non-target rendering area. This reduces rendering pressure while maintaining basic display quality, thereby tilting rendering resources towards the target rendering area and ensuring overall smoothness and display quality.

[0098] Step S20346: The rendering strategy data generation model is used to summarize the target rendering area, the region sampling ratio corresponding to the target rendering area, the non-target rendering area, and the region sampling ratio corresponding to the non-target rendering area to obtain and output the rendering strategy data.

[0099] In this embodiment, the target rendering area, the region sampling ratio corresponding to the target rendering area, the non-target rendering area, and the region sampling ratio corresponding to the non-target rendering area are determined by using a rendering strategy data generation model. This achieves the priority of using a high sampling ratio to render the target rendering area that the user will operate on, and fast loading of the non-target rendering area by using a low sampling ratio, thus ensuring the overall smoothness and display effect.

[0100] Step S204: The rendering strategy data is sent to the main thread of the webpage through the background thread of the webpage, so that the main thread of the webpage renders the client interface to be displayed according to the rendering strategy data, so as to obtain the rendered client interface, and so that the display unit of the terminal device displays the rendered client interface.

[0101] In this embodiment, a background thread for a webpage is created in response to the webpage client's startup command. This background thread performs device performance testing based on user operation data, generating a target performance evaluation result. The background thread then inputs the target performance evaluation result and historical user operation data into a pre-trained rendering strategy model to generate rendering strategy data. Finally, the background thread sends the rendering strategy data to the main webpage thread, enabling the main thread to render the client interface to be displayed, resulting in a rendered client interface that is then displayed on the terminal device's display unit. This solution completes device performance evaluation, user behavior prediction, and rendering strategy adjustment locally on the computer device, solving the problem of the main thread passively responding to display the client interface. This addresses the display lag issues inherent in existing solutions and avoids the risk of user privacy theft and leakage associated with cloud-based monitoring.

[0102] Furthermore, after the rendered client interface is displayed on the display unit of the terminal device, the method provided in this application embodiment further includes:

[0103] Step S2035: Obtain the actual time of the user's operation.

[0104] Step S2036: Calculate the difference between the actual user operation time and the predicted user operation time to obtain the prediction time deviation.

[0105] Step S2037: Based on the prediction time deviation, the model parameters of the time series prediction model are incrementally updated to obtain the updated time series prediction model.

[0106] Step S2038: The updated time series forecasting model is redefined as a time series forecasting model, and then the process returns to step S2032.

[0107] For example, if the actual user operation time is 08:19, and the time series forecasting model outputs a predicted user operation time of 08:12-08:15, then converting the time to minute-level values ​​(08:19 = 499 minutes, 08:15 = 495 minutes), the difference is 4 minutes, meaning the prediction time deviation is +4 minutes (the actual operation time is later than the predicted time). Therefore, this 4-minute deviation is considered a moderate error, and the model parameters of the time series forecasting model (such as the sliding window weight and time decay coefficient) are fine-tuned—the sliding window weight is adjusted from 0.8 to 0.82, and the time decay coefficient is adjusted from 0.05 to 0.045, while the other parameters remain unchanged. This incremental update of the model parameters yields an updated time series forecasting model.

[0108] Step S2039, and / or, obtain the actual area of ​​user operation.

[0109] Step S20310: Calculate the distance between the center of the actual user operation area and the predicted user operation area to obtain the predicted area deviation.

[0110] Step S20311: Update the model parameters of the graph neural network model according to the prediction region deviation to obtain the updated graph neural network model.

[0111] Step S20312: The updated graph neural network model is redefined as a graph neural network model, and then the process returns to step S2033.

[0112] For example, the center coordinates of the actual user operation area are (450, 320), and the center coordinates of the user operation predicted area output by the graph neural network model are (420, 300). The distance between their center coordinates, calculated using the Euclidean distance formula, is 36.06, which represents the predicted area deviation. If the predicted area deviation exceeds a preset deviation threshold, the edge weights, node feature weights, and region attention coefficients of the graph neural network model are incrementally updated based on this deviation. The feature weights of high-frequency user operation areas (target rendering areas) are appropriately strengthened, while the feature weights of non-target rendering areas are weakened. This parameter iterative update, performed without altering the overall model structure, results in an updated graph neural network model. This makes the subsequent user operation predicted area closer to the actual user operation area, improving the accuracy of spatial positioning prediction.

[0113] In this embodiment, based on the deviation between the user's actual operation and the prediction result (such as the deviation between the prediction area and the actual operation area), the incremental correction of the time series prediction model and / or graph neural network model is triggered. Under the condition of limited computer equipment resources, the model is updated so that the prediction results output by the updated time series prediction model and / or the updated graph neural network model in subsequent calls are closer to the user's actual operation.

[0114] Figure 3 A flowchart of a client interface rendering and display method for a web page client provided in another embodiment of this application is shown below. Figure 3 As shown, the client interface rendering and display method of the web page client provided in this embodiment is... Figure 2 Based on the client interface rendering and display method of the web client provided in the illustrated embodiment, step S202 is further refined. Therefore, the client interface rendering and display method of the web client provided in this embodiment includes the following steps:

[0115] Step S301: In response to the web client startup command, a web background thread is created.

[0116] Step S302: The webpage background thread performs basic device performance tests based on user operation data and generates basic performance evaluation results.

[0117] For example, a background thread of the webpage performs basic device performance tests based on user operation data (such as interface swiping frequency, video playback duration, form submission frequency, etc.). These tests include simple floating-point arithmetic tests of the CPU, basic graphics rendering tests of the graphics processor, and small file read / write tests of the memory. The results generate basic performance evaluation results, such as a basic CPU score of 75, a basic graphics processor score of 80, and a basic memory score of 78. The rating of the basic performance evaluation results is "medium".

[0118] Step S303: Determine the performance test time based on user operation data and basic performance evaluation results.

[0119] For example, a background thread on the webpage uses user operation data (the average daily high-frequency operation period for users is 9:00-11:00, and the operation types are mainly video rendering and data loading) to confirm that the operations during the 9:00-11:00 period are mainly behaviors that consume high CPU, GPU, and memory resources, such as video rendering, screen scrolling, and data loading. Combined with the generated basic performance evaluation results, it is determined that the current device is at a medium performance level. If a deep performance test is performed during the high-frequency operation period, it will significantly occupy hardware resources, resulting in interface lag and loading delays. Therefore, in order to avoid interfering with normal use, the background thread on the webpage selects low-peak periods with very few user operations and idle device resources based on the distribution characteristics of user operation periods, which is the performance test time, for example, 1:00-1:10.

[0120] In another possible implementation, the specific implementation steps of step S303 include:

[0121] Step S3031: Determine the length of the sliding window based on the user operation data.

[0122] For example, based on user operation data, including operation frequency, resource consumption intensity, and operation time distribution, it is found that the user performs an average of 30 high-frequency operations per day, and the operation resource consumption fluctuates greatly; then, based on the preset correspondence between user operation data and sliding window length, the sliding window length is determined to be 5.

[0123] Step S3032: Perform sliding window evaluation on the basic performance evaluation results according to the sliding window length to obtain the degree of change in device performance under the sliding window length.

[0124] For example, the basic performance evaluation results are recorded in time series as [75,76,73,80,78,72,79]. Based on the sliding window length of 5, five consecutive data points are extracted sequentially to perform sliding window evaluation, and the performance standard deviation within each window is calculated. The performance standard deviation represents the degree of change in device performance. The performance standard deviation of the first window [75,76,73,80,78] is 2.8, which means that the degree of change in device performance under the current sliding window length is 2.8.

[0125] Step S3033: Determine the relationship between the degree of change in equipment performance and the preset threshold for degree of change in performance.

[0126] Step S3034: If the device performance change is greater than or equal to the preset performance change threshold, then the current moment is determined as the performance test time.

[0127] For example, if the device performance change is greater than or equal to a preset performance change threshold, it indicates that the device performance has changed abruptly. Then, the current moment is determined as the performance test time, and step S304 is executed to generate rendering strategy data. The main thread of the webpage renders the client interface to be displayed according to the rendering strategy data to obtain the rendered client interface, so that the display unit of the terminal device displays the rendered client interface.

[0128] In step S3035, if the degree of change in device performance is less than the preset threshold for degree of change in performance, then return to step S302 and determine the performance test time according to the preset time interval.

[0129] For example, if the device performance variation is less than a preset performance variation threshold, the process returns to step S302 to perform a basic device performance test on the computer device. This basic device performance test is a lightweight performance test that can initially assess the computer device's capabilities without interfering with front-end interaction. Simultaneously, a performance test time is determined based on a preset time interval. When the current moment is the performance test time, step S304 is executed to generate rendering strategy data. This allows the main thread of the webpage to render the client interface to be displayed based on the rendering strategy data, resulting in a rendered client interface. The terminal device's display unit then displays the rendered client interface.

[0130] In this embodiment, the length of the sliding window is determined by user operation data, ensuring that the performance evaluation closely matches the actual user operation characteristics and avoiding evaluation deviations caused by unreasonable window settings. The sliding window dynamically monitors the degree of device performance change, accurately capturing performance fluctuations and solving the problem that static evaluation cannot detect performance anomalies in a timely manner. The performance test time is determined based on the comparison between the degree of device performance change and a preset performance change threshold. This allows for timely testing when device performance fluctuations are large, ensuring that the test results reflect the true performance of the device. Simultaneously, it avoids blind testing when device performance fluctuations are small through cyclical monitoring, preventing interference with user operations. This approach balances the accuracy and timeliness of performance testing with the user experience, providing an accurate time basis for subsequent device performance testing.

[0131] Step S304: Based on user operation data and performance test time, perform device performance test and generate target performance evaluation results to proceed to steps S305 and S306.

[0132] For example, after obtaining the performance test time, the webpage background thread performs device performance tests based on user operation data (e.g., video rendering, data loading, and other operations that consume significant CPU, GPU, and memory resources) to generate a target performance evaluation result. Specifically, the device performance test includes CPU computing power testing, GPU rendering power testing, and memory read / write performance testing. For example, the CPU computing power test simulates a high-frequency data processing scenario, performing 100,000 floating-point operations, measuring a CPU processing time of 85ms, resulting in a score of 82 points, i.e., a CPU performance evaluation result of 82 points. The GPU rendering power test simulates a commonly used video rendering scenario, drawing 100 frames of high-definition graphics, measuring a GPU frame rate of 58 FPS, resulting in a score of 88 points, i.e., a GPU performance evaluation result of 88 points. The memory read / write performance test simulates a user data loading memory interaction scenario, performing 1GB of data read / write, measuring a read / write latency of 12ms, resulting in a score of 80 points, i.e., a memory performance evaluation result of 80 points.

[0133] Furthermore, based on user operation data (e.g., users frequently perform interface rendering operations (60%), data calculation operations (30%), and data read / write operations (10%), the weighting coefficients for the CPU performance evaluation results are determined to be 0.3, the weighting coefficients for the GPU performance evaluation results are 0.6, and the weighting coefficients for the memory performance evaluation results are 0.1. Then, the weighted quantitative calculation of the CPU performance evaluation results, GPU performance evaluation results, and memory performance evaluation results is performed: 82 × 0.3 + 88 × 0.6 + 80 × 0.1 = 85.4 points, meaning the target performance evaluation result is 85.4 points.

[0134] Step S305: The target performance evaluation result is redefined as the basic performance evaluation result, so as to return to step S303.

[0135] In this embodiment, a background thread on the webpage performs basic device performance tests based on user operation data, generating basic performance evaluation results. This allows for an initial assessment of device capabilities without interfering with front-end interaction. Determining the performance test time by combining user operation data and basic performance results avoids peak user operation periods, preventing resource consumption and impacting the user experience. Then, within the determined performance test time, tests are performed on the target processor's computing power, graphics processor's rendering power, and memory read / write performance based on user operation characteristics. This yields target performance evaluation results that align with actual usage scenarios, improving the accuracy, adaptability, and reliability of the performance evaluation and providing accurate data support for determining subsequent rendering strategy data.

[0136] Step S306: The target performance evaluation results and user historical operation data are input into the pre-trained rendering strategy model using a background thread of the webpage to generate rendering strategy data.

[0137] Step S307: The rendering strategy data is sent to the main thread of the webpage through the background thread of the webpage, so that the main thread of the webpage renders the client interface to be displayed according to the rendering strategy data, so as to obtain the rendered client interface, and so that the display unit of the terminal device displays the rendered client interface.

[0138] After obtaining the basic performance evaluation results, the method provided in this application embodiment further includes:

[0139] Step S308: The basic performance evaluation results are sent to the main thread of the webpage so that the main thread of the webpage can render the client interface to be displayed based on the basic performance evaluation results, so as to obtain the rendered client interface and display the rendered client interface on the display unit of the terminal device.

[0140] For example, based on the basic performance evaluation results, the main thread of the webpage renders the client interface to be displayed to obtain the rendered client interface, so that the display unit of the terminal device can display the rendered client interface, thereby improving the display speed of the computer device in response to the webpage client startup command and avoiding long waiting times for the user to wait for the webpage client to start and load; then, after the main thread of the webpage receives the rendering strategy data sent by the background thread of the webpage, the main thread of the webpage renders the client interface to be displayed according to the rendering strategy data to obtain the rendered client interface, so that the display unit of the terminal device can display the rendered client interface.

[0141] In this embodiment, the implementation methods of steps S301 and S306-S307 are the same as those in this application. Figure 2 The implementation methods of steps S201 and S203-S204 in the illustrated embodiment are the same, and will not be described in detail here.

[0142] Figure 4 This is a schematic diagram of the structure of a client interface rendering and display device for a web page client provided in one embodiment of this application, as shown below. Figure 4 As shown, the client interface rendering and display device 40 for the web page client provided in this embodiment includes:

[0143] Create module 401 to create a background thread for the web page in response to the web client's startup command;

[0144] The processing module 402 is used to perform device performance testing based on user operation data using a webpage background thread, and generate target performance evaluation results; and to input the target performance evaluation results and user historical operation data into a pre-trained rendering strategy model using a webpage background thread to generate rendering strategy data.

[0145] The sending module 403 is used to send rendering strategy data to the main thread of the webpage through the background thread of the webpage, so that the main thread of the webpage can render the client interface to be displayed according to the rendering strategy data, so as to obtain the rendered client interface, and so that the display unit of the terminal device can display the rendered client interface.

[0146] Optionally, the client interface rendering display device 40 of the web client described above includes a central processing unit (CPU) computing power test, a graphics processing unit (GPU) rendering power test, and a memory read / write performance test in its device performance testing. When the processing module 402 executes the device performance test based on user operation data using a web background thread to generate a target performance evaluation result, it specifically performs the following: executes a CPU computing power test based on user operation data using a web background thread to generate a CPU performance evaluation result; executes a GPU rendering power test based on user operation data using a web background thread to generate a GPU performance evaluation result; executes a memory read / write performance test based on user operation data using a web background thread to generate a memory performance evaluation result; and performs a weighted quantization of the CPU performance evaluation result, GPU performance evaluation result, and memory performance evaluation result based on the user operation data to generate the target performance evaluation result.

[0147] Optionally, in the client interface rendering display device 40 of the web client described above, when the processing module 402 performs device performance testing and generates target performance evaluation results based on user operation data using the web background thread, it specifically performs the following: performs basic device performance testing and generates basic performance evaluation results using the web background thread based on user operation data; determines the performance test time based on user operation data and basic performance evaluation results; performs device performance testing and generates target performance evaluation results based on user operation data and performance test time; and re-determines the target performance evaluation results as basic performance evaluation results, so as to return to the step of determining the performance test time based on user operation data and basic performance evaluation results.

[0148] Optionally, in the client interface rendering display device 40 of the web client described above, when the processing module 402 determines the performance test time based on user operation data and basic performance evaluation results, it specifically performs the following: determining the sliding window length based on user operation data; performing a sliding window evaluation on the basic performance evaluation results based on the sliding window length to obtain the device performance variation degree under the sliding window length; determining the relationship between the device performance variation degree and a preset performance variation degree threshold; if the device performance variation degree is greater than or equal to the preset performance variation degree threshold, then determining the current moment as the performance test time; if the device performance variation degree is less than the preset performance variation degree threshold, then returning to the step of using the web background thread to perform basic device performance testing based on user operation data and generate basic performance evaluation results, and determining the performance test time according to a preset time interval.

[0149] Optionally, the client interface rendering display device 40 of the web client described above includes a pre-trained rendering strategy model comprising a sampling ratio matching model, a time series prediction model, a graph neural network model, and a rendering strategy data generation model. When the processing module 402 inputs the target performance evaluation results and user historical operation data into the pre-trained rendering strategy model to generate rendering strategy data, it specifically performs the following: inputting the target performance evaluation results into the sampling ratio matching model using a web background thread to output global sampling ratio data; inputting user historical operation data into the time series prediction model using a web background thread to output user operation prediction time; inputting user historical operation data into the graph neural network model using a web background thread to output user operation prediction region; and inputting global sampling ratio data, user operation prediction time, and user operation prediction region into the rendering strategy data generation model using a web background thread to output rendering strategy data.

[0150] Optionally, in the client interface rendering display device 40 of the web client described above, when the processing module 402 inputs the global sampling ratio data, user operation prediction time, and user operation prediction area into the rendering strategy data generation model using the web background thread and outputs the rendering strategy data, it specifically performs the following: inputting the global sampling ratio data, user operation prediction time, and user operation prediction area into the rendering strategy data generation model using the web background thread; dividing the client interface to be displayed into a target rendering area and a non-target rendering area according to the user operation prediction area using the rendering strategy data generation model; updating the global sampling ratio data according to the user operation prediction time using the rendering strategy data generation model to obtain the updated global sampling ratio data; determining the area sampling ratio corresponding to the target rendering area using the rendering strategy data generation model based on the updated global sampling ratio data and the target rendering area; determining the area sampling ratio corresponding to the non-target rendering area based on the updated global sampling ratio data and the area size of the non-target rendering area using the rendering strategy data generation model; and summarizing the target rendering area, the area sampling ratio corresponding to the target rendering area, the non-target rendering area, and the area sampling ratio corresponding to the non-target rendering area using the rendering strategy data generation model to obtain and output the rendering strategy data.

[0151] Optionally, in the client interface rendering display device 40 of the web client described above, when the processing module 402 determines the region sampling ratio corresponding to the target rendering region based on the updated global sampling ratio data and the target rendering region, it specifically performs the following: performing layer separation on the target rendering region to obtain at least two target rendering region layers; determining the layer rendering priority of each target rendering region layer based on the layer type of each target rendering region layer; determining the layer region sampling ratio of each target rendering region layer based on the updated global sampling ratio data, the region size of the target rendering region, and the layer rendering priority of each target rendering region layer; and summarizing the layer region sampling ratios of each target rendering region layer to obtain the region sampling ratio corresponding to the target rendering region.

[0152] Optionally, after the rendered client interface of the web client is displayed on the display unit of the terminal device, the client interface rendering display device 40 of the web client is further configured to: obtain the actual time of user operation; calculate the difference between the actual time of user operation and the predicted time of user operation to obtain the prediction time deviation; incrementally update the model parameters of the time series prediction model according to the prediction time deviation to obtain the updated time series prediction model; re-determine the updated time series prediction model as the time series prediction model to return to the step of using the web background thread to input the user's historical operation data into the time series prediction model and output the predicted time of user operation; and / or, obtain the actual area of ​​user operation; calculate the distance between the regional centers of the actual area of ​​user operation and the predicted area of ​​user operation to obtain the prediction area deviation; update the model parameters of the graph neural network model according to the prediction area deviation to obtain the updated graph neural network model; re-determine the updated graph neural network model as the graph neural network model to return to the step of using the web background thread to input the user's historical operation data into the graph neural network model and output the predicted area of ​​user operation.

[0153] The client interface rendering and display device 40 of the web client provided in this embodiment can perform the following: Figures 2-3 The technical solutions of any of the method embodiments shown are similar in implementation principle and technical effect, and will not be described again here.

[0154] Figure 5 A schematic diagram of the structure of the electronic device provided in this application. Figure 5 As shown, the electronic device 50 provided in this embodiment includes at least one processor 501 and a memory 502. Optionally, the device 50 further includes a communication component 503. The processor 501, memory 502, and communication component 503 are connected via a bus.

[0155] In a specific implementation, at least one processor 501 executes computer execution instructions stored in memory 502, causing at least one processor 501 to perform the above-described method.

[0156] The specific implementation process of processor 501 can be found in the above method embodiments, and its implementation principle and technical effect are similar. It will not be repeated here.

[0157] In the above embodiments, it should be understood that the processor can be a Central Processing Unit (CPU), or other general-purpose processors, digital signal processors (DSPs), application-specific integrated circuits (ASICs), etc. The general-purpose processor can be a microprocessor or any conventional processor. The steps of the method disclosed in this invention can be directly implemented by a hardware processor, or implemented by a combination of hardware and software modules within the processor.

[0158] The memory may include random access memory (RAM) and may also include non-volatile memory (NVM), such as at least one disk storage device.

[0159] The bus can be an Industry Standard Architecture (ISA) bus, a Peripheral Component Interconnect (PCI) bus, or an Extended Industry Standard Architecture (EISA) bus, etc. Buses can be categorized as address buses, data buses, control buses, etc. For ease of illustration, the buses shown in the accompanying drawings are not limited to a single bus or a single type of bus.

[0160] This application also provides a computer program product, including a computer program that, when executed by a processor, implements the above-described method.

[0161] This application also provides a computer-readable storage medium storing computer-executable instructions, which, when executed by a processor, implement the above-described method.

[0162] The aforementioned readable storage medium can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic storage, flash memory, magnetic disk, or optical disk. The readable storage medium can be any available medium accessible to a general-purpose or special-purpose computer.

[0163] An exemplary readable storage medium is coupled to a processor, enabling the processor to read information from and write information to the readable storage medium. Of course, the readable storage medium can also be a component of the processor. The processor and the readable storage medium can reside in an Application Specific Integrated Circuit (ASIC). Alternatively, the processor and the readable storage medium can exist as discrete components in the device.

[0164] It should be noted that, for the sake of simplicity, the foregoing method embodiments are all described as a series of actions. However, those skilled in the art should understand that this application is not limited to the described order of actions, as some steps may be performed in other orders or simultaneously according to this application. Furthermore, those skilled in the art should also understand that the embodiments described in the specification are all optional embodiments, and the actions and modules involved are not necessarily essential to this application.

[0165] It should be further noted that although the steps in the flowchart are shown sequentially according to the arrows, these steps are not necessarily executed in the order indicated by the arrows. Unless explicitly stated herein, there is no strict order restriction on the execution of these steps, and they can be executed in other orders. Moreover, at least some steps in the flowchart may include multiple sub-steps or multiple stages. These sub-steps or stages are not necessarily completed at the same time, but can be executed at different times. The execution order of these sub-steps or stages is not necessarily sequential, but can be performed alternately or in turn with other steps or at least some of the sub-steps or stages of other steps.

[0166] It should be understood that the above-described device embodiments are merely illustrative, and the device of this application can also be implemented in other ways. For example, the division of units / modules in the above embodiments is only a logical functional division, and there may be other division methods in actual implementation. For example, multiple units, modules, or components may be combined, or integrated into another system, or some features may be ignored or not executed.

[0167] Furthermore, unless otherwise specified, the functional units / modules in the various embodiments of this application can be integrated into one unit / module, or each unit / module can exist physically separately, or two or more units / modules can be integrated together. The integrated units / modules described above can be implemented in hardware or as software program modules.

[0168] When integrated units / modules are implemented in hardware, the hardware can be digital circuits, analog circuits, etc. The physical implementation of the hardware structure includes, but is not limited to, transistors, memristors, etc. Unless otherwise specified, the processor can be any suitable hardware processor, such as a CPU, GPU, FPGA, DSP, and ASIC, etc. Unless otherwise specified, the storage unit can be any suitable magnetic or magneto-optical storage medium, such as Resistive Random Access Memory (RRAM), Dynamic Random Access Memory (DRAM), Static Random Access Memory (SRAM), Enhanced Dynamic Random Access Memory (EDRAM), High-Bandwidth Memory (HBM), Hybrid Memory Cube (HMC), etc.

[0169] If the integrated unit / module is implemented as a software program module and sold or used as an independent product, it can be stored in a computer-readable storage device (CMD). Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a memory and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods of the various embodiments of this application. The aforementioned memory includes various media capable of storing program code, such as a USB flash drive, read-only memory (ROM), random access memory (RAM), portable hard drive, magnetic disk, or optical disk.

[0170] In the above embodiments, the descriptions of each embodiment have their own emphasis. For parts not described in detail in a certain embodiment, please refer to the relevant descriptions of other embodiments. The technical features of the above embodiments can be combined arbitrarily. For the sake of brevity, not all possible combinations of the technical features in the above embodiments are described. However, as long as the combination of these technical features does not contradict each other, it should be considered within the scope of this specification.

[0171] Other embodiments of this application will readily occur to those skilled in the art upon consideration of the specification and practice of the invention disclosed herein. This application is intended to cover any variations, uses, or adaptations of this application that follow the general principles of this application and include common knowledge or customary techniques in the art not disclosed herein. The specification and examples are to be considered exemplary only, and the true scope and spirit of this application are indicated by the following claims.

[0172] It should be understood that this application is not limited to the precise structure described above and shown in the accompanying drawings, and various modifications and changes can be made without departing from its scope. The scope of this application is limited only by the appended claims.

Claims

1. A method for rendering and displaying the client interface of a web page client, characterized in that, include: In response to the web client's startup command, a background thread for the web page is created. The webpage background thread performs device performance tests based on user operation data and generates target performance evaluation results. The target performance evaluation results and user historical operation data are input into the pre-trained rendering strategy model using the background thread of the webpage to generate rendering strategy data. The rendering strategy data is sent to the main thread of the webpage through the background thread of the webpage, so that the main thread of the webpage renders the client interface to be displayed according to the rendering strategy data, so as to obtain the rendered client interface, and the display unit of the terminal device displays the rendered client interface.

2. The method of claim 1, wherein, The device performance test includes central processing unit computing power test, graphics processing unit rendering power test, and memory read / write performance test; The step of using the webpage background thread to perform device performance testing based on user operation data and generate target performance evaluation results includes: The webpage background thread executes the central processing unit (CPU) computing power test based on the user operation data, and generates CPU performance evaluation results. The background thread of the webpage executes the graphics processor rendering capability test based on the user operation data, and generates a graphics processor performance evaluation result. The webpage background thread executes the memory read / write performance test based on user operation data, and generates memory performance evaluation results. Based on the user operation data, the performance evaluation results of the central processing unit, the graphics processing unit, and the memory performance are weighted and quantized to generate the target performance evaluation result.

3. The method of claim 1, wherein, The step of using the webpage background thread to perform device performance testing based on user operation data and generate target performance evaluation results includes: The webpage background thread performs basic device performance tests based on the user operation data and generates basic performance evaluation results. The performance test time is determined based on the user operation data and the basic performance evaluation results; Based on the user operation data and the performance test time, perform device performance testing and generate target performance evaluation results; The target performance evaluation result is redefined as the basic performance evaluation result, so as to return to the step of determining the performance test time based on the user operation data and the basic performance evaluation result.

4. The method of claim 3, wherein, The step of determining the performance test time based on the user operation data and the basic performance evaluation results includes: The length of the sliding window is determined based on the user operation data; Based on the sliding window length, a sliding window evaluation is performed on the basic performance evaluation results to obtain the degree of change in device performance under the sliding window length; Determine the relationship between the degree of performance change of the device and a preset performance change threshold; If the performance variation of the device is greater than or equal to the preset performance variation threshold, then the current moment is determined as the performance test time. If the device performance variation is less than the preset performance variation threshold, then return to the step of using the webpage background thread to perform basic device performance testing based on the user operation data and generate basic performance evaluation results, and determine the performance test time according to the preset time interval.

5. The method according to any one of claims 1 to 4, characterized in that, The pre-trained rendering strategy model includes a sampling ratio matching model, a time series prediction model, a graph neural network model, and a rendering strategy data generation model. The step of inputting the target performance evaluation results and user historical operation data into a pre-trained rendering strategy model to generate rendering strategy data includes: The target performance evaluation result is input into the sampling ratio matching model using the background thread of the webpage to output global sampling ratio data; The webpage background thread is used to input the user's historical operation data into the time series prediction model, and the predicted time of user operation is output. The webpage background thread is used to input the user's historical operation data into the graph neural network model, and output the user operation prediction region. The webpage background thread inputs the global sampling ratio data, the user operation prediction time, and the user operation prediction region into the rendering strategy data generation model, and outputs the rendering strategy data.

6. The method of claim 5, wherein, The step of using the webpage background thread to input the global sampling ratio data, the user operation prediction time, and the user operation prediction region into the rendering strategy data generation model, and outputting the rendering strategy data, includes: The background thread of the webpage inputs the global sampling ratio data, the user operation prediction time, and the user operation prediction region into the rendering strategy data generation model; The rendering strategy data generation model uses the user operation prediction area to divide the client interface to be displayed into a target rendering area and a non-target rendering area. The rendering strategy data generation model updates the global sampling ratio data based on the user operation prediction time to obtain the updated global sampling ratio data. The rendering strategy data generation model uses the updated global sampling ratio data and the target rendering region to determine the region sampling ratio corresponding to the target rendering region; The rendering strategy data generation model uses the updated global sampling ratio data and the size of the non-target rendering region to determine the region sampling ratio corresponding to the non-target rendering region. The rendering strategy data generation model is used to summarize the target rendering region, the region sampling ratio corresponding to the target rendering region, the non-target rendering region, and the region sampling ratio corresponding to the non-target rendering region to obtain and output the rendering strategy data.

7. The method of claim 6, wherein, The step of determining the region sampling ratio corresponding to the target rendering region based on the updated global sampling ratio data and the target rendering region includes: The target rendering area is separated into layers to obtain at least two target rendering area layers; Determine the layer rendering priority of each target rendering area layer based on its layer type. Based on the updated global sampling ratio data, the size of the target rendering region, and the layer rendering priority of each target rendering region layer, the layer region sampling ratio of each target rendering region layer is determined. The layer region sampling ratios of each target rendering region layer are summarized to obtain the region sampling ratio corresponding to the target rendering region.

8. The method of claim 5, wherein, After the rendered client interface is displayed on the display unit of the terminal device, the method further includes: Obtain the actual time of the user's operation; The difference between the actual time of the user operation and the predicted time of the user operation is calculated to obtain the prediction time deviation; Based on the predicted time deviation, the model parameters of the time series prediction model are incrementally updated to obtain the updated time series prediction model. The updated time series prediction model is redefined as a time series prediction model, so as to return to the step of using the webpage background thread to input the user's historical operation data into the time series prediction model and output the user operation prediction time. And / or, obtain the actual area of ​​user operation; Calculate the distance between the center of the actual user operation area and the predicted user operation area to obtain the prediction area deviation; The model parameters of the graph neural network model are updated based on the predicted region deviation to obtain the updated graph neural network model. The updated graph neural network model is redefined as a graph neural network model to return to the step of using the webpage background thread to input the user's historical operation data into the graph neural network model and output the user operation prediction region.

9. A client interface rendering and display device for a web page client, characterized in that, include: Create a module to create a background thread for the webpage in response to the webpage client's startup command; The processing module is used to perform device performance testing based on user operation data using the background thread of the webpage, and generate target performance evaluation results; The target performance evaluation results and user historical operation data are input into the pre-trained rendering strategy model using the background thread of the webpage to generate rendering strategy data. The sending module is used to send the rendering strategy data to the main thread of the webpage through the background thread of the webpage, so that the main thread of the webpage can render the client interface to be displayed according to the rendering strategy data to obtain the rendered client interface, so that the display unit of the terminal device can display the rendered client interface.

10. An electronic device, comprising: include: A processor, and a memory communicatively connected to the processor; The memory stores computer-executed instructions; The processor executes computer execution instructions stored in the memory to implement the method as described in any one of claims 1 to 8.

11. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores computer-executable instructions, which, when executed by a processor, are used to implement the method as described in any one of claims 1 to 8.

12. A computer program product, characterized in that, Includes a computer program that, when executed by a processor, implements the method of any one of claims 1 to 8.