Method and system for determining exposure elements, as well as client and server

Send scrolling window and element attribute information to the server through the client to determine the exposed elements, which solves the problems of high computing pressure and page lag on the client, reduces the pressure on the server, and improves data integrity and page fluency.

CN113449230BActive Publication Date: 2025-01-14BEIJING WODONG TIANJUN INFORMATION TECH CO LTD +1
View PDF 1 Cites 0 Cited by

Patent Information

Application Number
CN202010229511.6
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2020-03-27
Publication Date
2025-01-14
Estimated Expiration
2040-03-27

AI Technical Summary

Technical Problem

In the prior art, the client has a high calculation pressure when monitoring the page scrolling, which leads to the page being prone to stuttering, and frequent sending requests increases the pressure on the server, and the risk of losing exposed data is higher.

Method used

The client records the size of the scroll window and the attribute information of the element, and sends the scrolling track information to the server. The server determines the exposure element based on this information, reducing the amount of calculation and request frequency of the client.

Benefits of technology

It reduces the chance of client stuttering, reduces the pressure on the server, avoids the risk of losing exposed data, and improves the fluency and data integrity of the page.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN113449230B_ABST
    Figure CN113449230B_ABST
Patent Text Reader

Abstract

The present invention discloses a method and system for determining exposure elements, as well as a client and a server, and relates to the field of computer technology. A specific implementation of the method includes: determining the size of a scrolling window; obtaining attribute information of several elements on a page; monitoring whether the page is scrolled; if the page is monitored to be scrolled, recording the scrolling track information; sending the size of the scrolling window, the attribute information of the several elements and the scrolling track information to a server, so that the server determines the exposure element according to the size of the scrolling window, the attribute information of the several elements and the scrolling track information. This implementation can reduce the amount of calculation of the client and reduce the probability of page freeze.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the field of computer technology, and in particular to a method and system for determining exposure elements, as well as a client and a server. Background Art

[0002] When browsing a page, scrolling up and down can expose elements at different positions on the page. Since the exposed elements can reflect the user's behavior habits, it is particularly important to determine the exposed elements of the page.

[0003] In the prior art, when the client monitors the page scrolling, it determines the element currently displayed in the scrolling window based on the attribute information of the element, and determines whether the element needs to be exposed through the embedding solution. If so, it determines that the element is an exposure element and sends the exposure element to the server.

[0004] However, in this method, the computing pressure on the client is relatively large, and the page is prone to freeze during scrolling. Summary of the invention

[0005] In view of this, an embodiment of the present invention provides a method and system for determining exposure elements, as well as a client and a server, which can reduce the amount of calculation on the client and reduce the probability of page freeze.

[0006] In a first aspect, an embodiment of the present invention provides a method for determining an exposure element, which is applied to a client and includes:

[0007] Determine the size of the scroll window;

[0008] Get the attribute information of several elements on the page;

[0009] Monitor whether the page is scrolled;

[0010] If the page is detected to be scrolling, the scrolling track information is recorded;

[0011] The size of the scrolling window, the attribute information of the elements, and the scrolling track information are sent to the server, so that the server determines the exposure element according to the size of the scrolling window, the attribute information of the elements, and the scrolling track information.

[0012] Optionally,

[0013] The several elements include: several buried point elements and several other elements;

[0014] The method further comprises:

[0015] According to the embedding scheme of the page, determining the plurality of embedding elements from the plurality of elements;

[0016] Determine the identifiers of the plurality of embedding elements;

[0017] The sending the size of the scrolling window, the attribute information of the plurality of elements and the scrolling track information to the server includes:

[0018] The size of the scrolling window, the scrolling track information, the attribute information and identifiers of the plurality of embedded point elements, and the attribute information of the plurality of other elements are sent to the server.

[0019] Optionally,

[0020] Further including:

[0021] Adding the identifiers of the plurality of embedded elements to the real DOM (Document Object Model) nodes corresponding to the plurality of embedded elements respectively; wherein the real DOM nodes corresponding to the plurality of elements constitute a real DOM tree;

[0022] The acquisition of attribute information of several elements on the page includes:

[0023] Asynchronously traverse the real DOM tree to obtain a virtual DOM tree; wherein the virtual DOM tree includes: attribute information and identifiers of the plurality of embedding elements and attribute information of the plurality of other elements;

[0024] The sending of the size of the scrolling window, the scrolling track information, the attribute information and identifiers of the plurality of embedding elements, and the attribute information of the plurality of other elements to the server includes:

[0025] The size of the scrolling window, the scrolling track information, and the virtual DOM tree are sent to the server.

[0026] Optionally,

[0027] The scrolling track information includes: a scrolling start position, a scrolling stop position, and a scrolling direction change position.

[0028] Optionally,

[0029] Further including:

[0030] Monitor whether the page is destroyed or re-rendered, and if so, send the size of the scrolling window, the attribute information of the elements, and the scrolling track information to the server.

