Page component loading method and device and storage medium
By building a behavior prediction model in the browser, collecting user behavior characteristics and context characteristics, predicting and preloading components, the problems of lazy loading components are solved, and the efficiency of component loading is improved.
Patent Information
- Application Number
- CN202510700832.2
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-05-28
- Publication Date
- 2025-08-29
- Estimated Expiration
- 2045-05-28
AI Technical Summary
In large single-page applications, lazy loading components rely on static rules to cause component loading delays and waste of resources, which is less efficient.
By building a behavior prediction model in the browser, users' behavior characteristics and context characteristics are collected, and components that users will access next step are predicted and preloaded, and the model is updated based on actual access components, improving the accuracy and efficiency of component loading.
It realizes personalized preloading of component loading, reduces delays, effectively utilizes resources, and improves the efficiency of component loading.
Smart Images

Figure CN120561398A_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the technical field of browsers, and in particular to a method, device and storage medium for loading page components. Background Art
[0002] In some large single-page applications (SPAs), there are many components on the page, such as basic components (such as buttons and input boxes), business components (such as shopping cart modules and user information cards), routing components, and so on.
[0003] Currently, in order to reduce loading events, these components are usually loaded using lazy loading. Lazy loading is mainly triggered based on rules, for example, lazy loading based on front-end routing, lazy loading triggered by scrolling, and so on.
[0004] The rules that lazy loading relies on are mainly static rules (such as scroll position, user clicks, route switching, etc.). Not only is there a certain delay when loading components, but the loaded components may not be what the user needs, which wastes resources and leads 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 a page component, which is applied to a browser, wherein a behavior prediction model is stored in a built-in database of the browser, and the method comprises:
[0007] When a user visits a page, the user's behavior characteristics and context characteristics are collected for the page;
[0008] Inputting the behavior feature and the context feature into the behavior prediction model to locate the component that the user is expected to access next on the page as a target component;
[0009] Preloading the target component in the page;
[0010] monitoring, on the page, the component that the user actually accesses next on the page as a reference component;
[0011] The behavior prediction model is updated according to the target component and the reference component.
[0012] A second aspect of the present invention provides a device for loading a page component, which is applied to a browser, wherein a behavior prediction model is stored in a built-in database of the browser, and the device comprises:
[0013] A data collection module is used to collect the user's behavioral characteristics and context characteristics for the page when the user visits the page;
[0014] A user behavior prediction module, configured to input the behavior feature and the context feature into the behavior prediction model to locate the component that the user is expected to access next on the page as a target component;
[0015] A target component preloading module, used for preloading the target component in the page;
[0016] A reference component monitoring module is used to monitor, in the page, the component that the user actually accesses next in the page as a reference component;
[0017] A behavior prediction model updating module is used to update the behavior prediction model according to the target component and the benchmark component.
[0018] A third aspect of the present invention provides an 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, and the computer program is executed by the at least one processor so that the at least one processor can execute the page component loading method described in the first aspect above.
[0022] A fourth aspect of the present invention provides a computer-readable storage medium storing a computer program, wherein the computer program, 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, which includes a computer program. When the computer program is executed by a processor, it implements the method for loading a page component as described in the first aspect above.
[0024] In this embodiment, when a user accesses a page, the user's behavioral characteristics and contextual characteristics are collected for the page; the behavioral characteristics and contextual characteristics are input into a behavior prediction model to locate the component that the user is expected to access next on the page, which is used as the target component; the target component is preloaded on the page; the component that the user actually accesses next on the page is monitored on the page, which is used as the benchmark component; and the behavior prediction model is updated based on the target component and the benchmark component. On the one hand, based on the user's behavior and context, the component that the user is expected to access next on the page is determined, and by comparing the updated behavior prediction model with the component that the user actually accesses next on the page, the accuracy of predicting the component that the user will access next on the page can be continuously improved. On the other hand, preloading the component that the user is expected to access next on the page achieves personalized preloading of components, reduces the delay in loading components, effectively utilizes resources, and thus improves the efficiency of loading components.
[0025] It should be understood that the content described in this section is not intended to identify the key or important features of the embodiments of the present invention, nor is it intended to limit the scope of the present invention. Other features of the present invention will become readily understood through the following description. BRIEF DESCRIPTION OF THE DRAWINGS
[0026] In order to more clearly illustrate the technical solutions in the embodiments of the present invention, the following briefly introduces the drawings required for use in the description of the embodiments. Obviously, the drawings described below are only some embodiments of the present invention. For ordinary technicians in this field, other drawings can be obtained based on these drawings without creative work.
[0027] Figure 1 This is a flowchart of a method for loading a page component provided in Example 1 of the present invention.
[0028] Figure 2 Schematic diagram of a behavior prediction model provided in accordance with the first embodiment of the present invention.
[0029] Figure 3 It is a structural diagram of a loading device for a page component provided in the second embodiment of the present invention.
[0030] Figure 4 This is a structural diagram of an electronic device provided in Example 3 of the present invention. DETAILED DESCRIPTION
[0031] In order to enable those skilled in the art to better understand the solutions of the present invention, the technical solutions in the embodiments of the present invention will be clearly and completely described below in conjunction with the drawings in the embodiments of the present invention. Obviously, the embodiments described are only part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without making creative efforts should fall within the scope of protection of the present invention.
[0032] It should be noted that the terms "first", "second", etc. in the description and claims of the present invention and the above-mentioned drawings are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that the numbers used in this way can be interchanged where appropriate, so that the embodiments of the present invention described herein can cover sequential implementations other than those illustrated or described herein. In addition, the terms "including" and "having" and any variations thereof are intended to cover non-exclusive inclusions. For example, a process, method, system, product or device that includes a series of steps or units is not necessarily limited to those steps or units clearly listed, but may include other steps or units that are not clearly listed or inherent to these processes, methods, products or devices.
[0033] Example 1
[0034] See also Figure 1 , shows a flow chart of a method for loading a page component provided by a first embodiment of the present invention. The method can be executed by a loading device for a page component. The loading device for the page component can be implemented in the form of hardware and / or software. The loading device for the page component can be configured in an electronic device. Figure 1 As shown, the method includes:
[0035] Step 101: When a user accesses a page, the user's behavior characteristics and context characteristics are collected for the page.
[0036] This embodiment can be applied to browsers, especially large browsers. When a user (indicated by an identifier such as a user ID) accesses a page, the main thread of the browser's rendering process collects behavioral characteristics of the user when interacting on the page, as well as contextual characteristics related to locating the component that the user expects to access next on the page.
[0037] When predicting the component that the user will visit next on the page, the output component distribution will also be adjusted due to different contextual inputs on different pages. By collecting the context of different pages and learning the scenario data of different pages, the behavior prediction model can learn to associate the page context with the component loading requirements, thereby achieving dynamic adaptation of component loading.
[0038] On the one hand, when the page is initialized, the browser embedded script (such as JavaScript script) is called to register the Document Object Model (DOM) listener (such as addEventListener), and the listener is called to monitor the Document Object Model of the page for events generated when the user interacts on the page, such as clicks, scrolling, mouse hovering, page switching, etc. Each event is encapsulated into an event object, which contains information such as event type, timestamp, target element ID, coordinates, etc.
[0039] Furthermore, the main thread can use methods such as worker.postMessage to pass events to the preprocessing module for event preprocessing to improve their quantity and quality. For example, the collected events can be filtered to remove duplicate or invalid events, etc.
[0040] Count the frequency and time distribution of each event in the past period or multiple interactions, count and aggregate each event, input multiple events into a preset one-dimensional convolutional neural network, and encode them into a fixed-length time series vector as a behavioral feature.
[0041] On the other hand, components arranged in different pages are different, so structural data related to the components can be counted for the document object model of the page.
[0042] Exemplarily, the structure data includes at least one of the following:
[0043] All components contained in the page, components contained in each area of the page (such as the header area, the navigation bar area, the content area, the footer area, etc.), and the distribution information (such as percentage, etc.) of components of a specified type (such as input boxes, buttons, tables, etc.) on the page.
[0044] The device where the browser is located and the network of the device have an external impact on the user's behavior of accessing components. Therefore, performance-related indicator data can be collected for the device where the browser is located and the network of the device.
[0045] Exemplarily, the indicator data includes at least one of the following:
[0046] The device's central processing unit (CPU) utilization, the device's memory usage, information about the graphics processing unit (GPU)'s support for page acceleration, network latency, and network bandwidth.
[0047] Querying the preference data set by the user in the browser has an inherent impact on the user's behavior of accessing components. Therefore, under circumstances such as user authorization, the preference data set by the user in the browser can be queried.
[0048] Exemplarily, the preference data includes at least one of the following:
[0049] The browser's theme information, the browser's layout information, and the layout information of the functional components in the browser.
[0050] The above structural data, indicator data and preference data are spliced into contextual features.
[0051] Of course, the above context features are merely examples. When implementing this embodiment, other context features may be configured based on actual circumstances, and this embodiment does not limit this. Furthermore, in addition to the above context features, those skilled in the art may also utilize other context features based on actual needs, and this embodiment does not limit this.
[0052] Both user behavior features and context features are feature vectors, which are fixed-length numerical arrays used to quantify key information describing user behavior and key information that affects user access to components, allowing the behavior prediction model to receive data in a unified format as input.
[0053] The user's behavioral characteristics and contextual characteristics are stored in formats such as JSON (JavaScript Object Notation). The main thread encapsulates the user's behavioral characteristics and contextual characteristics into a model call request, writes the model call request into a queue in the cache, and waits to be passed to the behavior prediction model for inference.
[0054] Furthermore, the main thread can optimize the construction model call request in terms of timing selection and structure optimization rules.
[0055] 1. Timing
[0056] Trigger conditions: Based on the overall loading status of the page and user behavior (such as long periods of inactivity or page stay exceeding a threshold), choose the appropriate time to build a model call request.
[0057] Reduce frequency: By setting a time window and dilution mechanism, a model call request is constructed when the user's behavioral characteristics and contextual characteristics accumulate to a certain amount or when a significant behavioral change occurs, thereby reducing the computing load.
[0058] 2. Result optimization rules
[0059] Context-based rule adjustment: If some key components have already been loaded on the page, exclude these components from the contextual features and focus on preloading other components that have not yet been loaded and may be needed by users.
[0060] Step 102: Input the behavior features and context features into the behavior prediction model to locate the component that the user is expected to access next on the page 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). After that, the inference environment of the behavior prediction model is initialized so that the behavior prediction model can run normally. The behavior features and context features are input into the behavior prediction model to locate the component that the user may expect to visit next on the page as the target component.
[0062] In practice, a WebWorker can be created, independent of the browser's main thread. A Web Worker is a network interface that allows JavaScript to execute code in a background thread, resolving the blocking issues inherent in JavaScript's single-threaded model. Its primary function is to create a multi-threaded environment for JavaScript, assigning time-consuming tasks to Worker threads while ensuring the smooth operation of the main thread (typically responsible for UI interaction).
[0063] In the page worker Web Worker, check whether there is a pre-trained behavior prediction model in the local database (such as IndexedDB). If not, obtain the behavior prediction model from the server and load the behavior prediction model in the page worker Web Worker. If so, load the behavior prediction model from the local database (such as IndexedDB) in the page worker Web Worker to avoid blocking the main thread.
[0064] In the page worker WebWorker, the model call request constructed by the main thread of the browser is read from the queue preset in the cache; wherein the model call request includes behavioral features and context features.
[0065] In the WebWorker, the behavioral features and context 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 as the target component.
[0066] In one design, Figure 2 As shown in the figure, the behavior prediction model includes an encoder, a normalization layer, a feature extraction layer, a classification head structure and a sorting head structure.
[0067] In the encoder, the context feature context is encoded into a multimodal feature c.
[0068] Exemplarily, the encoder includes two fully connected layers (FC), which are respectively denoted as a first fully connected layer FC1 and a second fully connected layer FC2.
[0069] In the first fully connected layer FC1, the context feature context is mapped to the first intermediate feature, and the first intermediate feature is activated using the linear rectification function (Rectified Linear Unit, ReLU) 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 expressed as c=FC2(ReLU(FC1(context))).
[0071] The behavioral feature b and the multimodal feature c are concatenated into the first fusion feature X0, that is, X0 = [c; b], where “;” represents addition, that is, X0 = c + b.
[0072] In the standardization layer, a standardization operation is performed on the first fused feature X0 based on the multimodal feature c to obtain the second fused feature X, realizing a context-based dynamic standardization mechanism, which can enhance the generalization ability of different devices and pages.
[0073] Exemplarily, in the normalization layer, the multimodal feature c is mapped to a scaling factor α(c) and an 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 of 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 intention is extracted from the second fused feature X as the third fused feature h.
[0075] Exemplarily, the feature extraction layer includes a multilayer perceptron (MLP), in which the second fused feature X is subjected to multilayer linear transformation and nonlinear activation to extract a representation vector representing the user intention as the third fused feature h, that is, 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] Among them, the classification head structure can adopt softmax, and the loss function is cross entropy.
[0078] In the sorting header structure, the user's preference 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 for the i-th component on the page, i∈n, and n is the number of components on the page.
[0079] Among them, the sorting head structure is a regression layer, the loss function is regression loss or sorting loss, and the user's preference for each component on the page is the sorting score of each component, which allows adjustment of not only the component with the highest probability, but also a combination of multiple components.
[0080] Use a linear or nonlinear method to fuse the probability pi and the preference degree si into the expected value ri of the user's next visit to each component on the page.
[0081] Exemplarily, the probability pi is added to the preference degree si to obtain the expected value ri of the user's next visit to each component on the page, that is, ri=pi+si.
[0082] Compare the expected values ri of each component, determine the component with the highest expected value ri that the user expects to access next on the page, and obtain the target component.
[0083] Step 103: Preload the target component in the page.
[0084] The page worker WebWorker passes the component identifier (such as component ID, etc.) of the target component to the main thread through methods such as postMessage, and the main thread asynchronously loads the target component using JavaScript's ES6 dynamic import syntax and other methods.
[0085] The component identification, loading event and other information of the target component are recorded in the cache so that when subsequent users access the target component, they can directly obtain the target component from the cache based on the target component information to avoid repeated loading.
[0086] Step 104: Monitor the component that the user actually accesses next on the page as the reference component.
[0087] The main thread monitors in real time the component that the user actually visits next on the page, which is recorded as the benchmark component.
[0088] Step 105: Update the behavior prediction model based on the target component and the benchmark component.
[0089] The main thread compares the target component with the benchmark component to identify the performance of the behavior prediction model, thereby updating the behavior prediction model in a timely manner to improve the performance of the behavior prediction model.
[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 reference component, then in the WebWorker, the behavior characteristics and the context characteristics are written as log data into the database of the browser.
[0092] If the benchmark component actually accessed by the user is inconsistent with the target component predicted to be accessed by the user, it means that there is a deviation in this prediction. In this case, the main thread notifies the page worker WebWorker to collect the user's recent behavioral characteristics (such as event type, timestamp, target element ID, coordinates, etc.) and context characteristics, encapsulate them in a format such as JSON, and write them as log data to the browser's database (such as IndexedDB) to ensure that the log data is not lost in the event of a page refresh or a brief network failure.
[0093] Step 1052: If the amount of log data stored in the database of the browser reaches a threshold, the log data stored in the database of the browser is uploaded to the server in the WebWorker.
[0094] When the number of local log data in the browser's database reaches a preset threshold (such as 200), the page worker WebWorker automatically triggers the log data to be uploaded to the server. At this time, AJAX (Asynchronous JavaScript And XML) or FetchAPI (a JavaScript API) is used to upload the log data stored in the browser's database to the server. When the upload is successful, the log data stored in the browser's database is cleared.
[0095] The server is used to train the behavior prediction model based on the log data using methods such as fine-tuning to update the version of the behavior prediction model. At this time, the server maintains the new version of the behavior prediction model, and the browser maintains the old version of the behavior prediction model.
[0096] Step 1053: In the WebWorker, a new version of the behavior prediction model is loaded from the server, and the new version of the behavior prediction model replaces the local old version of the behavior prediction model.
[0097] In the page worker WebWorker, call the preset API (Application Programming Interface) to load the new version of the behavior prediction model from the server, replace the local old version of the behavior prediction model with the new version of the behavior prediction model, and hot update the behavior prediction model in the page worker WebWorker to keep the current business process running normally.
[0098] In the specific implementation, the preset API is called periodically in the page worker WebWorker to check whether there is a new version of the behavior prediction model. If there is a new version of the behavior prediction model, 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 (that is, the old version of the behavior prediction model continues to process the model call requests in the queue).
[0099] In the page worker WebWorker, a lock is added to the queue. The lock mechanism will temporarily cache the newly received model call requests in the queue to ensure that no new model call requests enter the processing flow during the switching period. When the queue is locked, the pointer (or reference, such as global variables, model instances in state objects, etc.) of the behavior prediction model is replaced from the local old version of the behavior prediction model to the new version of the behavior prediction model to realize the pointer replacement of the behavior prediction model. At this time, the queue is unlocked and the model call requests in the queue are gradually released. The new version of the behavior prediction model takes over the processing to realize the switching of the behavior prediction model.
[0100] In the page worker 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 page worker WebWorker completes the hot update of the 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 accesses a page, the user's behavioral characteristics and contextual characteristics are collected for the page; the behavioral characteristics and contextual characteristics are input into a behavior prediction model to locate the component that the user is expected to access next on the page, which is used as the target component; the target component is preloaded on the page; the component that the user actually accesses next on the page is monitored on the page, which is used as the benchmark component; and the behavior prediction model is updated based on the target component and the benchmark component. On the one hand, based on the user's behavior and context, the component that the user is expected to access next on the page is determined, and by comparing the updated behavior prediction model with the component that the user actually accesses next on the page, the accuracy of predicting the component that the user will access next on the page can be continuously improved. On the other hand, preloading the component that the user is expected to access next on the page achieves personalized preloading of components, reduces the delay in loading components, effectively utilizes resources, and thus improves the efficiency of loading components.
[0103] Example 2
[0104] See also Figure 3 , shows a schematic diagram of the structure of a loading device for a page component provided by the third embodiment of the present invention. Figure 3 As shown, it is applied to a browser, and the behavior prediction model is stored in a built-in database of the browser. The device includes:
[0105] The data collection module 301 is used to collect the user's behavior characteristics and context characteristics for the page when the user visits the page;
[0106] A user behavior prediction module 302 is configured to input the behavior feature and the context feature into the behavior prediction model to locate the component that the user is expected to access next on the page as a target component;
[0107] A target component preloading module 303 is configured to preload the target component in the page;
[0108] A reference component monitoring module 304 is used to monitor the component that the user actually accesses next on the page as a reference component;
[0109] The behavior prediction model updating module 305 is configured to update the behavior prediction model according to the target component and the reference component.
[0110] In one embodiment of the present invention, the data acquisition module 301 includes:
[0111] A listener registration module, configured to call the browser embedded script to register a listener of the document object model when initializing a page;
[0112] An event monitoring module, configured to call the listener to monitor the document object model of the page for events generated when the user interacts on the page;
[0113] A behavior feature encoding module, configured to input a plurality of the events into a preset one-dimensional convolutional neural network and encode them into time series vectors as behavior features;
[0114] A structural data statistics module, used for counting structural data related to components in the document object model of the page;
[0115] An indicator data statistics module, used to collect performance-related indicator data of the device where the browser is located and the network of the device;
[0116] A preference data query module, used to query the preference data set by the user in the browser;
[0117] A context feature splicing module is used to splice 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 included in the page, components included 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 central processing unit of the device, information on the device's use of memory and graphics processor to support 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 page worker creation module is used to create the page worker WebWorker;
[0126] A behavior prediction model loading module, configured to load the behavior prediction model into the WebWorker;
[0127] A model call request reading module is used to read the model call request constructed by the main thread of the browser from a preset queue in the page worker WebWorker; the model call request includes the behavioral feature and the context feature;
[0128] The model call request processing module is used to input the behavior features and the context features into the behavior prediction model in the page worker WebWorker according to the model call request to locate the component that the user is expected to access next in 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 sorting head structure;
[0130] The model call request processing module includes:
[0131] an encoding module, configured to encode the contextual features into multimodal features in the encoder;
[0132] A splicing module, configured to splice the behavioral feature and the multimodal feature into a first fusion feature;
[0133] a normalization module, configured to perform a normalization operation on the first fused feature according to the multimodal feature in the normalization layer to obtain a second fused feature;
[0134] a feature extraction module, configured to extract, in the feature extraction layer, a representation vector representing the user intention from the second fused feature as a third fused feature;
[0135] a probability calculation module, configured to generate, in the classification header structure, a probability that the user has selected each component on the page based on the third fusion feature;
[0136] a preference level generating module, configured to generate, in the sorting header structure, the user's preference level for each component on the page based on the third fusion feature;
[0137] an expected value fusion module, configured to fuse the probability and the preference degree into an expected value of the user accessing each component in the next step 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 multi-layer perceptron;
[0140] The encoding module is also used for:
[0141] In the first fully connected layer, mapping the context feature into a first intermediate feature;
[0142] Activating the first intermediate feature using a linear rectification function to obtain a second intermediate feature;
[0143] In the second fully connected layer, mapping the second intermediate features into multimodal features;
[0144] The standardization module is also used to:
[0145] In the normalization layer, the multimodal feature is mapped into a scaling factor and an offset factor, and a normalization operation is performed on the first fused feature. If the normalization operation is completed, the offset factor is added to the product of the scaling factor and the first fused feature to obtain a second fused feature;
[0146] The expected value fusion module is also used for:
[0147] In the multi-layer perceptron, performing multi-layer linear transformation and nonlinear activation on the second fused feature to extract a representation vector representing the user intention as a third fused feature;
[0148] The step of fusing the probability and the preference degree into an expected value of the user accessing each component in the next step on the page includes:
[0149] The probability is added to the preference degree to obtain the expected value of the user visiting each component in the next step on the page.
[0150] In one embodiment of the present invention, the behavior prediction model updating module 305 includes:
[0151] a log data writing module, configured to write the behavior characteristics and the context characteristics as log data into a database of the browser in the WebWorker if the target component is different from the reference component;
[0152] a log data uploading module, configured to upload the log data stored in the database of the browser to a server in the WebWorker if the amount of the log data stored in the database of the browser reaches a threshold, wherein the server is configured to train the behavior prediction model based on the log data to update a version of the behavior prediction model;
[0153] A hot update module is used to load a new version of the behavior prediction model from the server in the page worker WebWorker, and replace the local old 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 starting module, configured to start an asynchronous task in the WebWorker to load a new version of the behavior prediction model from the server while maintaining the old version of the behavior prediction model locally;
[0156] A pointer replacement module is used to add a lock to the queue in the web worker, replace the pointer of the behavior prediction model from the local old 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 page worker WebWorker.
[0158] The page component loading device provided in the embodiment 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 also Figure 4 , shows a schematic structural diagram of an electronic device provided by 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 may also represent various forms of mobile devices, such as personal digital processing, cellular phones, smart phones, wearable devices (such as helmets, glasses, watches, etc.), and other similar computing devices. The components shown herein, their connections and relationships, and their functions are merely examples and are not intended to limit the implementation of the present 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, a random access memory (RAM) 13, etc., which is communicatively connected to the at least one processor 11. The memory stores a computer program that can be executed by the at least one processor. The processor 11 can perform various appropriate actions and processes according to the computer program stored in the read-only memory (ROM) 12 or the computer program loaded from the storage unit 18 into the random access memory (RAM) 13. Various programs and data required for the operation of the electronic device 10 can also be stored in the RAM 13. The processor 11, ROM 12, and RAM 13 are connected to each other via a bus 14. An input / output (I / O) interface 15 is also connected to the bus 14.
[0162] Multiple components in the electronic device 10 are connected to the I / O interface 15, including an input unit 16, such as a keyboard, a mouse, etc.; an output unit 17, such as various types of displays, speakers, etc.; a storage unit 18, such as a magnetic disk, an optical disk, etc.; and a communication unit 19, such as a network card, a modem, a wireless communication transceiver, etc. The communication unit 19 allows the electronic device 10 to exchange information / data with other devices via a computer network such as the Internet and / or various telecommunication networks.
[0163] The processor 11 can be any general-purpose and / or specialized processing component with processing and computing capabilities. Some examples of the processor 11 include, but are not limited to, a central processing unit (CPU), a graphics processing unit (GPU), various specialized artificial intelligence (AI) computing chips, various processors that run machine learning model algorithms, a digital signal processor (DSP), and any appropriate processor, controller, microcontroller, etc. The processor 11 executes the various methods and processes described above, such as the method for loading the page component.
[0164] In some embodiments, the method for loading a page component may be implemented as a computer program, which is tangibly contained in a computer-readable storage medium, such as the storage unit 18. In some embodiments, part or all of the computer program may be loaded and / or installed on the electronic device 10 via the ROM 12 and / or the communication unit 19. When the computer program is loaded into the RAM 13 and executed by the processor 11, one or more steps of the method for loading a page component described above may be performed. Alternatively, in other embodiments, the processor 11 may be configured to execute the method for loading a page component in any other appropriate manner (e.g., by means of firmware).
[0165] Various embodiments of the systems and techniques described 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), system-on-chip systems (SOCs), programmable logic devices (CPLDs), computer hardware, firmware, software, and / or combinations thereof. These various embodiments can include being implemented in one or more computer programs that are executable and / or interpreted on a programmable system that includes at least one programmable processor, which can be a special purpose or general purpose programmable processor that can receive data and instructions from a storage system, at least one input device, and at least one output device, and transmit data and instructions to the storage system, the at least one input device, and the at least one output device.
[0166] Computer programs for implementing 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 the computer program is executed by the processor, the functions / operations specified in the flowcharts and / or block diagrams are implemented. The computer program may be executed entirely on the machine, partially on the machine, as a stand-alone software package, partially on the machine and partially on a remote machine, or entirely on a remote machine or server.
[0167] In the context of the present invention, computer-readable storage media can be tangible media that can contain or store a computer program for use with an instruction execution system, device or equipment or used in combination with an instruction execution system, device or equipment. Computer-readable storage media can include but are not limited to electronic, magnetic, optical, electromagnetic, infrared or semiconductor systems, devices or equipment, or any suitable combination of the foregoing. Alternatively, computer-readable storage media can be machine-readable signal media. More specific examples of machine-readable storage media can include electrical connections based on one or more lines, portable computer disks, hard disks, random access memories (RAM), read-only memories (ROM), erasable programmable read-only memories (EPROM or flash memory), optical fibers, portable compact disk read-only memories (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination of the foregoing.
[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 can provide input to the electronic device. Other types of devices can also be used to provide interaction with the user; for example, the 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 acoustic input, voice input, or tactile input).
[0169] The systems and techniques described herein can be implemented in a computing system that includes back-end components (e.g., as a data server), or a computing system that includes middleware components (e.g., an application server), or a computing system that includes front-end components (e.g., a user computer with a graphical user interface or web browser through which a user can interact with implementations of the systems and techniques described herein), or a computing system that includes any combination of such back-end components, middleware components, or front-end components. The components of the system can be interconnected by any form or medium of digital data communication (e.g., a communication network). Examples of communication networks include: a local area network (LAN), a wide area network (WAN), a blockchain network, and the Internet.
[0170] A computing system may include clients and servers. The clients and servers are typically remote from each other and typically interact via a communication network. This client-server relationship arises through computer programs running on the respective computers, creating a client-server relationship. The server may be a cloud server, also known as a cloud computing server or cloud host. This server is a hosting product within the cloud computing service ecosystem that addresses the management difficulties and limited scalability of traditional physical hosting and VPS services.
[0171] Example 4
[0172] An embodiment of the present invention further provides a computer program product, which includes a computer program. When the computer program is executed by a processor, it implements the method for loading a page component as provided in any embodiment of the present invention.
[0173] The computer program product may be implemented by writing computer program code for performing the operations of the present invention in one or more programming languages, or a combination thereof, including object-oriented programming languages such as Java, Smalltalk, C++, and conventional procedural programming languages such as "C" or similar programming languages. The program code may be executed entirely on the user's computer, partially on the user's computer, as a stand-alone 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 a remote computer, the remote computer may 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 may 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 the processes shown above can be used to reorder, add, or delete steps. For example, the steps described in the present invention can be performed in parallel, sequentially, or in a different order, as long as the desired results of the technical solution of the present invention can be achieved. This is not limited herein.
[0175] The above specific embodiments do not limit the scope of protection of the present invention. Those skilled in the art will appreciate that various modifications, combinations, sub-combinations, and substitutions may be made based on design requirements and other factors. Any modifications, equivalent substitutions, and improvements made within the spirit and principles of the present invention are intended to be included within the scope of protection of the present invention.
Claims
1. A method for loading a page component, characterized in that: Applied to a browser, wherein a behavior prediction model is stored in a built-in database of the browser, the method includes: When a user visits a page, the user's behavior characteristics and context characteristics are collected for the page; Inputting the behavior feature and the context feature into the behavior prediction model to locate the component that the user is expected to access next on the page as a target component; Preloading the target component in the page; monitoring, on the page, the component that the user actually accesses next on the page as a reference component; The behavior prediction model is updated according to the target component and the reference component.
2. The method according to claim 1, characterized in that When a user accesses a page, collecting the user's behavior characteristics and context characteristics for the page includes: When initializing the page, calling the browser embedded script to register the listener of the document object model; Calling the listener to monitor the document object model of the page for events generated when the user interacts on the page; Inputting the plurality of events into a preset one-dimensional convolutional neural network and encoding them into time series vectors as behavioral features; Counting component-related structural data of the document object model of the page; Statistical and performance-related indicator data for the device where the browser is located and the network of the device; Querying the preference data set by the user in the browser; The structural data, the indicator data, and the preference data are spliced into context features.
3. The method according to claim 2, characterized in that The structure data includes at least one of the following: All components included in the page, components included 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 central processing unit of the device, information on the device's use of memory and graphics processor to support 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 to 3, characterized in that Inputting the behavior feature and the context feature into the behavior prediction model to locate the component that the user is expected to access next on the page as the target component includes: Create a page worker WebWorker; Loading the behavior prediction model in the web worker; In the WebWorker, a model call request constructed by the main thread of the browser is read from a preset queue; the model call request includes the behavioral feature and the context feature; In the web worker WebWorker, the behavior feature and the context feature are input into the behavior prediction model according to the model call request to locate the component that the user is expected to access next in the page as the target component.
5. The method according to claim 4, characterized in that The behavior prediction model includes an encoder, a normalization layer, a feature extraction layer, a classification head structure and a sorting head structure; The step of inputting the behavior feature and the context feature into the behavior prediction model according to the model call request to locate the component that the user is expected to access next on the page as the target component includes: In the encoder, encoding the contextual features into multimodal features; splicing the behavioral feature and the multimodal feature into a first fusion feature; In the normalization layer, a normalization operation is performed on the first fused feature according to the multimodal feature to obtain a second fused feature; In the feature extraction layer, extracting a representation vector representing the user intention from the second fused feature as a third fused feature; In the classification head structure, the probability of the user selecting each component on the page is generated according to the third fusion feature; In the sorting header structure, generating the user's preference for each component on the page based on the third fusion feature; Merging the probability and the preference degree into the expected value of the user visiting each component in the next step on the page; Determine the component with the highest expected value that the user expects to access next on the page, and obtain a target component.
6. The method according to claim 5, characterized in that The encoder includes a first fully connected layer and a second fully connected layer, and the feature extraction layer includes a multi-layer perceptron; The encoding of the context features into multimodal features in the encoder includes: In the first fully connected layer, mapping the context feature into a first intermediate feature; Activating the first intermediate feature using a linear rectification function to obtain a second intermediate feature; In the second fully connected layer, mapping the second intermediate features into multimodal features; In the normalization layer, performing a normalization operation on the first fused feature according to the multimodal feature to obtain a second fused feature includes: In the normalization layer, the multimodal feature is mapped into a scaling factor and an offset factor, and a normalization operation is performed on the first fused feature. If the normalization operation is completed, the offset factor is added to the product of the scaling factor and the first fused feature to obtain a second fused feature; The step of extracting, in the feature extraction layer, a representation vector representing the user intention from the second fused feature as a third fused feature includes: In the multi-layer perceptron, performing multi-layer linear transformation and nonlinear activation on the second fused feature to extract a representation vector representing the user intention as a third fused feature; The step of fusing the probability and the preference degree into an expected value of the user accessing each component in the next step on the page includes: The probability is added to the preference degree to obtain the expected value of the user visiting each component in the next step on the page.
7. The method according to claim 4, characterized in that The updating of the behavior prediction model according to the target component and the benchmark component includes: If the target component is different from the reference component, then in the WebWorker, writing the behavior feature and the context feature as log data into a database of the browser; If the amount of the log data stored in the database of the browser reaches a threshold, uploading the log data stored in the database of the browser to a server in the WebWorker, and the server is configured to train the behavior prediction model based on the log data to update a version of the behavior prediction model; In the WebWorker, a new version of the behavior prediction model is loaded from the server, and the new version of the behavior prediction model replaces the local old version of the behavior prediction model.
8. The method according to claim 7, characterized in that In the web worker, loading the new version of the behavior prediction model from the server and replacing the local old version of the behavior prediction model with the new version of the behavior prediction model includes: Initiating an asynchronous task in the web worker to load a new version of the behavior prediction model from the server while maintaining the old version of the behavior prediction model locally; In the web worker, a lock is added to the queue, a pointer of the behavior prediction model is replaced from the local old version of the behavior prediction model to the new version of the behavior prediction model, and the queue is unlocked; In the web worker WebWorker, the resources occupied by the local old version of the behavior prediction model are released.
9. An electronic device, characterized in that: The electronic device comprises: 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 is executed by the at least one processor to enable the at least one processor to execute the page component loading method according to any one of claims 1 to 8.
10. A computer-readable storage medium, characterized in that The computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the method for loading a page component according to any one of claims 1 to 8 is implemented.
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
Content preloading using predictive models
US10261938B1