A method, device and storage medium for loading a page component
Patent Information
- Application Number
- CN202510700832.2
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2025-05-28
- Publication Date
- 2026-09-08
- Estimated Expiration
- 2045-05-28
AI Technical Summary
[0004]懒加载依赖的规则主要是静态规则(如滚动位置、用户点击、路由切换等),不仅加载组件时存在一定的延时,而且加载的组件可能并非用户需求的,浪费资源,导致加载组件的效率较低
[0024]In this embodiment, when a user visits a page, the system collects the user's behavioral and contextual features. These features are then input into a behavior prediction model to locate the component the user is expected to visit next on the page, designated as the target component. The target component is preloaded onto the page. The system also listens for the component the user actually visits next on the page, designated as the baseline component. The behavior prediction model is then updated based on the target and baseline components. On one hand, by predicting the user's expected next component based on their behavior and context, and updating the behavior prediction model by comparing this prediction with the actual component visited next, the accuracy of predicting the user's next component can be continuously improved. On the other hand, preloading the expected next component allows for personalized component preloading, reducing component loading latency, effectively utilizing resources, and thus improving component loading efficiency.
Smart Images

Figure CN120561398B_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the technical field of browsers, and more particularly to a method, device, and storage medium for loading page components. Background Technology
[0002] In some large single-page applications (SPAs), the page contains many components, such as basic components (such as buttons, input boxes, etc.), business components (such as shopping cart modules, user information cards, etc.), routing components, and so on.
[0003] Currently, to reduce loading events, these components are typically loaded using lazy loading, which is mainly triggered by rules, such as lazy loading based on front-end routes, lazy loading triggered by scrolling, and so on.
[0004] Lazy loading relies primarily on static rules (such as scroll position, user clicks, route switching, etc.), which not only introduces a delay when loading components but also results in the loading of components that may not be what the user needs, wasting resources and leading to low efficiency in loading components. Summary of the Invention
[0005] In view of this, the present invention provides a method, device and storage medium for loading page components, so as to improve the efficiency of loading components in a page.
[0006] A first aspect of the present invention provides a method for loading page components, applied to a browser, wherein the browser has a built-in database storing behavior prediction models, the method comprising:
[0007] When a user visits a page, the user's behavioral characteristics and contextual characteristics are collected for that page;
[0008] The behavioral features and the contextual features are input into the behavior prediction model to locate the component that the user is expected to visit next on the page, which is then used as the target component.
[0009] The target component is preloaded on the page;
[0010] Listen for the component that the user actually visits next on the page, and use it as a baseline component;
[0011] The behavior prediction model is updated based on the target component and the benchmark component.
[0012] A second aspect of the present invention provides a page component loading device applied to a browser, wherein a behavior prediction model is stored in a database built into the browser, the device comprising:
[0013] The data acquisition module is used to collect the user's behavioral characteristics and contextual characteristics when the user visits the page;
[0014] The user behavior prediction module is used to input the behavior features and the context features into the behavior prediction model to locate the component that the user is expected to visit next on the page, as the target component.
[0015] A target component preloading module is used to preload the target component on the page;
[0016] A baseline component monitoring module is used to monitor the component that the user actually visits next on the page, and use it as a baseline component.
[0017] The behavior prediction model update module is used to update the behavior prediction model based on the target component and the benchmark component.
[0018] A third aspect of the present invention provides an electronic device, the electronic device comprising:
[0019] At least one processor; and
[0020] A memory communicatively connected to the at least one processor; wherein,
[0021] The memory stores a computer program that can be executed by the at least one processor, the computer program being executed by the at least one processor to enable the at least one processor to perform the page component loading method as described in the first aspect above.
[0022] A fourth aspect of the present invention provides a computer-readable storage medium storing a computer program that, when executed by a processor, implements the page component loading method as described in the first aspect above.
[0023] A fifth aspect of the present invention provides a computer program product comprising a computer program that, when executed by a processor, implements the page component loading method as described in the first aspect above.
[0024] In this embodiment, when a user visits a page, the system collects the user's behavioral and contextual features. These features are then input into a behavior prediction model to locate the component the user is expected to visit next on the page, designated as the target component. The target component is preloaded onto the page. The system also listens for the component the user actually visits next on the page, designated as the baseline component. The behavior prediction model is then updated based on the target and baseline components. On one hand, by predicting the user's expected next component based on their behavior and context, and updating the behavior prediction model by comparing this prediction with the actual component visited next, the accuracy of predicting the user's next component can be continuously improved. On the other hand, preloading the expected next component allows for personalized component preloading, reducing component loading latency, effectively utilizing resources, and thus improving component loading efficiency.
[0025] It should be understood that the description in this section is not intended to identify key or essential features of the embodiments of the present invention, nor is it intended to limit the scope of the invention. Other features of the invention will become readily apparent from the following description. Attached Figure Description
[0026] To more clearly illustrate the technical solutions in the embodiments of the present invention, the accompanying drawings used in the description of the embodiments will be briefly introduced below. Obviously, the accompanying drawings described below are only some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.
[0027] Figure 1 This is a flowchart of a page component loading method provided in Embodiment 1 of the present invention.
[0028] Figure 2 This is a schematic diagram of the structure of a behavior prediction model provided in Embodiment 1 of the present invention.
[0029] Figure 3 This is a schematic diagram of the structure of a page component loading device provided in Embodiment 2 of the present invention.
[0030] Figure 4 This is a schematic diagram of the structure of an electronic device provided in Embodiment 3 of the present invention. Detailed Implementation
[0031] To enable those skilled in the art to better understand the present invention, the technical solutions of the present invention will be clearly and completely described below with reference to the accompanying drawings of the embodiments of the present invention. Obviously, the described embodiments are only some embodiments of the present invention, and not all embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort should fall within the scope of protection of the present invention.
[0032] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this invention are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be used interchangeably where appropriate so that the embodiments of the invention described herein can cover implementations in sequences other than those illustrated or described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, system, product, or apparatus that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or apparatus.
[0033] Example 1
[0034] See Figure 1 The diagram illustrates a flowchart of a page component loading method according to Embodiment 1 of the present invention. This method can be executed by a page component loading device, which can be implemented in hardware and / or software and can be configured in an electronic device. Figure 1 As shown, the method includes:
[0035] Step 101: When a user visits a page, collect the user's behavioral characteristics and contextual characteristics for that page.
[0036] This embodiment can be applied to browsers, especially large browsers. When a user (represented by a user ID or other identifier) accesses a page, the browser's rendering process collects the user's behavioral characteristics when interacting on the page, as well as the contextual characteristics related to the components the user is expected to visit next on the page, on the main thread of the page rendering process.
[0037] When predicting which component a user will visit next on a page, the distribution of output components will be adjusted depending on the context input of different pages. By collecting the context of different pages and learning the scene data of different pages, the behavior prediction model can learn to associate the page context with the component loading requirements, thereby achieving dynamic adaptation to component loading.
[0038] On the one hand, when initializing the page, browser embedded scripts (such as JavaScript) are called to register listeners for the Document Object Model (DOM) (such as addEventListener). The listeners listen for events generated when the user interacts with the page, such as clicks, scrolling, mouse hovers, page transitions, etc. Each event is encapsulated into an event object, which contains information such as event type, timestamp, target element ID, and coordinates.
[0039] Furthermore, the main thread can use methods such as `worker.postMessage` to pass events to the preprocessing module for preprocessing, thereby improving the quantity and quality of the events. For example, it can filter the collected events, removing duplicate or invalid events, and so on.
[0040] The frequency and temporal distribution of each event in a past period or multiple interactions are statistically analyzed and aggregated. Multiple events are then input into a pre-set one-dimensional convolutional neural network and encoded into a fixed-length temporal vector as behavioral features.
[0041] On the other hand, the components are arranged differently on different pages, so the structural data related to the components can be statistically analyzed in the document object model of the page.
[0042] For example, structured data includes at least one of the following:
[0043] All components contained on the page, components contained in various areas of the page (such as the header area, sidebar area, content area, footer area, etc.), and the distribution information (such as percentage) of components of a specified type (such as input box, button, table, etc.) on the page.
[0044] The device on which the browser is located and the network of that device have an external impact on the user's behavior when accessing components. Therefore, it is possible to collect statistics and performance-related metrics on the device on which the browser is located and the network of that device.
[0045] For example, the indicator data includes at least one of the following:
[0046] The device's central processing unit (CPU) utilization, device memory usage, information on the graphics processing unit (GPU)'s support for page acceleration, network latency, and network bandwidth.
[0047] Querying a user's browser preferences has an inherent influence on their behavior when accessing components. Therefore, with user authorization, it is possible to query the user's browser preferences.
[0048] For example, preference data includes at least one of the following:
[0049] Browser theme information, browser layout information, and the layout information of functional components in the browser.
[0050] The above structural data, indicator data, and preference data are concatenated to form contextual features.
[0051] Of course, the above-described context features are merely examples. In implementing this embodiment, other context features can be set according to actual circumstances, and this embodiment does not impose any limitations on this. Furthermore, in addition to the above-described context features, those skilled in the art can also employ other context features as needed, and this embodiment does not impose any limitations on this either.
[0052] Both user behavior features and contextual features are feature vectors, which are fixed-length numerical arrays used to quantify key information describing user behavior and key information affecting user access to components, enabling the behavior prediction model to receive data in a uniform format as input.
[0053] User behavior features and context features are stored in formats such as JSON (JavaScript Object Notation). The main thread encapsulates user behavior features and context features into a model call request, writes the model call request into a cached queue, and waits to pass it to the behavior prediction model for inference.
[0054] Furthermore, the main thread can optimize the model call request in terms of both timing selection and structural optimization rules.
[0055] 1. Timing selection
[0056] Triggering conditions: Based on the overall page loading status and user behavior (such as long-term inactivity or page dwell time exceeding a threshold), select an appropriate time to build a model call request.
[0057] Reduce frequency: By setting time windows and dilution mechanisms, model call requests are built when user behavior characteristics and contextual characteristics accumulate to a certain amount or when significant behavioral changes occur, thereby reducing computational load.
[0058] 2. Result Optimization Rules
[0059] Context-based rule adjustments: If certain key components have already been loaded on the page, exclude these components from the context features and focus on preloading other components that have not yet been loaded but that the user may need.
[0060] Step 102: Input the behavioral features and contextual features into the behavior prediction model to locate the component that the user is expected to visit next on the page, and use it as the target component.
[0061] During page initialization, a pre-trained, lightweight behavior prediction model (such as a TensorFlow.js model) can be loaded from a remote server and stored in a lightweight database built into the browser (such as IndexedDB). Then, the inference environment of the behavior prediction model is initialized so that the behavior prediction model can run normally. Behavioral features and context features are input into the behavior prediction model to locate the component that the user may visit next on the page, as the target component.
[0062] In practical implementation, WebWorkers can be created that operate independently of the browser's main thread. A WebWorker is a network interface that allows JavaScript to execute code in a background thread, solving the blocking problem of JavaScript's single-threaded model. Its main function is to create a multi-threaded environment for JavaScript, assigning time-consuming tasks to Worker threads and ensuring the main thread (typically responsible for UI interactions) remains smooth.
[0063] In the Web Worker, check if a pre-trained behavior prediction model exists in the local database (such as IndexedDB). If not, retrieve and load the behavior prediction model from the server in the Web Worker. If it exists, load the behavior prediction model from the local database (such as IndexedDB) in the Web Worker to avoid blocking the main thread.
[0064] In the WebWorker, model call requests constructed by the browser's main thread are read from a cached queue; these model call requests contain behavioral and contextual features.
[0065] In WebWorker, behavioral and contextual features are input into the behavior prediction model based on the model call request to locate the component that the user is expected to visit next on the page, which is then used as the target component.
[0066] In a design, such as Figure 2 As shown, the behavior prediction model includes an encoder, a normalization layer, a feature extraction layer, a classification head structure, and a ranking head structure.
[0067] In the encoder, the context feature is encoded into a multimodal feature c.
[0068] For example, the encoder includes two fully connected layers (FC), referred to as the first fully connected layer FC1 and the second fully connected layer FC2, respectively.
[0069] In the first fully connected layer FC1, the context feature is mapped to the first intermediate feature, and the first intermediate feature is activated using the Rectified Linear Unit (ReLU) function to obtain the second intermediate feature. In the second fully connected layer FC2, the second intermediate feature is mapped to the multimodal feature c.
[0070] In this example, the encoding process can be represented as c = FC2(ReLU(FC1(context))).
[0071] The behavioral feature b and the multimodal feature c are concatenated to form the first fusion feature X0, that is, X0 = [c; b], where ";" indicates addition, that is, X0 = c + b.
[0072] In the normalization layer, the first fusion feature X0 is normalized based on the multimodal feature c to obtain the second fusion feature X, thus realizing a context-based dynamic normalization mechanism that can enhance the generalization capability across different devices and pages.
[0073] For example, in the normalization layer, the multimodal feature c is mapped to the scaling factor α(c) and the offset factor β(c). The first fused feature X0 can be normalized using functions such as batch normalization. If the normalization operation is completed, the offset factor β(c) is added to the product between the scaling factor α(c) and the first fused feature X0 to obtain the second fused feature X, that is, X = α(c)·X0 + β(c).
[0074] In the feature extraction layer, a representation vector representing the user's intent is extracted from the second fusion feature X, which is then used as the third fusion feature h.
[0075] For example, the feature extraction layer includes a multilayer perceptron (MLP), in which a second fusion feature X is subjected to multilayer linear transformation and nonlinear activation to extract a representation vector representing the user's intent as a third fusion feature h, i.e., h = MLP(X).
[0076] In the classification head structure, the probability P of the user selecting each component on the page is generated based on the third fusion feature h, P = [p1, p2, p3, ..., pi, ..., pn], where pi is the probability of the user selecting the i-th component on the page, i ∈ n, and n is the number of components on the page.
[0077] The classification head structure can use softmax, and the loss function is cross-entropy.
[0078] In the sorting header structure, the user's preference degree S for each component on the page is generated based on the third fusion feature h, S = [s1, s2, s3, ..., si, ..., sn], where si is the user's preference degree for the i-th component on the page, i ∈ n, and n is the number of components on the page.
[0079] The ranking head structure is a regression layer, the loss function is regression loss or ranking loss, and the user's preference for each component on the page is the ranking score of each component. It allows adjustment not only of the component with the highest probability, but also of a combination of multiple components.
[0080] The probability pi and the preference level si are combined in a linear or non-linear manner to form the expected value ri of the user's next visit to each component on the page.
[0081] For example, the probability pi is added to the preference level si to obtain the expected value ri of the user's next access to each component on the page, that is, ri = pi + si.
[0082] The expected values ri of each component are compared to determine the component with the highest expected value ri that the user expects to visit next on the page, thus obtaining the target component.
[0083] Step 103: Preload the target component on the page.
[0084] WebWorkers pass the component identifier (such as component ID) of the target component to the main thread through methods such as postMessage. The main thread then loads the target component asynchronously using JavaScript's ES6 dynamic import syntax.
[0085] Record the target component's identifier, loading events, and other information in the cache so that when a user accesses the target component later, they can directly retrieve the target component from the cache based on the target component's information, avoiding repeated loading.
[0086] Step 104: Listen for the component that the user actually visits next on the page, and use it as the baseline component.
[0087] The main thread listens in real time for the component that the user actually visits next on the page, and this component is called the baseline component.
[0088] Step 105: Update the behavior prediction model based on the target component and the baseline component.
[0089] The main thread compares the target component with the benchmark component to identify the performance of the behavior prediction model, and updates the behavior prediction model in a timely manner to improve its performance.
[0090] In one embodiment of the present invention, step 105 may include the following steps:
[0091] Step 1051: If the target component is different from the baseline component, then in the WebWorker, write the behavioral features and context features as log data into the browser's database.
[0092] If the baseline component actually visited by the user is inconsistent with the target component predicted to be visited by the user, it indicates that there is a deviation in the prediction. In this case, the main thread notifies the WebWorker to collect the user's recent behavioral characteristics (such as event type, timestamp, target element ID, coordinates, etc.) and contextual characteristics, encapsulate them in JSON or other formats, and write them as a log data to the browser's database (such as IndexedDB) to ensure that the log data is not lost in the event of page refresh or brief network failure.
[0093] Step 1052: If the amount of log data stored in the browser's database reaches the threshold, then in the WebWorker, the log data stored in the browser's database is uploaded to the server.
[0094] When the number of local log data in the browser's database reaches a preset threshold (e.g., 200 records), the WebWorker automatically triggers the upload of log data to the server. At this time, AJAX (Asynchronous JavaScript and XML) or FetchAPI (a JavaScript API) are used to upload the log data stored in the browser's database to the server. Upon successful upload, the log data stored in the browser's database is cleared.
[0095] The server is used to train the behavior prediction model based on log data using methods such as fine-tuning, in order to update the version of the behavior prediction model. At this time, the server maintains the new version of the behavior prediction model, while the browser maintains the old version of the behavior prediction model.
[0096] Step 1053: In the WebWorker, load the new version of the behavior prediction model from the server and replace the old local version of the behavior prediction model with the new version.
[0097] In the WebWorker, a pre-defined API (Application Programming Interface) is called to load a new version of the behavior prediction model from the server. The new version of the behavior prediction model replaces the old version locally. The behavior prediction model is then hot-updated in the WebWorker to keep the current business process running normally.
[0098] In the specific implementation, the WebWorker periodically calls a preset API to check if a new version of the behavior prediction model exists. If a new version of the behavior prediction model exists, an asynchronous task is started to load the new version of the behavior prediction model from the server while maintaining the local old version of the behavior prediction model (i.e., the old version of the behavior prediction model continues to process model call requests in the queue).
[0099] In WebWorker, a lock is added to the queue. The locking mechanism temporarily caches newly received model call requests in the queue, ensuring that no new model call requests enter the processing flow during the switch. While the queue is locked, the pointer (or reference, such as a global variable or a model instance in a state object) of the behavior prediction model is replaced from the old version of the behavior prediction model to the new version, thus achieving pointer replacement of the behavior prediction model. At this point, the lock is released on the queue, and the model call requests in the queue are gradually released and handled by the new version of the behavior prediction model, thus realizing the switch of the behavior prediction model.
[0100] In the WebWorker, when the behavior prediction model is switched, the dispose() method provided by TensorFlow.js is called to release the resources occupied by the local old version of the behavior prediction model.
[0101] When the WebWorker completes the hot update behavior prediction model, it notifies the main thread to complete the hot update of the behavior prediction model.
[0102] In this embodiment, when a user visits a page, the system collects the user's behavioral and contextual features. These features are then input into a behavior prediction model to locate the component the user is expected to visit next on the page, designated as the target component. The target component is preloaded onto the page. The system also listens for the component the user actually visits next on the page, designated as the baseline component. The behavior prediction model is then updated based on the target and baseline components. On one hand, by predicting the user's expected next component based on their behavior and context, and updating the behavior prediction model by comparing this prediction with the actual component visited next, the accuracy of predicting the user's next component can be continuously improved. On the other hand, preloading the expected next component allows for personalized component preloading, reducing component loading latency, effectively utilizing resources, and thus improving component loading efficiency.
[0103] Example 2
[0104] See Figure 3 The diagram illustrates a structural schematic of a page component loading device provided in Embodiment 3 of the present invention. Figure 3 As shown, the device is applied to a browser, and the browser's built-in database stores behavior prediction models. The device includes:
[0105] The data acquisition module 301 is used to collect the user's behavioral characteristics and contextual characteristics when the user visits the page;
[0106] User behavior prediction module 302 is used to input the behavior features and the context features into the behavior prediction model to locate the component that the user is expected to visit next on the page, as the target component.
[0107] Target component preloading module 303 is used to preload the target component in the page;
[0108] The baseline component listening module 304 is used to listen for the component that the user actually visits next on the page, and use it as a baseline component.
[0109] The behavior prediction model update module 305 is used to update the behavior prediction model based on the target component and the benchmark component.
[0110] In one embodiment of the present invention, the data acquisition module 301 includes:
[0111] The listener registration module is used to call the browser's embedded script to register listeners for the document object model when the page is initialized;
[0112] The event listening module is used to call the listener to listen for events generated when the user interacts on the page's document object model;
[0113] The behavior feature encoding module is used to encode multiple events into a preset one-dimensional convolutional neural network as temporal vectors, which serve as behavior features.
[0114] The structural data statistics module is used to collect structural data related to components of the document object model of the page.
[0115] The metrics data statistics module is used to collect and analyze metrics related to the browser's device and the device's network performance.
[0116] The preference data query module is used to query the preference data set by the user in the browser.
[0117] The context feature concatenation module is used to concatenate the structural data, the indicator data, and the preference data into context features.
[0118] In one embodiment of the present invention, the structural data includes at least one of the following:
[0119] All components contained in the page, components contained in each area of the page, and distribution information of components of a specified type on the page;
[0120] The indicator data includes at least one of the following:
[0121] The utilization rate of the device's central processing unit, the information on the device's memory and graphics processing unit support for page acceleration, the network latency, and the network bandwidth;
[0122] The preference data includes at least one of the following:
[0123] The browser's theme information, the browser's layout information, and the layout information of the functional components in the browser.
[0124] In one embodiment of the present invention, the user behavior prediction module 302 includes:
[0125] The WebWorker creation module is used to create WebWorkers.
[0126] A behavior prediction model loading module is used to load the behavior prediction model in the WebWorker page worker.
[0127] The model call request reading module is used to read model call requests constructed by the browser's main thread from a preset queue in the WebWorker; the model call request contains the behavioral features and the context features;
[0128] The model call request processing module is used in the WebWorker to input the behavioral features and the context features into the behavior prediction model according to the model call request to locate the component that the user is expected to visit next on the page, as the target component.
[0129] In one embodiment of the present invention, the behavior prediction model includes an encoder, a normalization layer, a feature extraction layer, a classification head structure, and a ranking head structure;
[0130] The model call request processing module includes:
[0131] An encoding module is used in the encoder to encode the context features into multimodal features;
[0132] The splicing module is used to splice the behavioral features and the multimodal features into a first fusion feature;
[0133] A standardization module is used in the standardization layer to perform a standardization operation on the first fusion feature based on the multimodal features to obtain a second fusion feature;
[0134] The feature extraction module is used to extract a representation vector characterizing the user intent from the second fusion feature in the feature extraction layer, as a third fusion feature;
[0135] The probability calculation module is used to generate the probability of the user selecting each component on the page based on the third fusion feature in the classification head structure.
[0136] A preference level generation module is used to generate the user's preference level for each component on the page based on the third fusion feature in the sorting header structure;
[0137] The expected value fusion module is used to fuse the probability and the preference degree into the expected value of the user's next access to various components on the page;
[0138] The target component determination module is used to determine the component with the highest expected value that the user expects to access next on the page, and obtain the target component.
[0139] In one embodiment of the present invention, the encoder includes a first fully connected layer and a second fully connected layer, and the feature extraction layer includes a multilayer perceptron;
[0140] The encoding module is also used for:
[0141] In the first fully connected layer, the context features are mapped to first intermediate features;
[0142] The first intermediate feature is activated using a linear rectified function to obtain the second intermediate feature;
[0143] In the second fully connected layer, the second intermediate feature is mapped to a multimodal feature;
[0144] The standardization module is also used for:
[0145] In the normalization layer, the multimodal features are mapped to scaling factors and offset factors. The first fused feature is normalized. If the normalization operation is completed, the offset factor is added to the product between the scaling factor and the first fused feature to obtain the second fused feature.
[0146] The expected value fusion module is also used for:
[0147] In the multilayer perceptron, the second fusion feature is subjected to multilayer linear transformation and nonlinear activation to extract a representation vector characterizing the user's intent, which serves as the third fusion feature.
[0148] The step of fusing the probability and the preference level into the expected value of the user's next access to various components on the page includes:
[0149] The probability is added to the preference level to obtain the expected value of the user's next access to various components on the page.
[0150] In one embodiment of the present invention, the behavior prediction model update module 305 includes:
[0151] The log data writing module is used to write the behavioral features and the context features as log data into the browser's database in the WebWorker if the target component is different from the baseline component.
[0152] The log data upload module is used to upload the log data stored in the browser's database to the server in the WebWorker if the amount of log data stored in the browser's database reaches a threshold. The server is used to train the behavior prediction model based on the log data to update the version of the behavior prediction model.
[0153] The hot update module is used to load a new version of the behavior prediction model from the server in the WebWorker and replace the old local version of the behavior prediction model with the new version of the behavior prediction model.
[0154] In one embodiment of the present invention, the hot update module includes:
[0155] An asynchronous task initiation module is used to initiate an asynchronous task in the WebWorker to load a new version of the behavior prediction model from the server while maintaining the local old version of the behavior prediction model.
[0156] The pointer replacement module is used in the WebWorker to add a lock to the queue, replace the pointer of the behavior prediction model from the old local version of the behavior prediction model to the new version of the behavior prediction model, and unlock the queue.
[0157] The resource release module is used to release the resources occupied by the local old version of the behavior prediction model in the WebWorker.
[0158] The page component loading device provided in the embodiments of the present invention can execute the page component loading method provided in any embodiment of the present invention, and has the corresponding functional modules and beneficial effects of executing the page component loading method.
[0159] Example 3
[0160] See Figure 4 This diagram illustrates a structural schematic of an electronic device according to an embodiment of the present invention. The electronic device is intended to represent various forms of digital computers, such as laptop computers, desktop computers, workstations, personal digital assistants, blade servers, mainframe computers, and other suitable computers. The electronic device can also represent various forms of mobile devices, such as personal digital processors, cellular phones, smartphones, wearable devices (e.g., helmets, glasses, watches, etc.), and other similar computing devices. The components shown herein, their connections and relationships, and their functions are merely illustrative and are not intended to limit the implementation of the invention described and / or claimed herein.
[0161] like Figure 4As shown, the electronic device 10 includes at least one processor 11 and a memory, such as a read-only memory (ROM) 12 or a random access memory (RAM) 13, communicatively connected to the at least one processor 11. The memory stores computer programs executable by the at least one processor. The processor 11 can perform various appropriate actions and processes based on the computer program stored in the ROM 12 or loaded from storage unit 18 into the RAM 13. The RAM 13 may also store various programs and data required for the operation of the electronic device 10. The processor 11, ROM 12, and RAM 13 are interconnected via a bus 14. An input / output (I / O) interface 15 is also connected to the bus 14.
[0162] Multiple components in electronic device 10 are connected to I / O interface 15, including: input unit 16, such as keyboard, mouse, etc.; output unit 17, such as various types of displays, speakers, etc.; storage unit 18, such as disk, optical disk, etc.; and communication unit 19, such as network card, modem, wireless transceiver, etc. Communication unit 19 allows electronic device 10 to exchange information / data with other devices through computer networks such as the Internet and / or various telecommunications networks.
[0163] Processor 11 can be a variety of general-purpose and / or special-purpose processing components with processing and computing capabilities. Some examples of processor 11 include, but are not limited to, a central processing unit (CPU), a graphics processing unit (GPU), various special-purpose artificial intelligence (AI) computing chips, various processors running machine learning model algorithms, a digital signal processor (DSP), and any suitable processor, controller, microcontroller, etc. Processor 11 performs the various methods and processes described above, such as the method for loading page components.
[0164] In some embodiments, the page component loading method may be implemented as a computer program tangibly contained in a computer-readable storage medium, such as storage unit 18. In some embodiments, part or all of the computer program may be loaded and / or installed on electronic device 10 via ROM 12 and / or communication unit 19. When the computer program is loaded into RAM 13 and executed by processor 11, one or more steps of the page component loading method described above may be performed. Alternatively, in other embodiments, processor 11 may be configured to perform the page component loading method by any other suitable means (e.g., by means of firmware).
[0165] Various embodiments of the systems and techniques described above herein can be implemented in digital electronic circuit systems, integrated circuit systems, field-programmable gate arrays (FPGAs), application-specific integrated circuits (ASICs), application-specific standard products (ASSPs), systems-on-a-chip (SoCs), payload-programmable logic devices (CPLDs), computer hardware, firmware, software, and / or combinations thereof. These various embodiments may include implementations in one or more computer programs that can be executed and / or interpreted on a programmable system including at least one programmable processor, which may be a dedicated or general-purpose programmable processor, capable of receiving data and instructions from a storage system, at least one input device, and at least one output device, and transmitting data and instructions to the storage system, the at least one input device, and the at least one output device.
[0166] Computer programs used to implement the methods of the present invention may be written in any combination of one or more programming languages. These computer programs may be provided to a processor of a general-purpose computer, a special-purpose computer, or other programmable data processing device, such that when executed by the processor, the computer programs cause the functions / operations specified in the flowcharts and / or block diagrams to be performed. The computer programs may be executed entirely on a machine, partially on a machine, or as a standalone software package, partially on a machine and partially on a remote machine, or entirely on a remote machine or server.
[0167] In the context of this invention, a computer-readable storage medium can be a tangible medium that may contain or store a computer program for use by or in conjunction with an instruction execution system, apparatus, or device. A computer-readable storage medium may include, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, apparatus, or devices, or any suitable combination thereof. Alternatively, a computer-readable storage medium may be a machine-readable signal medium. More specific examples of machine-readable storage media include electrical connections based on one or more wires, portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fibers, portable compact disk read-only memory (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination thereof.
[0168] To provide interaction with a user, the systems and techniques described herein can be implemented on an electronic device having: a display device (e.g., a CRT (cathode ray tube) or LCD (liquid crystal display) monitor) for displaying information to the user; and a keyboard and pointing device (e.g., a mouse or trackball) through which the user provides input to the electronic device. Other types of devices can also be used to provide interaction with the user; for example, feedback provided to the user can be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the user can be received in any form (including sound input, voice input, or tactile input).
[0169] The systems and technologies described herein can be implemented in computing systems that include backend components (e.g., as data servers), or computing systems that include middleware components (e.g., application servers), or computing systems that include frontend components (e.g., user computers with graphical user interfaces or web browsers through which users can interact with implementations of the systems and technologies described herein), or any combination of such backend, middleware, or frontend components. The components of the system can be interconnected via digital data communication of any form or medium (e.g., communication networks). Examples of communication networks include local area networks (LANs), wide area networks (WANs), blockchain networks, and the Internet.
[0170] A computing system can include clients and servers. Clients and servers are generally located far apart and typically interact through communication networks. The client-server relationship is created by computer programs running on the respective computers and having a client-server relationship with each other. The server can be a cloud server, also known as a cloud computing server or cloud host, which is a hosting product within the cloud computing service system to address the shortcomings of traditional physical hosts and VPS services, such as high management difficulty and weak business scalability.
[0171] Example 4
[0172] This invention also provides a computer program product, which includes a computer program that, when executed by a processor, implements a page component loading method as provided in any embodiment of this invention.
[0173] In implementing the computer program product, computer program code for performing the operations of this invention can be written in one or more programming languages or a combination thereof. Programming languages include object-oriented programming languages such as Java, Smalltalk, and C++, as well as conventional procedural programming languages such as C or similar languages. The program code can be executed entirely on the user's computer, partially on the user's computer, as a standalone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving remote computers, the remote computer can be connected to the user's computer via any type of network—including a local area network (LAN) or a wide area network (WAN)—or can be connected to an external computer (e.g., via the Internet using an Internet service provider).
[0174] It should be understood that the various forms of processes shown above can be used, with steps reordered, added, or deleted. For example, the steps described in this invention can be executed in parallel, sequentially, or in different orders, as long as the desired result of the technical solution of this invention can be achieved, and this is not limited herein.
[0175] The specific embodiments described above do not constitute a limitation on the scope of protection of this invention. Those skilled in the art should understand that various modifications, combinations, sub-combinations, and substitutions can be made according to design requirements and other factors. Any modifications, equivalent substitutions, and improvements made within the spirit and principles of this invention should be included within the scope of protection of this invention.
Claims
1. A method for loading a page component, characterized in that, Applied to a browser, wherein the browser's built-in database stores behavior prediction models, the method includes: When a user visits a page, the user's behavioral characteristics and contextual characteristics are collected for that page; The behavioral features and the contextual features are input into the behavior prediction model to locate the component that the user is expected to visit next on the page, which is then used as the target component. The target component is preloaded on the page; Listen for the component that the user actually visits next on the page, and use it as a baseline component; The behavior prediction model is updated based on the target component and the benchmark component; The behavior prediction model includes an encoder, a normalization layer, a feature extraction layer, a classification head structure, and a ranking head structure. The behavioral features and contextual features are input into the behavior prediction model to locate the component that the user is expected to visit next on the page, as the target component, including: In the encoder, the contextual features are encoded as multimodal features; The behavioral features and the multimodal features are concatenated to form a first fusion feature; In the normalization layer, the multimodal features are mapped to scaling factors and offset factors. The first fused feature is normalized. If the normalization operation is completed, the offset factor is added to the product between the scaling factor and the first fused feature to obtain the second fused feature. In the feature extraction layer, a representation vector characterizing the user's intent is extracted from the second fusion feature as a third fusion feature; In the classification header structure, the probability of the user selecting each component on the page is generated based on the third fusion feature; In the sorting header structure, the user's preference for each component on the page is generated based on the third fusion feature; The probability and the degree of preference are combined to form the expected value of the user's next access to various components on the page; Determine the component with the highest expected value that the user expects to access next on the page, and obtain the target component.
2. The method according to claim 1, characterized in that, The step of collecting user behavior characteristics and contextual characteristics for a page when the user visits the page includes: When initializing the page, the browser's embedded script is invoked to register a listener for the Document Object Model; The listener is invoked to listen for events generated when the user interacts with the page's document object model; The multiple events are input into a pre-set one-dimensional convolutional neural network and encoded into a temporal vector as behavioral features. The document object model of the page is used to collect structural data related to components. The browser's device and the device's network statistics and performance-related metrics are collected separately. Query the user's preference data set in the browser; The structural data, the indicator data, and the preference data are concatenated to form a contextual feature.
3. The method according to claim 2, characterized in that, The structured data includes at least one of the following: All components contained in the page, components contained in each area of the page, and distribution information of components of a specified type on the page; The indicator data includes at least one of the following: The utilization rate of the device's central processing unit, the information on the device's memory and graphics processing unit support for page acceleration, the network latency, and the network bandwidth; The preference data includes at least one of the following: The browser's theme information, the browser's layout information, and the layout information of the functional components in the browser.
4. The method according to any one of claims 1-3, characterized in that, The step of inputting the behavioral features and the contextual features into the behavior prediction model to locate the component that the user is expected to visit next on the page, as the target component, includes: Create a WebWorker; Load the behavior prediction model into the WebWorker page worker; In the WebWorker, a model invocation request constructed by the browser's main thread is read from a pre-defined queue; the model invocation request contains the behavioral features and the context features. In the WebWorker, the behavioral features and contextual features are input into the behavior prediction model according to the model call request to locate the component that the user is expected to visit next on the page, as the target component.
5. The method according to claim 1, characterized in that, The encoder includes a first fully connected layer and a second fully connected layer, and the feature extraction layer includes a multilayer perceptron. The encoder wherein the context features are encoded into multimodal features includes: In the first fully connected layer, the context features are mapped to first intermediate features; The first intermediate feature is activated using a linear rectified function to obtain the second intermediate feature; In the second fully connected layer, the second intermediate feature is mapped to a multimodal feature; In the feature extraction layer, extracting a representation vector characterizing the user's intent from the second fusion feature as a third fusion feature includes: In the multilayer perceptron, the second fusion feature is subjected to multilayer linear transformation and nonlinear activation to extract a representation vector characterizing the user's intent, which serves as the third fusion feature. The step of fusing the probability and the preference level into the expected value of the user's next access to various components on the page includes: The probability is added to the preference level to obtain the expected value of the user's next access to various components on the page.
6. The method according to claim 4, characterized in that, Updating the behavior prediction model based on the target component and the benchmark component includes: If the target component is different from the baseline component, then in the WebWorker, the behavioral features and the context features are written as log data into the browser's database; If the amount of log data stored in the browser's database reaches a threshold, the WebWorker uploads the log data stored in the browser's database to the server. The server then uses the log data to train the behavior prediction model and update the version of the behavior prediction model. In the WebWorker, a new version of the behavior prediction model is loaded from the server, replacing the old local version of the behavior prediction model.
7. The method according to claim 6, characterized in that, The step of loading a new version of the behavior prediction model from the server in the WebWorker and replacing the old local version of the behavior prediction model with the new version includes: An asynchronous task is initiated in the WebWorker to load a new version of the behavior prediction model from the server while maintaining the local old version of the behavior prediction model; In the WebWorker, a lock is added to the queue, the pointer of the behavior prediction model is replaced from the old local version of the behavior prediction model to the new version of the behavior prediction model, and the lock is released on the queue. In the WebWorker, release the resources occupied by the local older version of the behavior prediction model.
8. An electronic device, characterized in that, The electronic device includes: At least one processor; and A memory communicatively connected to the at least one processor; wherein, The memory stores a computer program that can be executed by the at least one processor, the computer program being executed by the at least one processor to enable the at least one processor to perform the page component loading method as described in any one of claims 1-7.
9. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program that, when executed by a processor, implements the method for loading page components as described in any one of claims 1-7.
Citation Information
Patent Citations
Personalized page preloading method and system based on user behaviors
CN109918150A
Vue component loading method and device, equipment and storage medium
CN119045919A