[0031] In a second aspect, an embodiment of the present invention provides a method for determining an exposure element, which is applied to a server, and includes:

[0032] Receive the size of the scroll window, attribute information of several elements on the page, and scroll track information sent by the client;

[0033] An exposure element is determined according to the size of the scrolling window, the attribute information of the plurality of elements and the scrolling track information.

[0034] Optionally,

[0035] The several elements include: several buried point elements and several other elements;

[0036] The receiving method includes:

[0037] Receive the size of the scrolling window, the scrolling track information, the attribute information and identifiers of the plurality of embedded point elements, and the attribute information of the plurality of other elements sent by the client;

[0038] The step of determining the exposure element according to the size of the scrolling window, the attribute information of the plurality of elements and the scrolling track information includes:

[0039] The exposure element is determined according to the size of the scrolling window, the scrolling track information, the attribute information and identification of the plurality of buried point elements, and the attribute information of the plurality of other elements.

[0040] Optionally,

[0041] The receiving, sent by the client, the size of the scrolling window, the scrolling track information, the attribute information and identifiers of the plurality of buried point elements, and the attribute information of a plurality of other elements, includes:

[0042] Receive the size of the scrolling window, the scrolling track information and the virtual DOM tree sent by the client; wherein the virtual DOM tree includes: the attribute information and identifiers of the plurality of embedding elements and the attribute information of the plurality of other elements;

[0043] The step of determining the exposure element according to the size of the scrolling window, the scrolling track information, the attribute information and identifiers of the plurality of buried point elements, and the attribute information of a plurality of other elements includes:

[0044] The exposed element is determined according to the size of the scrolling window, the scrolling track information and the virtual DOM tree.

[0045] Optionally,

[0046] The determining the exposure element according to the size of the scrolling window, the scrolling track information and the virtual DOM tree includes:

[0047] Determining a view area according to the size of the scrolling window and the scrolling track information;

[0048] The exposed element is determined according to the view area and the virtual DOM tree.

[0049] Optionally,

[0050] The scrolling track information includes: a scrolling start position, a scrolling stop position, and a scrolling direction change position;

[0051] The determining of the view area according to the size of the scrolling window and the scrolling track information includes:

[0052] Determining a scrolling distance according to the scrolling start position, the scrolling stop position and the scrolling direction change position;

[0053] The view area is determined according to the scrolling distance and the size of the scrolling window.

[0054] Optionally,

[0055] The determining the exposure element according to the view area and the virtual DOM tree includes:

[0056] For each of the elements in the virtual DOM tree:

[0057] It is determined whether the element is located in the viewing area according to the attribute information of the element, and if so, it is determined whether the element has an identifier, and if so, it is determined that the element belongs to the exposure element.

[0058] In a third aspect, an embodiment of the present invention provides a client, including:

[0059] A determination module configured to determine a size of the scrolling window;

[0060] The acquisition module is configured to: obtain the attribute information of several elements on the page;

[0061] A monitoring module, configured to monitor whether the page is scrolled; if the page is detected to be scrolled, the scrolling track information is recorded;

[0062] The sending module is configured to send the size of the scrolling window, the attribute information of the elements and the scrolling track information to the server, so that the server determines the exposure element according to the size of the scrolling window, the attribute information of the elements and the scrolling track information.

[0063] In a fourth aspect, an embodiment of the present invention provides a server, including:

[0064] A receiving module configured to receive the size of the scrolling window, attribute information of several elements on the page, and scrolling track information sent by the client;

[0065] The determination module is configured to determine the exposure element according to the size of the scrolling window, the attribute information of the elements and the scrolling track information.

[0066] In a fifth aspect, an embodiment of the present invention provides a system for determining exposure elements, including: the client described in the above embodiment and the server described in the above embodiment.

[0067] In a sixth aspect, an embodiment of the present invention provides an electronic device, including:

[0068] one or more processors;

[0069] a storage device for storing one or more programs,

[0070] When the one or more programs are executed by the one or more processors, the one or more processors implement the method described in any of the above embodiments.

[0071] In a seventh aspect, an embodiment of the present invention provides a computer-readable medium having a computer program stored thereon, and when the program is executed by a processor, the method described in any of the above embodiments is implemented.

[0072] One embodiment of the above invention has the following advantages or beneficial effects: the client determines the size of the scrolling window, the attribute information of the element and the scrolling track information, and provides them to the server, which determines the exposure element based on the information. Since the server undertakes part of the calculation process, the calculation amount of the client is reduced, and the probability of the client freezing is reduced.

[0073] The further effects of the above-mentioned non-conventional optional manner will be described below in conjunction with the specific implementation manner. BRIEF DESCRIPTION OF THE DRAWINGS

[0074] The accompanying drawings are used to better understand the present invention and do not constitute an improper limitation of the present invention.

[0075] Figure 1 is a flow chart of a method for determining exposure elements applied to a client provided by an embodiment of the present invention;

[0076] Figure 2 is a flow chart of a method for determining exposure elements applied to a server provided by an embodiment of the present invention;

[0077] Figure 3 is a flow chart of a method for determining an exposure element applied to a system for determining an exposure element provided by an embodiment of the present invention;

[0078] Figure 4 is a schematic diagram of a client provided by an embodiment of the present invention;

[0079] Figure 5 is a schematic diagram of a server provided by an embodiment of the present invention;

[0080] Figure 6 is an exemplary system architecture diagram to which embodiments of the present invention may be applied;

[0081] Figure 7 It is a schematic diagram of the structure of a computer system of a terminal device or a server suitable for implementing an embodiment of the present invention. DETAILED DESCRIPTION

[0082] The following is a description of exemplary embodiments of the present invention in conjunction with the accompanying drawings, including various details of the embodiments of the present invention to facilitate understanding, which should be considered as merely exemplary. Therefore, it should be recognized by those of ordinary skill in the art that various changes and modifications may be made to the embodiments described herein without departing from the scope and spirit of the present invention. Similarly, for clarity and conciseness, the description of well-known functions and structures is omitted in the following description.

[0083] In the prior art, when the client monitors the page scrolling, it determines the element currently displayed in the scrolling window based on the attribute information of the element, and determines whether the element needs to be exposed through the embedding solution. If so, it determines that the element is an exposure element and sends the exposure element to the server.

[0084] However, in this method, the client frequently sends requests to the server, increasing the pressure on the server. In addition, page jumps or re-rendering may cause the client to fail to send requests and lose exposure data. In addition, due to the high computing pressure on the client, elements such as animations on the page cannot be displayed normally, causing the page to freeze.

[0085] like Figure 1 As shown, an embodiment of the present invention provides a method for determining an exposure element, which is applied to a client, and the method includes:

[0086] Step 101: Determine the size of the scroll window.

[0087] The client can be a PC or mobile application, such as a browser, email, etc.

[0088] The scrolling window is used to display the content of the page. As the page scrolls, elements at different positions in the page can be displayed in the scrolling window. The size of the scrolling window may include: the height and width of the scrolling window. The size of the scrolling window obtained by the client may be different depending on the device where the client is located. For example, under normal circumstances, the height of the scrolling window on the PC side of the same browser is greater than the height of the scrolling window on the mobile side. The size of the scrolling window obtained by the client may also be different depending on the type of client. For example, the width of the scrolling window of the web version of mailbox A may be greater than the width of the scrolling window of the web version of mailbox B.

[0089] In the embodiment of the present invention, the size of the scrolling window can be obtained after the page is loaded.

[0090] In actual application scenarios, the execution order of determining the size of the scroll window, obtaining the attribute information of the element, and recording the scrolling track information can be adjusted, and the embodiment of the present invention does not limit it. For example, step 101 and step 102 are executed interchangeably, step 101 is executed after step 104, etc.

[0091] Step 102: Obtain attribute information of several elements on the page.

[0092] The attribute information of an element includes: the element's height, width, position on the page and other layout information.

[0093] Step 103: monitor whether the page is scrolling, if it is monitored that the page is scrolling, execute step 104.

[0094] In actual application scenarios, whether the page is scrolled can be determined based on whether the scroll bar on the page moves or whether the position of the element on the page in the scroll window changes. The scrolling direction can be up and down or left and right.

[0095] Step 104: Record the scrolling track information.

[0096] The scrolling track information is used to record the scrolling track of the page. From monitoring the page scrolling to sending the scroll window size to the server, the page may scroll only once continuously or multiple times intermittently.

[0097] The scrolling track information may include: the scrolling start position, the scrolling stop position, and the scrolling direction change position.

[0098] In an application scenario, the page first scrolls downward 1 and then scrolls upward 2. The scrolling track information includes: the scrolling start position is 0, the scrolling direction change position is 1, and the scrolling end position is -1.

[0099] The scrolling direction and distance may also be recorded in the scrolling track information. The page first scrolls downward 1 and then scrolls upward 2. The scrolling track information includes: scrolling downward 1 and scrolling upward 2.

[0100] Step 105: Send the size of the scroll window, attribute information of several elements and scroll track information to the server.

[0101] The server determines the exposure element according to the size of the scrolling window, the attribute information of several elements and the scrolling track information.

[0102] The client determines the size of the scroll window, the attribute information of the element, and the scrolling track information, and provides them to the server, which determines the exposure element based on this information. Since the server undertakes part of the calculation process, the client's calculation amount is reduced, reducing the probability of client lag.

[0103] A page may include multiple elements. In actual application scenarios, it may not be necessary to pay attention to whether each element in the page is exposed. In view of this situation, in one embodiment of the present invention, the multiple elements include: multiple buried point elements and multiple other elements.

[0104] The method further includes:

[0105] According to the tracking point plan of the page, determine several tracking point elements from several elements;

[0106] Determine the identification of several tracking elements;

[0107] Send the scroll window size, attribute information of several elements, and scroll track information to the server, including:

[0108] The size of the scroll window, scroll track information, attribute information and identifiers of several embedding elements, and attribute information of several other elements are sent to the server.

[0109] The embodiment of the present invention can determine whether an element is a buried point element through an identifier, and the server can determine whether the element is an exposed element based on the identifier. The client or server can distinguish buried point elements from other elements through the identifier, and the server can also store the identifier of the exposed element in a database or other location. By querying the identifier in the database, the exposed buried point element can be determined.

[0110] In one embodiment of the present invention, the method may include: adding identifiers of several buried elements to real DOM nodes corresponding to the several buried elements respectively; wherein the real DOM nodes corresponding to the several elements constitute a real DOM tree;

[0111] Get the attribute information of several elements on the page, including:

[0112] Asynchronously traverse the real DOM tree to obtain a virtual DOM tree; wherein the virtual DOM tree includes: attribute information and identifiers of several embedding elements and attribute information of several other elements;

[0113] Send the scroll window size, scroll track information, attribute information and identifiers of several embedding elements, and attribute information of several other elements to the server, including:

[0114] Send the scroll window size, scroll track information, and virtual DOM tree to the server.

[0115] In addition to storing the attribute information of DOM nodes in the real DOM tree, the virtual DOM tree can also store the hierarchical relationship between DOM nodes.

[0116] The format of the virtual DOM tree is as follows:

[0117]

[0118] The attribute information and identifier of the tracking point element and the attribute information of other elements are stored in the form of key-value pairs.

[0119] The embodiment of the present invention stores the attribute information and identification of the buried element and the attribute information of other elements through the virtual DOM tree and provides it to the server, so that the server can more quickly determine the exposed elements by traversing the virtual DOM tree. Considering that frequently sending the attribute information of the element to the server will increase the pressure on the server, in the actual application scenario, when the trigger condition is met, the size of the scrolling window, the attribute information of several elements and the scrolling track information are sent to the server.

[0120] The trigger condition may be page destruction or page re-rendering. Specifically, in one embodiment of the present invention, the method further includes:

[0121] Monitor whether the page is destroyed or re-rendered. If so, send the size of the scroll window, attribute information of several elements, and scroll track information to the server.

[0122] Taking page destruction as an example, from the time the page is scrolled to the time the page is destroyed, if the page scrolls multiple times intermittently, the client does not need to send information to the server every time it scrolls, but instead sends the obtained information to the server after the page is destroyed.

[0123] Among them, page destruction includes: page closing, page rollback, etc.

[0124] The trigger condition may also be that the size of the scroll window, the attribute information of the element, and the data volume of the scroll track information reach a specified threshold. In addition, the size of the scroll window, the attribute information of several elements, and the scroll track information may also be sent to the server according to a preset time period.

[0125] like Figure 2 As shown, an embodiment of the present invention provides a method for determining an exposure element, which is applied to a server and includes:

[0126] Step 201: receiving the size of the scroll window, attribute information of several elements on the page, and scroll track information sent by the client.

[0127] Step 202: Determine the exposure element according to the size of the scrolling window, attribute information of several elements and scrolling track information.

[0128] In the embodiment of the present invention, the exposure element is determined by the server, which reduces the amount of calculation on the client and reduces the probability of freeze on the client.

[0129] In one embodiment of the present invention, receiving the size of the scroll window, the attribute information of several elements on the page, and the scroll track information sent by the client includes:

[0130] Receive the size of the scrolling window, scrolling track information, attribute information and identifiers of several embedding elements, and attribute information of several other elements sent by the client; wherein the several elements include: several embedding elements and several other elements;

[0131] According to the size of the scrolling window, the attribute information of several elements and the scrolling track information, the exposure elements are determined, including:

[0132] The exposure element is determined based on the size of the scrolling window, the scrolling track information, the attribute information and identification of several embedded point elements, and the attribute information of several other elements.

[0133] In actual application scenarios, it is possible to determine whether each element in the page is exposed. However, considering that this will increase the amount of computation on the client and server, the embodiment of the present invention only determines whether the buried element is exposed, which can reduce the amount of computation on the client and server.

[0134] In one embodiment of the present invention, receiving the size of the scrolling window, scrolling track information, attribute information and identifiers of several embedding elements, and attribute information of several other elements sent by the client includes:

[0135] Receive the size of the scroll window, scroll track information and virtual DOM tree sent by the client; wherein the virtual DOM tree includes: attribute information and identifiers of several embedding elements and attribute information of several other elements;

[0136] The exposure elements are determined based on the size of the scrolling window, scrolling track information, attribute information and identifiers of several embedding elements, and attribute information of several other elements, including:

[0137] Determine the exposed elements based on the size of the scroll window, scroll track information, and virtual DOM tree.

[0138] The embodiment of the present invention stores the attribute information and identification of the embedded element and the attribute information of other elements through the virtual DOM tree. Since the virtual DOM tree stores data in the form of objects, the server can determine the exposed elements more quickly.

[0139] In the embodiment of the present invention, determining the exposure element according to the size of the scrolling window, the scrolling track information and the virtual DOM tree includes:

[0140] Determine the view area according to the size of the scroll window and the scroll track information;

[0141] Determine the exposed elements based on the view area and the virtual DOM tree.

[0142] In the embodiment of the present invention, the server determines the area of ​​the page exposure, i.e., the view area, according to the size of the scrolling window and the scrolling track information. Compared with determining the buried element according to the virtual DOM tree and determining the exposed element according to the buried element, the size of the scrolling window and the scrolling track information, the embodiment of the present invention can reduce the amount of calculation of the server and determine the exposed element more quickly.

[0143] In one embodiment of the present invention, the scrolling track information includes: a scrolling start position, a scrolling stop position, and a scrolling direction change position;

[0144] Determine the view area based on the size of the scroll window and the scroll track information, including:

[0145] Determine the scrolling distance according to the scrolling start position, the scrolling stop position and the scrolling direction change position;

[0146] Determine the view area based on the scroll distance and the size of the scroll window.

[0147] The scrolling track information includes: the scrolling start position is 0, the scrolling direction change position is 1, the scrolling direction change position is -1, and the scrolling end position is 2. It can be concluded that the page scrolls down 1, scrolls up 2, and scrolls down 3. Scrolling distance = 1 + (2-1) + (3-2) = 3.

[0148] Scroll distance + scroll window width = view area width, scroll window length = view area length.

[0149] In one embodiment of the present invention, determining the exposed element according to the view area and the virtual DOM tree includes:

[0150] For each element of the virtual DOM tree:

[0151] It is determined whether the element is located in the viewing area according to the attribute information of the element, and if so, it is determined whether the element has an identification, and if so, it is determined that the element is an exposure element.

[0152] Specifically, the server traverses each node of the virtual DOM and determines whether the element is in the view area based on the height, width and position of the element in the page. If it is in the view area, it means that the element is exposed. However, in the embodiment of the present invention, only the exposed buried elements are concerned, and the buried elements can be confirmed by identification. The exposed buried elements are exposed elements.

[0153] like Figure 3 As shown, an embodiment of the present invention provides a method for determining an exposure element, which is applied to a system for determining an exposure element. The method includes:

[0154] Step 301: The client determines a number of embedding elements from a number of elements according to the embedding scheme of the page.

[0155] Step 302: The client determines the identifiers of several tracking elements.

[0156] Step 303: The client adds the identifiers of the plurality of embedded elements to the real DOM nodes corresponding to the plurality of embedded elements, respectively, wherein the real DOM nodes corresponding to the plurality of elements constitute a real DOM tree.

[0157] Step 304: The client determines the size of the scroll window.

[0158] Step 305: The client asynchronously traverses the real DOM tree to obtain the virtual DOM tree.

[0159] The virtual DOM tree includes: attribute information and identifiers of several embedding elements and attribute information of several other elements.

[0160] Step 306: The client monitors whether the page is scrolled.

[0161] Step 307: When the client detects that the page is scrolling, it records the scrolling track information; the scrolling track information includes: the scrolling start position, the scrolling stop position and the scrolling direction change position.

[0162] Step 308: The client monitors whether the page is destroyed or re-rendered.

[0163] Step 309: When the client monitors whether the page is destroyed or re-rendered, it sends the size of the scroll window, scroll track information and virtual DOM tree to the server.

[0164] Step 310: The server determines the scrolling distance according to the scrolling start position, the scrolling stop position and the scrolling direction change position.

[0165] Step 311: The server determines the view area according to the scrolling distance and the size of the scrolling window.

[0166] Step 312: The server determines for each element of the virtual DOM tree whether the element is located in the viewing area according to the attribute information of the element. If so, execute step 313; otherwise, terminate the current process.

[0167] Step 313: The server determines whether the element has an identifier. If so, step 314 is executed. Otherwise, the current process is terminated.

[0168] Step 314: The server determines that the element is an exposed element.

[0169] In this system, the server determines the exposure elements based on the size of the scroll window and other data, which can reduce the amount of calculation on the client side and reduce the chance of client freezing. The client sends data to the server uniformly when the page is re-rendered or destroyed, reducing the number of times data is sent to the server and reducing resource consumption on both the client and server sides.

[0170] like Figure 4 As shown, an embodiment of the present invention provides a client, including:

[0171] A determination module 401 is configured to determine the size of the scrolling window;

[0172] The acquisition module 402 is configured to acquire attribute information of a plurality of elements on the page;

[0173] The monitoring module 403 is configured to monitor whether the page is scrolled; if the page is scrolled, the scrolling track information is recorded;

[0174] The sending module 404 is configured to send the size of the scrolling window, the attribute information of several elements and the scrolling track information to the server, so that the server determines the exposure element according to the size of the scrolling window, the attribute information of several elements and the scrolling track information.

[0175] In one embodiment of the present invention, the plurality of elements include: a plurality of burying point elements and a plurality of other elements, a determination module 401, configured to determine a plurality of burying point elements among the plurality of elements according to the burying point scheme of the page; determine the identifiers of the plurality of burying point elements; a sending module, configured to send the size of the scrolling window, scrolling track information, attribute information and identifiers of the plurality of burying point elements, and attribute information of the plurality of other elements to the server.

[0176] In one embodiment of the present invention, the acquisition module 402 is configured to add the identifiers of several embedding elements to the real document object model DOM nodes corresponding to the several embedding elements respectively; wherein the real DOM nodes corresponding to the several elements constitute a real DOM tree; asynchronously traverse the real DOM tree to obtain a virtual DOM tree; wherein the virtual DOM tree includes: attribute information and identifiers of several embedding elements and attribute information of several other elements; the sending module is configured to send the size of the scrolling window, scrolling track information and the virtual DOM tree to the server.

[0177] In one embodiment of the present invention, the scrolling track information includes: a scrolling start position, a scrolling stop position, and a scrolling direction change position.

[0178] In one embodiment of the present invention, the monitoring module 403 is configured to monitor whether the page is destroyed or re-rendered, and if so, trigger the sending module.

[0179] like Figure 5 As shown, an embodiment of the present invention provides a server, including:

[0180] The receiving module 501 is configured to receive the size of the scroll window, the attribute information of several elements on the page and the scroll track information sent by the client;

[0181] The determination module 502 is configured to determine the exposure element according to the size of the scrolling window, the attribute information of the elements and the scrolling track information.

[0182] In one embodiment of the present invention, the receiving module 501 is configured to receive the size of the scrolling window, the scrolling trajectory information, the attribute information and identification of several buried point elements, and the attribute information of several other elements sent by the client; wherein the several elements include: several buried point elements and several other elements; the determining module 502 is configured to determine the exposure element according to the size of the scrolling window, the scrolling trajectory information, the attribute information and identification of several buried point elements, and the attribute information of several other elements.

[0183] In one embodiment of the present invention, the receiving module 501 is configured to receive the size of the scrolling window, the scrolling track information and the virtual DOM tree sent by the client; wherein the virtual DOM tree includes: the attribute information and identification of a number of embedded elements and the attribute information of a number of other elements; the determining module 502 is configured to determine the exposure element according to the size of the scrolling window, the scrolling track information and the virtual DOM tree.

[0184] In one embodiment of the present invention, the determination module 502 is configured to determine the view area according to the size of the scrolling window and the scrolling track information; and determine the exposure element according to the view area and the virtual DOM tree.

[0185] In one embodiment of the present invention, the scrolling trajectory information includes: a scrolling start position, a scrolling stop position, and a scrolling direction change position; a determination module 502 is configured to determine the scrolling distance based on the scrolling start position, the scrolling stop position, and the scrolling direction change position; and determine the view area based on the scrolling distance and the size of the scrolling window.

[0186] In one embodiment of the present invention, the determination module 502 is configured to determine, for each element of the virtual DOM tree, whether the element is located in the view area according to the attribute information of the element, and if so, whether the element has an identifier, and if so, determine that the element is an exposed element.

[0187] An embodiment of the present invention provides a system for determining exposure elements, including: a client of any of the above embodiments and a server of any of the above embodiments.

[0188] An embodiment of the present invention provides an electronic device, including:

[0189] one or more processors;

[0190] a storage device for storing one or more programs,

[0191] When one or more programs are executed by one or more processors, the one or more processors implement the method of any of the above embodiments.

[0192] Figure 6 An exemplary system architecture 600 of a method or a server for determining exposure elements according to an embodiment of the present invention is shown.

[0193] like Figure 6 As shown, system architecture 600 may include terminal devices 601, 602, 603, network 604 and server 605. Network 604 is used to provide a medium for communication links between terminal devices 601, 602, 603 and server 605. Network 604 may include various connection types, such as wired, wireless communication links or optical fiber cables, etc.

[0194] Users can use terminal devices 601, 602, and 603 to interact with server 605 through network 604 to receive or send messages, etc. Various communication client applications can be installed on terminal devices 601, 602, and 603, such as shopping applications, web browser applications, search applications, instant messaging tools, email clients, social platform software, etc. (only examples).

[0195] The terminal devices 601 , 602 , and 603 may be various electronic devices having a display screen and supporting web browsing, including but not limited to smart phones, tablet computers, laptop computers, and desktop computers, etc.

[0196] Server 605 may be a server that provides various services, such as a backend management server (only an example) that provides support for shopping websites browsed by users using terminal devices 601, 602, and 603. The backend management server may analyze and process received data such as product information query requests.

[0197] Now, the desktop computer 603 is used as an example for explanation. In the actual application scenario, the client is set in the desktop computer 603, the server is set in the server 605, the client is the web end of the shopping website, and the server is the background of the shopping website. The client executes the method for determining the exposure element, that is, determining the size of the scrolling window, obtaining the attribute information of several elements on the page, monitoring whether the page is scrolled, and when monitoring the scrolling of the page, recording the scrolling track information, and sending the size of the scrolling window, the attribute information of the several elements and the scrolling track information to the server. Correspondingly, the server executes the method for determining the exposure element corresponding to the client, that is, receiving the size of the scrolling window, the attribute information of several elements on the page and the scrolling track information sent by the client, and determining the exposure element according to the size of the scrolling window, the attribute information of the several elements and the scrolling track information.

[0198] It should be understood that Figure 6 The number of terminal devices, networks and servers in the embodiment is only for illustration. Any number of terminal devices, networks and servers may be provided according to implementation requirements.

[0199] Reference below Figure 7 , which shows a schematic diagram of the structure of a computer system 700 of a terminal device suitable for implementing an embodiment of the present invention. Figure 7 The terminal device shown is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present invention.

[0200] like Figure 7 As shown, the computer system 700 includes a central processing unit (CPU) 701, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 702 or a program loaded from a storage part 708 into a random access memory (RAM) 703. In the RAM 703, various programs and data required for the operation of the system 700 are also stored. The CPU 701, the ROM 702, and the RAM 703 are connected to each other via a bus 704. An input / output (I / O) interface 705 is also connected to the bus 704.

[0201] The following components are connected to the I / O interface 705: an input section 706 including a keyboard, a mouse, etc.; an output section 707 including a cathode ray tube (CRT), a liquid crystal display (LCD), etc., and a speaker, etc.; a storage section 708 including a hard disk, etc.; and a communication section 709 including a network interface card such as a LAN card, a modem, etc. The communication section 709 performs communication processing via a network such as the Internet. A drive 710 is also connected to the I / O interface 705 as needed. A removable medium 711, such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, etc., is installed on the drive 710 as needed, so that a computer program read therefrom is installed into the storage section 708 as needed.

[0202] In particular, according to the embodiments disclosed in the present invention, the process described above with reference to the flowchart can be implemented as a computer software program. For example, the embodiments disclosed in the present invention include a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program includes a program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from the network through the communication part 709, and / or installed from the removable medium 711. When the computer program is executed by the central processing unit (CPU) 701, the above-mentioned functions defined in the system of the present invention are executed.

[0203] It should be noted that the computer-readable medium shown in the present invention may be a computer-readable signal medium or a computer-readable storage medium or any combination of the above two. The computer-readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or device, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present invention, a computer-readable storage medium may be any tangible medium containing or storing a program that can be used by or in combination with an instruction execution system, device or device. In the present invention, a computer-readable signal medium may include a data signal propagated in a baseband or as part of a carrier wave, which carries a computer-readable program code. This propagated data signal may take a variety of forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above. Computer-readable signal media may also be any computer-readable medium other than computer-readable storage media, which may send, propagate or transmit a program for use by or in conjunction with an instruction execution system, apparatus or device. The program code contained on the computer-readable medium may be transmitted using any appropriate medium, including but not limited to: wireless, wire, optical cable, RF, etc., or any suitable combination of the above.

[0204] The flow chart and block diagram in the accompanying drawings illustrate the possible architecture, function and operation of the system, method and computer program product according to various embodiments of the present invention. In this regard, each box in the flow chart or block diagram can represent a module, a program segment, or a part of a code, and the above-mentioned module, program segment, or a part of a code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the box can also occur in a different order from the order marked in the accompanying drawings. For example, two boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the block diagram or flow chart, and the combination of the boxes in the block diagram or flow chart can be implemented with a dedicated hardware-based system that performs a specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.

[0205] The modules involved in the embodiments of the present invention may be implemented in software or hardware. The modules described may also be set in a processor. For example, they may be described as: a processor includes a sending module, an acquisition module, a determination module, and a first processing module. The names of these modules do not, in some cases, constitute limitations on the modules themselves. For example, the sending module may also be described as a "module for sending a picture acquisition request to the connected server."

[0206] As another aspect, the present invention further provides a computer-readable medium, which may be included in the device described in the above embodiment; or may exist independently without being assembled into the device. The above computer-readable medium carries one or more programs, and when the above one or more programs are executed by a device, the device includes:

[0207] Determine the size of the scroll window;

[0208] Get the attribute information of several elements on the page;

[0209] Monitor whether the page is scrolled;

[0210] If the page is detected to be scrolling, the scrolling track information is recorded;

[0211] The size of the scrolling window, the attribute information of the elements, and the scrolling track information are sent to the server, so that the server determines the exposure element according to the size of the scrolling window, the attribute information of the elements, and the scrolling track information.

[0212] According to the technical solution of the embodiment of the present invention, the client determines the size of the scrolling window, the attribute information of the element and the scrolling track information, and provides them to the server, which determines the exposure element based on this information. Since the server undertakes part of the calculation process, the calculation amount of the client is reduced, and the probability of the client freezing is reduced.

[0213] The above specific implementations do not constitute a limitation on the protection scope of the present invention. It should be understood by those skilled in the art that various modifications, combinations, sub-combinations and substitutions may occur depending on design requirements and other factors. Any modification, equivalent substitution and improvement made within the spirit and principle of the present invention shall be included in the protection scope of the present invention.

Claims

1. A method for determining exposure elements, applied to a client, characterized in that: include: Determine the size of the scroll window; Get the attribute information of several elements on the page; The plurality of elements include: a plurality of embedding elements and a plurality of other elements; specifically including: determining the attribute information and identifiers of the plurality of embedding elements and the attribute information of the plurality of other elements according to the virtual DOM tree; Monitor whether the page is scrolled; If the page is detected to be scrolling, the scrolling track information is recorded; The size of the scrolling window, the virtual DOM tree and the scrolling track information are sent to a server, so that the server determines the exposure element according to the size of the scrolling window, the attribute information of the elements and the scrolling track information.

2. The method according to claim 1, characterized in that Further including: Adding the identifiers of the plurality of embedded elements to the real document object model DOM nodes corresponding to the plurality of embedded elements respectively; wherein the real DOM nodes corresponding to the plurality of elements constitute a real DOM tree; The acquisition of attribute information of several elements on the page includes: Asynchronously traverse the real DOM tree to obtain the virtual DOM tree.

3. The method according to claim 1, characterized in that The scrolling track information includes: a scrolling start position, a scrolling stop position, and a scrolling direction change position.

4. The method according to any one of claims 1 to 3, characterized in that: Further including: Monitor whether the page is destroyed or re-rendered, and if so, send the size of the scrolling window, the attribute information of the elements, and the scrolling track information to the server.

5. A method for determining exposure elements, applied to a server, characterized in that: include: Receive the size of the scroll window, the virtual DOM tree and the scroll track information sent by the client; wherein the virtual DOM tree includes: the attribute information and identification of the plurality of embedded point elements and the attribute information of the plurality of other elements; An exposure element is determined according to the size of the scrolling window, the virtual DOM tree and the scrolling track information.

6. The method according to claim 5, characterized in that The determining the exposure element according to the size of the scrolling window, the scrolling track information and the virtual DOM tree includes: Determining a view area according to the size of the scrolling window and the scrolling track information; The exposed element is determined according to the view area and the virtual DOM tree.

7. The method according to claim 6, characterized in that The scrolling track information includes: a scrolling start position, a scrolling stop position, and a scrolling direction change position; The determining of the view area according to the size of the scrolling window and the scrolling track information includes: Determining a scrolling distance according to the scrolling start position, the scrolling stop position and the scrolling direction change position; The view area is determined according to the scrolling distance and the size of the scrolling window.

8. The method according to claim 6, characterized in that The determining the exposure element according to the view area and the virtual DOM tree includes: For each of the elements in the virtual DOM tree: It is determined whether the element is located in the viewing area according to the attribute information of the element, and if so, it is determined whether the element has an identifier, and if so, it is determined that the element belongs to the exposure element.

9. A client, characterized in that: include: A determination module configured to determine a size of the scrolling window; The acquisition module is configured to: acquire the attribute information of several elements on the page; the several elements include: several embedded elements and several other elements; specifically used to: determine the attribute information and identifiers of the several embedded elements and the attribute information of the several other elements according to the virtual DOM tree; A monitoring module, configured to monitor whether the page is scrolled; if the page is detected to be scrolled, the scrolling track information is recorded; The sending module is configured to send the size of the scrolling window, the virtual DOM tree and the scrolling track information to the server, so that the server determines the exposure element according to the size of the scrolling window, the attribute information of the elements and the scrolling track information.

10. A server, characterized in that: include: A receiving module configured to receive the size of the scrolling window, the virtual DOM tree and the scrolling track information sent by the client; wherein the virtual DOM tree includes: the attribute information and identification of the plurality of embedded point elements and the attribute information of the plurality of other elements; The determination module is configured to determine the exposure element according to the size of the scrolling window, the virtual DOM tree and the scrolling track information.

11. A system for determining exposure elements, characterized in that: include: The client as claimed in claim 9 and the server as claimed in claim 10.

12. An electronic device, characterized in that: include: one or more processors; a storage device for storing one or more programs, When the one or more programs are executed by the one or more processors, the one or more processors implement the method according to any one of claims 1 to 8.

13. A computer readable medium having a computer program stored thereon, characterized in that: When the program is executed by a processor, the method according to any one of claims 1 to 8 is implemented.

Citation Information

Patent Citations

  • Simple method for lazy loading of web pages

    CN108804171A