Popup display method, device, equipment, computer readable medium and program product

Abstract

This disclosure presents embodiments of a pop-up display method, apparatus, device, computer-readable medium, and program product. One specific implementation of the method includes: obtaining a pre-cached list of pop-up data for a first page; sequentially traversing the pop-up data in the list using an asynchronous generator-based incremental loading mechanism to load it into a pop-up data queue; and rendering the pop-up data in the queue sequentially according to the order of the pop-up data in the queue for pop-up display. This implementation relates to page rendering; through the streaming characteristics of the asynchronous generator, each pop-up data is immediately added to the queue after loading and triggers rendering and display. It achieves a pipelined processing of loading, building, and display, maximizing the utilization of network I / O waiting time.

Description

Technical Field

[0001] The embodiments disclosed herein relate to the field of computer technology, and more specifically to pop-up display methods, apparatus, devices, computer-readable media, and program products. Background Technology

[0002] Currently, pop-up technology is used in various scenarios. For example, pop-ups are often used to display important information or confirm actions during user operations. The typical approach to rendering and displaying pop-ups on a page is as follows: First, based on the complete configuration of all pop-ups in the application, condition matching and priority sorting are performed on the client side to generate a complete pop-up queue. Finally, pop-ups are displayed sequentially according to the queue order.

[0003] However, the inventors discovered that the following technical problems often arise when using the above method: The complete configuration of all pop-ups needs to be loaded before they can be displayed, which results in long pop-up rendering wait times and low pop-up rendering efficiency. Summary of the Invention

[0004] The summary portion of this disclosure is intended to provide a brief overview of the concepts, which will be described in detail in the detailed description portion. This summary portion is not intended to identify key or essential features of the claimed technical solutions, nor is it intended to limit the scope of the claimed technical solutions.

[0005] Some embodiments of this disclosure provide methods, apparatuses, electronic devices, computer-readable media, and program products for displaying pop-ups to address the technical problems mentioned in the background section above.

[0006] In a first aspect, some embodiments of this disclosure provide a pop-up display method, including: obtaining a pre-cached pop-up data list for a first page; using an asynchronous generator-based incremental loading mechanism to sequentially traverse the pop-up data in the pop-up data list to load it into a pop-up data queue; and rendering the pop-up data in the pop-up data queue sequentially according to the pop-up data order corresponding to the pop-up data queue to display the pop-up.

[0007] Optionally, the pop-up data queue includes an active trigger queue and an event trigger queue; and the above-mentioned progressive loading mechanism based on asynchronous generators, which sequentially traverses the pop-up data in the pop-up data list to load it into the pop-up data queue, includes: using the above-mentioned progressive loading mechanism to sequentially traverse the pop-up data in the pop-up data list, so as to load pop-up data of the automatic pop-up display type into the initial active trigger queue and pop-up data of the behavior trigger type into the initial event trigger queue according to the display priority.

[0008] Optionally, the above-mentioned rendering of pop-up data in the pop-up data queue according to the pop-up data order corresponding to the pop-up data queue for pop-up display includes: rendering each pop-up data in the active trigger queue according to the pop-up data order corresponding to the active trigger queue; in response to receiving a behavior trigger event during the rendering of the target pop-up data in the active trigger queue, selecting a pop-up data sub-queue corresponding to the behavior trigger event from the event pool corresponding to the event trigger queue; rendering the pop-up data in the pop-up data sub-queue sequentially to display each pop-up corresponding to the behavior trigger event; and in response to completing the pop-up display for the behavior trigger event, continuing to execute the sequential rendering of each pop-up data in the active trigger queue that is after the target pop-up data.

[0009] Optionally, the above method further includes: in response to navigating from the first page to the second page, performing the following processing steps: clearing the active trigger queue and the event trigger queue; deleting each listener corresponding to the event trigger queue; closing each pop-up window displayed on the first page; and using the progressive loading mechanism to perform pop-up rendering for the second page.

[0010] Optionally, the above-mentioned rendering of the pop-up data in the pop-up data queue according to the pop-up data order to display the pop-up includes: rendering the pop-up data in the pop-up data queue according to the pop-up data order using a hybrid renderer that supports different rendering modes to display the pop-up.

[0011] Optionally, the above-mentioned incremental loading mechanism based on asynchronous generator, which sequentially traverses the pop-up data in the pop-up data list to load it into the pop-up data queue, includes: in response to the pop-up data traversed in the above-mentioned pop-up data list being pop-up data in the first rendering order, rendering the pop-up data in the first rendering order to display the pop-ups in the first rendering order; and in response to the pop-up data traversed in the above-mentioned pop-up data list not being pop-up data in the first rendering order, adding the traversed pop-up data to the pop-up data queue.

[0012] Optionally, the pop-up data list includes: an active trigger list and an event trigger list; and the pop-up data list is generated through the following steps: adding the pop-up data in the pop-up data list that is actively triggered to the initial active trigger list to obtain the active trigger list; adding the pop-up data in the pop-up data list that is event triggered to the initial event trigger list to obtain the event trigger list; and performing the following steps on the event trigger list: registering the pop-up data in the event trigger list to the event pool corresponding to the event trigger manager, and registering corresponding listeners for each trigger event in the event trigger queue.

[0013] Optionally, the pop-up data list is obtained through the following steps: determining the pop-up mapping information corresponding to the first page from the cached pop-up mapping list, where the pop-up mapping list represents the association mapping relationship between the pop-up and the page; and extracting the pop-up data list corresponding to the pop-up mapping information.

[0014] Secondly, some embodiments of this disclosure provide a pop-up display device, including: an acquisition unit configured to acquire a pre-cached list of pop-up data for a first page; and a display unit configured to use an asynchronous generator-based progressive loading mechanism to sequentially traverse the pop-up data in the pop-up data list to load it into a pop-up data queue, and to sequentially render the pop-up data in the pop-up data queue according to the order of the pop-up data corresponding to the pop-up data queue to display the pop-up.

[0015] Optionally, the pop-up data queue includes an active trigger queue and an event trigger queue; and the display unit can be configured to: use the above-mentioned progressive loading mechanism to sequentially traverse the pop-up data in the above-mentioned pop-up data list, so as to load the pop-up data of the automatic pop-up display type into the initial active trigger queue and load the pop-up data of the behavior trigger type into the initial event trigger queue according to the display priority.

[0016] Optionally, the display unit can be configured to: render each pop-up data in the active trigger queue sequentially according to the order of the pop-up data corresponding to the active trigger queue; in response to receiving a behavior trigger event during the rendering of the target pop-up data in the active trigger queue, select a sub-queue of pop-up data corresponding to the behavior trigger event from the event pool corresponding to the event trigger queue; render the pop-up data in the sub-queue of pop-up data sequentially to display each pop-up corresponding to the behavior trigger event; and in response to completing the pop-up display for the behavior trigger event, continue to render the sequential rendering of each pop-up data in the active trigger queue that is after the target pop-up data.

[0017] Optionally, the device further includes: in response to navigating from the first page to the second page, performing the following processing steps: clearing the active trigger queue and the event trigger queue; deleting each listener corresponding to the event trigger queue; closing each pop-up window displayed on the first page; and performing pop-up rendering for the second page using the progressive loading mechanism.

[0018] Optionally, the display unit can be configured to: render the pop-up data in the pop-up data queue sequentially according to the order of the pop-up data, using a hybrid renderer that supports different rendering modes, so as to display the pop-up data.

[0019] Optionally, the display unit can be configured to: render the pop-up data in the first rendering order in response to the pop-up data being traversed in the pop-up data list; and add the traversed pop-up data to the pop-up data queue in response to the pop-up data not being traversed in the first rendering order.

[0020] Thirdly, some embodiments of this disclosure provide an electronic device, including: one or more processors; and a storage device having one or more programs stored thereon, such that when the one or more programs are executed by the one or more processors, the one or more processors implement the method as described in any implementation of the first aspect.

[0021] Fourthly, some embodiments of this disclosure provide a computer-readable medium having a computer program stored thereon, wherein the program, when executed by a processor, implements the method as described in any implementation of the first aspect.

[0022] Fifthly, some embodiments of this disclosure provide a computer program product, including a computer program that, when executed by a processor, implements the method described in any of the implementations of the first aspect above.

[0023] The above embodiments of this disclosure have the following beneficial effects: Through the pop-up display method of some embodiments of this disclosure, by utilizing the streaming characteristics of the asynchronous generator, each pop-up data is immediately added to the queue after loading and rendering is triggered. This achieves pipelined processing of loading, building, and display, maximizing the utilization of network I / O waiting time. Specifically, the reason for the low rendering efficiency and long waiting time of related pop-ups is that the complete configuration of all pop-ups needs to be loaded before pop-ups can be displayed, resulting in a long pop-up rendering waiting time and low rendering efficiency. Based on this, the pop-up display method of some embodiments of this disclosure first obtains a pre-cached list of pop-up data for the first page, and generates a pop-up data queue for rendering based on the pop-up data list corresponding to the first page, and then displays the pop-ups. Then, using a progressive loading mechanism based on the asynchronous generator, the pop-up data in the above pop-up data list is traversed sequentially to be loaded into the pop-up data queue, and the pop-up data in the above pop-up data queue is rendered sequentially according to the order of the pop-up data corresponding to the above pop-up data queue, so as to display the pop-ups. Here, leveraging an asynchronous generator-based incremental loading mechanism, an asynchronous data production channel is constructed. This transforms the original concurrent or full-load data acquisition process into a controlled, sequential, event-driven streaming process, significantly reducing server load and network congestion, improving user experience consistency, optimizing client memory and rendering performance, and supporting dynamic interruption and resource conservation. Furthermore, based on the asynchronous generator's characteristics, streaming loading and consumption of pop-up data are achieved. By pausing execution and returning data upon completion of each data load, consumers can begin processing without waiting for all data to load. Combined with dynamic queue construction, the first pop-up data is displayed immediately upon readiness, significantly reducing perceived latency for the user. In addition, data loading and queue construction are performed in parallel. Through the streaming characteristics of the asynchronous generator, each pop-up data is immediately added to the queue after loading and triggers a display check. This achieves pipelined processing of loading, building, and display, maximizing the utilization of network I / O wait time. Therefore, without loading the complete configuration of all pop-ups, the streaming characteristics enable efficient loading of required pop-ups, improving pop-up rendering efficiency. Attached Figure Description

[0024] The above and other features, advantages, and aspects of the embodiments of this disclosure will become more apparent from the accompanying drawings and the following detailed description. Throughout the drawings, the same or similar reference numerals denote the same or similar elements. It should be understood that the drawings are schematic, and elements are not necessarily drawn to scale.

[0025] Figure 1 This is a schematic diagram illustrating an application scenario of a pop-up window display method according to some embodiments of the present disclosure; Figure 2This is a flowchart of some embodiments of the pop-up display method according to the present disclosure; Figure 3 These are flowcharts of other embodiments of the pop-up display method according to this disclosure; Figure 4 These are schematic diagrams illustrating the structure of some embodiments of the pop-up display device according to this disclosure; Figure 5 This is a schematic diagram of the structure of an electronic device suitable for implementing some embodiments of the present disclosure. Detailed Implementation

[0026] Embodiments of this disclosure will now be described in more detail with reference to the accompanying drawings. While some embodiments of this disclosure are shown in the drawings, it should be understood that this disclosure can be implemented in various forms and should not be construed as limited to the embodiments set forth herein. Rather, these embodiments are provided to provide a more thorough and complete understanding of this disclosure. It should be understood that the accompanying drawings and embodiments of this disclosure are for illustrative purposes only and are not intended to limit the scope of protection of this disclosure.

[0027] It should also be noted that, for ease of description, only the parts relevant to the invention are shown in the accompanying drawings. Unless otherwise specified, the embodiments and features described in this disclosure can be combined with each other.

[0028] It should be noted that the concepts of "first" and "second" mentioned in this disclosure are used only to distinguish different devices, modules or units, and are not used to limit the order of functions performed by these devices, modules or units or their interdependencies.

[0029] It should be noted that the terms "a" and "a plurality of" used in this disclosure are illustrative rather than restrictive, and those skilled in the art should understand that, unless otherwise expressly indicated in the context, they should be understood as "one or more".

[0030] The names of messages or information exchanged between multiple devices in the embodiments of this disclosure are for illustrative purposes only and are not intended to limit the scope of such messages or information.

[0031] Before performing any of the operations involving the collection, storage, or use of personal information (such as pop-up data lists) disclosed in this disclosure, the relevant organizations or individuals shall fulfill their obligations, including conducting personal information security impact assessments, informing personal information subjects, and obtaining prior authorization and consent from personal information subjects.

[0032] This disclosure will now be described in detail with reference to the accompanying drawings and embodiments.

[0033] Figure 1This is a schematic diagram illustrating an application scenario of a pop-up window display method according to some embodiments of the present disclosure.

[0034] exist Figure 1 In this application scenario, firstly, the electronic device 101 can obtain a pre-cached list 103 of pop-up data for the first page 102. In this application scenario, the pop-up data list 103 may include: pop-up metadata A, pop-up metadata B, ..., pop-up metadata Z. Then, the electronic device 101 can utilize an asynchronous generator-based incremental loading mechanism to sequentially traverse the pop-up data in the aforementioned list to load it into the pop-up data queue 104, and render the pop-up data in the queue sequentially according to the order of the pop-up data in the queue 104 for pop-up display. In this application scenario, the pop-up data queue 104 can be "[pop-up metadata B, pop-up metadata A... pop-up metadata Z]".

[0035] It should be noted that the aforementioned electronic device 101 can be either hardware or software. When the electronic device is hardware, it can be implemented as a distributed cluster consisting of multiple servers or terminal devices, or as a single server or a single terminal device. When the electronic device is software, it can be installed in the hardware devices listed above. It can be implemented as, for example, multiple software programs or software modules used to provide distributed services, or as a single software program or software module. No specific limitations are made here.

[0036] It should be understood that Figure 1 The number of electronic devices shown is merely illustrative. Any number of electronic devices can be used depending on the implementation requirements.

[0037] Continue to refer to Figure 2 The diagram illustrates a flow 200 of some embodiments of a pop-up window display method according to the present disclosure. This pop-up window display method includes the following steps: Step 201: Obtain the pre-cached list of pop-up data for the first page.

[0038] In some embodiments, the execution entity of the above pop-up display method (e.g.) Figure 1The electronic device 101 shown can obtain a pre-cached list of pop-up data for the first page via a wired or wireless connection. The first page can be the page currently being rendered and displayed as a pop-up. For example, the first page could be a shopping page. The pop-up data can be data related to the pop-up. For example, pop-up data can be metadata related to the pop-up. In practice, pop-up data may include: pop-up ID (Identity document), pop-up name, pop-up importance weight, and trigger type. It should be noted that the pop-up data here does not include the actual content displayed (e.g., title, body text, image links). The trigger type here can be the type that triggers the rendering and display of the pop-up. In practice, trigger types can include: active triggering (e.g., triggering when the page loads) and event triggering (e.g., triggering based on user behavior). Here, each piece of pop-up data in the pop-up data list can be the data corresponding to each pop-up that supports rendering and display on the first page. In practice, the first page and the pop-up data list can be pre-cached locally. By caching only the data for each pop-up and not the actual content displayed, the amount of cached data can be reduced when loading the complete configuration corresponding to the pop-up. It should be noted that there is a cache time limit for caching the pop-up data list (the maximum cache duration can be preset). The data for each pop-up in the pop-up data list can be sorted according to the order in which they are rendered.

[0039] It should be noted that the execution entity here can be a local client.

[0040] In some optional implementations of certain embodiments, the pop-up data list includes: an active trigger list and an event trigger list. The pop-up data in the active trigger list can be actively triggered pop-up data. For example, active triggering could mean automatically displaying the pop-up when the page loads. The pop-up data in the event trigger list can be event-triggered pop-up data. Event triggering can represent the rendering of pop-up data triggered by a related event. For example, the related event could be a user's click event on the first page. The pop-up data in the active trigger list are sorted according to their display order. The event trigger list may or may not have a corresponding display order.

[0041] It should be noted that for the pop-up data in the pop-up data list, there are corresponding category field values. These category field values ​​represent the trigger type of the pop-up data. For example, when the category field value is 1, it indicates that the trigger type of the pop-up data is active triggering. When the category field value is 2, it indicates that the trigger type of the pop-up data is event triggering.

[0042] For each pop-up data in the actively triggered list, the pop-up rendering and display can be performed according to the data in the actively triggered list by default.

[0043] Optionally, the above pop-up data list is generated through the following steps: The first step is to add the pop-up data corresponding to actively triggered pop-ups from the pop-up data list above to the initial actively triggered list, thus obtaining the actively triggered list. The initial actively triggered list can be an empty list that has not yet been filled with actively triggered pop-up data.

[0044] As an example, the aforementioned execution entity can add pop-up data with a category field value of 1 from the pop-up data list to the initial active trigger list to obtain the active trigger list.

[0045] The second step is to add the event-triggered pop-up data from the pop-up data list to the initial event trigger list, thus obtaining the event trigger list. The initial event trigger list can be an empty list that has not yet added pop-up data corresponding to its event trigger type.

[0046] As an example, the aforementioned execution entity can add pop-up data with a corresponding category field value of 0 from the pop-up data list to the initial event trigger list to obtain the event trigger list.

[0047] Optionally, perform the following steps on the above event trigger list: Register the pop-up data in the above event trigger list to the event pool corresponding to the event trigger manager, and register the corresponding listeners for each trigger event in the above event trigger queue. The event trigger manager can be a singleton central control module (usually a class or object), responsible for uniformly managing the logic of all triggerable pop-ups (or actions) on the page. The event trigger manager can be a bridge connecting "user behavior" and "business response (e.g., loading a pop-up)". The event trigger manager has the following responsibilities: registry center, listener proxy, route distribution, and state management. The registry center can receive the event configuration list from the outside and store it in the "event pool". The listener proxy can uniformly take over the click / interaction events of specific elements on the page (e.g., buttons, links, hotspots). Route distribution can be "when a user triggers an event, the manager finds the corresponding configuration information based on the event ID and then decides what to do next". State management can prevent duplicate triggers, handle debouncing / throttling, and manage the enabled / disabled state of events. The event pool can be a data structure maintained internally by the event trigger manager to store the configuration information of all registered events to be triggered. The event pool is a static or dynamically updated "repository". The event pool stores pop-up data. Listeners can be pre-registered code that waits for events to occur. They do not consume computing resources before an event occurs; once a specified event is detected, they automatically wake up and execute the corresponding defined logic. Here, listeners can be used to monitor the occurrence of various behavioral events to trigger a query for the corresponding pop-up data from the event pool.

[0048] In some optional implementations of certain embodiments, the above-mentioned pop-up data list is obtained through the following steps: The first step is to determine the pop-up mapping information corresponding to the first page from the cached pop-up mapping list. This pop-up mapping list represents the association mapping relationship between pop-ups and pages. The pop-up mapping list can store the pop-up mapping information of each pop-up associated with each page. That is, the pop-up mapping information here can represent the association relationship between a page and each corresponding displayable pop-up. For example, the pop-up mapping information could be {page 1, pop-up 1, pop-up 2, pop-up 3}. This indicates that page 1 supports the rendering and display of pop-ups 1, 2, and 3.

[0049] The second step is to extract the pop-up data list corresponding to the above pop-up mapping information.

[0050] As an example, firstly, the information for each pop-up is extracted from the pop-up mapping information. Then, the data for each pop-up corresponding to each piece of information is retrieved from the pop-up database to generate a list of pop-up data.

[0051] Step 202: Using an asynchronous generator-based incremental loading mechanism, the pop-up data in the pop-up data list is traversed sequentially to be loaded into the pop-up data queue. The pop-up data in the pop-up data queue is rendered sequentially according to the order of the pop-up data in the pop-up data queue to display the pop-up.

[0052] In some embodiments, the aforementioned execution entity can utilize an asynchronous generator-based incremental loading mechanism to sequentially traverse the pop-up data in the pop-up data list to load it into the pop-up data queue, and then render the pop-up data in the pop-up data queue sequentially according to the order of the pop-up data in the queue for pop-up display. The asynchronous generator-based incremental loading mechanism is an advanced architectural pattern that decouples data fetching from rendering control, enabling on-demand, sequential, and low-pressure data processing. It is a data processing method and system for handling serialized data tasks (e.g., multi-pop-up display, paginated data loading). This method transforms the originally concurrent or full-load data fetching process into a controlled, sequential, event-driven streaming process by constructing an asynchronous data production channel. Specifically, it utilizes the asynchronous generator feature of the JavaScript ES2018 specification to achieve streaming loading and consumption of pop-up data. The `yield` keyword pauses execution and returns data upon completion of each data load, allowing consumers to begin processing without waiting for all data to load. An asynchronous generator can be a special program execution unit or logic module configured to pause and resume multiple times during execution, returning an asynchronous data object (e.g., a Promise object) to the caller at each pause. Asynchronous generators have the following characteristics: state preservation, lazy yielding, and asynchronous non-blocking. State preservation means that during execution pauses, the current execution context (including local variables, loop counters, stack pointers, etc.) is fully preserved, allowing execution to resume precisely from the pause point upon receiving a continuation instruction, without reinitialization. Lazy yielding means that the entire dataset is not pre-computed or fetched; instead, a single data fetch operation (such as a network request or file read) is triggered only upon receiving an external request (Next Request), and the result is encapsulated and output. Asynchronous non-blocking can be achieved by actively releasing control of the main thread while waiting for time-consuming operations (such as I / O operations or network responses) to complete, allowing other tasks to execute, and then resuming operations through callbacks or event mechanisms upon completion. The incremental loading mechanism based on asynchronous generators can achieve the following technical effects: reduced server load and network congestion, improved user experience consistency, optimized client memory and rendering performance, and support for dynamic interruption and resource conservation.

[0053] It should be noted that loading pop-up data into the pop-up data queue facilitates on-demand pop-up rendering and display. The order of the pop-up data can be the sorting of the individual pop-up data in the pop-up data queue. Here, loading the pop-up data from the pop-up data list into the pop-up data queue and rendering it sequentially according to the pop-up data order are performed simultaneously. That is, the sequential loading and rendering of pop-up data occur concurrently.

[0054] As an example, the pop-up data can be rendered and displayed sequentially according to the order of the pop-up data.

[0055] In some optional implementations of certain embodiments, the execution entity may render the pop-up data in the pop-up data queue sequentially according to the order of the pop-up data corresponding to the pop-up data queue, in order to display the pop-up, including the following steps: Based on the order of the pop-up data, a hybrid renderer supporting different rendering modes is used to render the pop-up data in the queue sequentially for pop-up display. The hybrid renderer is specifically designed for unified management and dynamic rendering of pop-ups. Through a unified interface `CustomRenderer` and a factory pattern `RendererFactory`, it abstracts and dynamically switches between various rendering methods using different technology stacks. The main functions of the hybrid renderer include: unified interface specification, dynamic routing and switching, queue management, lifecycle management, sandboxing and security isolation, and scalability. The unified interface specification defines the standard behaviors for `render`, `close`, and `destroy` (optional), allowing upper-layer business logic to be unaware of the underlying rendering process. Dynamic routing and switching can automatically select the most suitable rendering strategy based on the configuration (`config.renderType`) through `RendererFactory`. Queue management refers to the sequential display of pop-ups in conjunction with `queueManager` and `showNextPopup / closePopup` logic. When a pop-up is closed and "Next" is selected, the system automatically delays (300ms) and loads the next pop-up in the queue to avoid visual abruptness. Lifecycle management can unify the management of pop-up creation, display, closing callbacks (triggering eventEmitter), and resource destruction. Sandboxing and security isolation can refer to supporting iframe mode, providing a security sandbox for untrusted or third-party content. Extensibility can refer to supporting custom renderers and dynamically loading remote components. Different rendering modes can include: BUILTIN rendering mode (corresponding to the built-in renderer), IFRAME rendering mode (corresponding to secure sandbox rendering), DYNAMIC rendering mode (corresponding to dynamic UMD component loading), WEBCOMPONENT rendering mode (corresponding to native WebComponents), and CUSTOM rendering mode (corresponding to the custom renderer). BUILTIN rendering mode can be the default mode, corresponding to scenarios where rendering is done using predefined HTML / CSS / JS templates. It is suitable for standard system notifications, confirmation boxes, and regular marketing pop-ups, offering the best performance and controllable styles. IFRAME rendering mode can be an isolation mode, corresponding to scenarios where pop-up content is embedded in... <iframe>The DYNAMIC rendering mode is suitable for displaying third-party pages, untrusted HTML content, or scenarios requiring complete isolation of CSS styles and JavaScript context to prevent pollution of the main application. The DYNAMIC mode corresponds to the on-demand loading mode, suitable for scenarios where remote UMD (Universal Module Definition) format JS components are dynamically loaded via scripts. It is suitable for large event pages and complex interactive pop-ups, which are typically developed by different teams and deployed on a CDN, eliminating the need for the main application to package all the code. The WEBCOMPONENT rendering mode is a standardized mode, suitable for scenarios using the browser's native Custom Elements (Web Components) technology for rendering. It is suitable for complex UI components requiring high reusability and framework independence (compatible with React / Vue / Angular). The CUSTOM rendering mode is an extended mode, suitable for scenarios where developers can pass in custom renderer instances or configurations (config.customRenderer). It is suitable for extremely specific business needs, such as Canvas drawing pop-ups, WebGL 3D pop-ups, or adaptation to specific legacy systems.

[0056] In some optional implementations of some embodiments, the execution entity may utilize an asynchronous generator-based incremental loading mechanism to sequentially traverse the pop-up data in the pop-up data list to load it into the pop-up data queue, including the following steps: The first step is to render the pop-up data in the first rendering order, based on the pop-up data traversed in the aforementioned pop-up data list. The pop-up in the first rendering order can be the first pop-up to be rendered and displayed on the first page. In other words, the first rendering order represents the first pop-up to be displayed.

[0057] Here, during the process of traversing the pop-up data in the pop-up data list, if the pop-up data corresponding to the pop-up is the first pop-up to be rendered and displayed on the first page, it does not need to be added to the queue and can be directly rendered and displayed.

[0058] The second step is to add the pop-up data to the pop-up data queue in response to the pop-up data being traversed not being in the first rendering order.

[0059] In some optional implementations of some embodiments, the pop-up data queue includes: an active trigger queue and an event trigger queue. The active trigger queue may include pop-up data for each pop-up auto-display type (i.e., the trigger type corresponding to the active trigger).The event trigger queue contains pop-up data for various behavior trigger types (i.e., the trigger type corresponding to the event trigger). These behavior trigger types can be based on the type triggered by a behavior event. The pop-up data in the active trigger queue are triggered in a specific order. That is, they are rendered and displayed sequentially according to the order of the pop-up data in the active trigger queue.

[0060] Optionally, the aforementioned execution entity can utilize the aforementioned progressive loading mechanism to sequentially traverse the pop-up data in the aforementioned pop-up data list, so as to load pop-up data of the automatic pop-up display type into the initial active trigger queue and pop-up data of the behavior trigger type into the initial event trigger queue according to the display priority. The display priority can be the priority of displaying pop-up data (i.e., loading according to the rendering order). Here, when adding pop-up data to the initial active trigger queue, the pop-up data in the added initial active trigger queue will be sorted according to the display priority simultaneously. The initial active trigger queue can be a queue where the addition of pop-up data of the automatic pop-up display type has not yet been completed. The initial event trigger queue can be a queue where the addition of pop-up data of the behavior trigger type has not yet been completed.

[0061] In some optional implementations of some embodiments, the execution entity may render the pop-up data in the pop-up data queue sequentially according to the order of the pop-up data corresponding to the pop-up data queue, so as to display the pop-up, including the following steps: The first step is to render each pop-up data in the above-mentioned active trigger queue in sequence according to the order of the pop-up data corresponding to the above-mentioned active trigger queue.

[0062] Here, when rendering and displaying the pop-up on the first page, the pop-up is rendered and displayed according to the pop-up data in the active trigger queue by default. The pop-up rendering and display in the active trigger queue will be interrupted only when a behavior event occurs on the first page, thereby triggering the rendering and display of each pop-up corresponding to the behavior event. The pop-up rendering and display in the active trigger queue will continue to be executed only after the rendering and display of each pop-up corresponding to the behavior event has ended.

[0063] The second step is to receive a behavior trigger event during the rendering of the target pop-up data in the aforementioned active trigger queue, and then filter out the pop-up data sub-queue corresponding to the behavior trigger event from the event pool corresponding to the aforementioned event trigger queue. It should be noted that the behavior trigger event here can be triggered by the control object corresponding to the first page. For example, the behavior trigger event can be a control click event. Each pop-up data in the pop-up data sub-sequence can be a pop-up data that is associated with the behavior trigger event. That is, when the behavior trigger event occurs, it is necessary to render and display each pop-up corresponding to the pop-up data sub-sequence.

[0064] The third step is to render the pop-up data in the above pop-up data sub-queue in sequence to display each pop-up corresponding to the above behavior triggering event.

[0065] Fourth step: In response to the completion of the pop-up display for the above-mentioned behavior triggering event, continue to execute the sequential rendering of each pop-up data in the above-mentioned active trigger queue that is after the above-mentioned target pop-up data. That is, continuing to execute the sequential rendering of each pop-up data after the above-mentioned target pop-up data can represent continuing to render the pop-up data according to the original rendering pause point of the active trigger queue.

[0066] The above embodiments of this disclosure have the following beneficial effects: Through the pop-up display method of some embodiments of this disclosure, by utilizing the streaming characteristics of the asynchronous generator, each pop-up data is immediately added to the queue after loading and triggers rendering and display. This achieves pipelined processing of loading, building, and display, maximizing the utilization of network I / O waiting time. Specifically, the reason for the low rendering efficiency and long waiting time of related pop-ups is that the complete configuration of all pop-ups needs to be loaded before pop-ups can be displayed, resulting in a long pop-up rendering waiting time and low rendering efficiency. Based on this, the pop-up display method of some embodiments of this disclosure first obtains a pre-cached list of pop-up data for the first page, and generates a pop-up data queue for rendering based on the pop-up data list corresponding to the first page, and displays the pop-ups. Then, using the incremental loading mechanism based on the asynchronous generator, the pop-up data in the above pop-up data list is traversed sequentially to be loaded into the pop-up data queue, and the pop-up data in the above pop-up data queue is rendered sequentially according to the order of the pop-up data corresponding to the above pop-up data queue, so as to display the pop-ups. Here, leveraging an asynchronous generator-based incremental loading mechanism, an asynchronous data production channel is constructed. This transforms the original concurrent or full-load data acquisition process into a controlled, sequential, event-driven streaming process, significantly reducing server load and network congestion, improving user experience consistency, optimizing client memory and rendering performance, and supporting dynamic interruption and resource conservation. Furthermore, based on the asynchronous generator's characteristics, streaming loading and consumption of pop-up data are implemented. By pausing execution and returning data upon completion of each data load, consumers can begin processing without waiting for all data to load. Combined with dynamic queue construction, the first pop-up data is displayed immediately upon readiness, significantly reducing perceived latency for the user. In addition, a parallel approach to data loading and queue construction is adopted. Through the streaming characteristics of the asynchronous generator, each pop-up data is immediately added to the queue after loading and triggers a display check. This achieves pipelined processing of loading, construction, and display, maximizing the utilization of network I / O latency.Thus, without loading the complete configurations of all pop - up windows, through the streaming feature, the efficient loading of the required pop - up windows can be achieved, improving the rendering efficiency of pop - up windows.

[0067] Further referring to Figure 3, a flowchart 300 of some other embodiments of the pop - up window display method according to the present disclosure is shown. The pop - up window display method includes the following steps: Step 301, obtain the list of pop - up window data for the first page cached in advance.

[0068] Step 302, use an asymptotic loading mechanism based on an asynchronous generator to sequentially traverse the pop - up window data in the above - mentioned list of pop - up window data to load it into the pop - up window data queue, and render the pop - up window data in the pop - up window data queue sequentially according to the order of the pop - up window data corresponding to the pop - up window data queue for pop - up window display.

[0069] In some embodiments, for the specific implementation of steps 301 - 302 and the technical effects brought thereby, reference can be made to steps 201 - 202 in the corresponding embodiments of Figure 2, which will not be elaborated here.

[0070] Step 303, in response to navigating from the above - mentioned first page to the second page, perform the following processing steps: Step 3031, clear the above - mentioned active trigger queue and the event trigger queue.

[0071] In some embodiments, the execution subject (such as the electronic device 101 shown in Figure 1) can clear the above - mentioned active trigger queue and the event trigger queue. Among them, the second page can be the page after jumping from the first page.

[0072] Step 3032, delete each listener corresponding to the above - mentioned event trigger queue.

[0073] In some embodiments, the above - mentioned execution subject can delete each listener corresponding to the above - mentioned event trigger queue.

[0074] Step 3033, close each pop-up window displayed on the above first page.

[0075] In some embodiments, the above execution subject may close each pop-up window displayed on the above first page.

[0076] Step 3034, use the above progressive loading mechanism to perform pop-up window rendering for the above second page.

[0077] In some embodiments, the above execution subject may use the above progressive loading mechanism to perform pop-up window rendering for the above second page. The specific implementation manner will not be elaborated herein.

[0078] As can be seen from Figure 3, compared with the description of some embodiments corresponding to Figure 2, in the process 300 of the pop-up window display method in some embodiments corresponding to Figure 3, after navigating from the first page to the second page, by completely removing various pop-up window data corresponding to the first page and using the progressive loading mechanism to perform pop-up window rendering for the second page, smooth conversion of the page and fast display of the pop-up window on the page after跳转 can be achieved.

[0079] Further referring to Figure 4, as an implementation of the methods shown in the above figures, some embodiments of a pop-up window display device are provided in the present disclosure. These device embodiments correspond to those method embodiments shown in Figure 2, and the pop-up window display device can be specifically applied to various electronic devices.

[0080] As shown in Figure 4, a pop-up display device 400 includes: an acquisition unit 401 and a display unit 402. Among them, the acquisition unit 401 is configured to acquire a list of pop-up window data for the first page cached in advance; the display unit 402 is configured to use an asynchronous generator-based progressive loading mechanism to sequentially traverse the pop-up window data in the above-mentioned list of pop-up window data, load it into the pop-up window data queue, and perform sequential rendering on the pop-up window data in the above-mentioned pop-up window data queue according to the order of the pop-up window data corresponding to the above-mentioned pop-up window data queue, so as to perform pop-up window display.

[0081] In some optional implementation manners of some embodiments, the above-mentioned pop-up window data queue includes: an active trigger queue and an event trigger queue; and the display unit 402 can be further configured to: use the above-mentioned progressive loading mechanism to sequentially traverse the pop-up window data in the above-mentioned list of pop-up window data, and load the pop-up window data of the automatic display type of the pop-up window into the initial active trigger queue according to the display priority, and load the pop-up window data of the behavior trigger type into the initial event trigger queue.

[0082] In some optional implementation manners of some embodiments, the display unit 402 can be further configured to: perform sequential rendering on each pop-up window data in the above-mentioned active trigger queue according to the order of the pop-up window data corresponding to the above-mentioned active trigger queue; in response to receiving a behavior trigger event during the rendering of the target pop-up window data in the above-mentioned active trigger queue, screen out the pop-up window data sub-queue corresponding to the above-mentioned behavior trigger event from the event pool corresponding to the above-mentioned event trigger queue; perform sequential rendering on the pop-up window data in the above-mentioned pop-up window data sub-queue to display each pop-up window corresponding to the above-mentioned behavior trigger event; in response to completing the pop-up window display for the above-mentioned behavior trigger event, continue to perform sequential rendering on each pop-up window data in the above-mentioned active trigger queue that is after the above-mentioned target pop-up window data.

[0083] In some optional implementation manners of some embodiments, the above-mentioned device 400 further includes: an execution unit (not shown in the figure). Among them, the above-mentioned execution unit can be configured to: in response to navigating from the above-mentioned first page to the second page, perform the following processing steps: clear the above-mentioned active trigger queue and the above-mentioned event trigger queue; delete each listener corresponding to the above-mentioned event trigger queue; close each pop-up window displayed on the above-mentioned first page; use the above-mentioned progressive loading mechanism to perform pop-up window rendering for the above-mentioned second page.

[0084] In some alternative implementations of some embodiments, the display unit 402 may be further configured to: according to the above pop-up window data order, use a hybrid renderer that supports different rendering modes to sequentially render the pop-up window data in the above pop-up window data queue for pop-up window display.

[0085] In some alternative implementations of some embodiments, the display unit 402 may be further configured to: in response to the pop-up window data traversed in the above pop-up window data list being the pop-up window data in the first rendering order, render the pop-up window data in the first rendering order for pop-up window display in the first rendering order; in response to the pop-up window data being traversed not being the pop-up window data in the first rendering order, add the pop-up window data being traversed to the pop-up window data queue.

[0086] It can be understood that the units described in the pop-up window display device 400 correspond to the respective steps in the method described in reference to Figure 2. Thus, the operations, features, and beneficial effects described above for the method also apply to the pop-up window display device 400 and the units included therein, and will not be elaborated herein.

[0087] Next, refer to Figure 5, which shows a schematic structural diagram of an electronic device (such as the electronic device 101 in Figure 1) 500 suitable for implementing some embodiments of the present disclosure. The electronic device shown in Figure 5 is only an example and should not impose any limitation on the functions and usage scope of the embodiments of the present disclosure.

[0088] As shown in Figure 5, the electronic device 500 may include a processing device (such as a central processing unit, a graphics processing unit, etc.) 501, which may perform various appropriate actions and processes according to a program stored in the read-only memory 502 or a program loaded from the storage device 508 into the random access memory 503. In the random access memory 503, various programs and data required for the operation of the electronic device 500 are also stored. The processing device 501, the read-only memory 502, and the random access memory 503 are connected to each other via a bus 504. The input / output interface 505 is also connected to the bus 504.

[0089] Generally, the following devices may be connected to the input / output interface 505: an input device 506 including, for example, a touch screen, a touchpad, a keyboard, a mouse, a camera, a microphone, an accelerometer, a gyroscope, etc.; an output device 507 including, for example, a liquid crystal display (LCD), a speaker, a vibrator, etc.; a storage device 508 including, for example, a magnetic tape, a hard disk, etc.; and a communication device 509. The communication device 509 may allow the electronic device 500 to communicate with other devices wirelessly or wiredly to exchange data. Although Figure 5 shows an electronic device 500 having various devices, it should be understood that it is not required to implement or have all the shown devices. Instead, more or fewer devices may be implemented or had. Each block shown in Figure 5 may represent one device or, as needed, multiple devices.

[0090] Specifically, according to some embodiments of the present disclosure, the processes described above with reference to the flowcharts may be implemented as computer software programs. For example, some embodiments of the present disclosure include a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program contains program codes for performing the methods shown in the flowcharts. In such some embodiments, the computer program may be downloaded and installed from a network via the communication device 509, or installed from the storage device 508, or installed from the read-only memory 502.When the computer program is executed by the processing device 501, it performs the functions described above as defined in some embodiments of the present disclosure.

[0091] It should be noted that, in some embodiments of this disclosure, the computer-readable medium described above may be a computer-readable signal medium or a computer-readable storage medium, or any combination thereof. A computer-readable storage medium may be, for example,—but not limited to—an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination thereof. More specific examples of a computer-readable storage medium may include, but are not limited to: an electrical connection having one or more wires, a portable computer disk, a hard disk, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage device, magnetic storage device, or any suitable combination thereof. In some embodiments of this disclosure, a computer-readable storage medium may be any tangible medium containing or storing a program that can be used by or in conjunction with an instruction execution system, apparatus, or device. In some embodiments of this disclosure, a computer-readable signal medium may include a data signal propagated in baseband or as part of a carrier wave, carrying computer-readable program code. Such propagated data signals may take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination thereof. A computer-readable signal medium can be any computer-readable medium other than a computer-readable storage medium, which can send, propagate, or transmit a program for use by or in connection with an instruction execution system, apparatus, or device. The program code contained on the computer-readable medium can be transmitted using any suitable medium, including but not limited to: wires, optical fibers, RF (radio frequency), etc., or any suitable combination thereof.

[0092] In some embodiments, the client and server may communicate using any currently known or future-developed network protocol such as HTTP (Hypertext Transfer Protocol) and may interconnect with digital data communication (e.g., communication networks) of any form or medium. Examples of communication networks include local area networks ("LANs"), wide area networks ("WANs"), the Internet (e.g., the Internet of Things), and peer-to-peer networks (e.g., ad hoc peer-to-peer networks), as well as any currently known or future-developed networks.

[0093] The computer-readable medium may be included in the above-mentioned electronic device; or it may exist alone and not assembled into the electronic device.The aforementioned computer-readable medium carries one or more programs. When the aforementioned one or more programs are executed by the electronic device, the electronic device causes the electronic device to: obtain a pre-cached list of pop-up data for the first page; use an asynchronous generator-based incremental loading mechanism to sequentially traverse the pop-up data in the aforementioned list of pop-up data to load it into a pop-up data queue; and render the pop-up data in the aforementioned pop-up data queue sequentially according to the order of the pop-up data corresponding to the aforementioned pop-up data queue to display the pop-up.

[0094] Computer program code for performing operations of some embodiments of this disclosure can be written in one or more programming languages ​​or a combination thereof, including object-oriented programming languages ​​such as Java, Smalltalk, and C++, and conventional procedural programming languages ​​such as the "C" language or similar programming languages. The program code can be executed entirely on the user's computer, partially on the user's computer, as a standalone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving remote computers, the remote computer can be connected to the user's computer via any type of network—including a local area network (LAN) or a wide area network (WAN)—or can be connected to an external computer (e.g., via the Internet using an Internet service provider).

[0095] The flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functionality, and operation of possible implementations of systems, methods, and computer program products according to various embodiments of the present disclosure. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of code containing one or more executable instructions for implementing a specified logical function. It should also be noted that in some alternative implementations, the functions marked in the blocks may occur in a different order than those marked in the drawings. For example, two consecutively indicated blocks may actually be executed substantially in parallel, and they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in a block diagram and / or flowchart, and combinations of blocks in block diagrams and / or flowcharts, may be implemented using a dedicated hardware-based system that performs the specified function or operation, or using a combination of dedicated hardware and computer instructions.

[0096] The units described in some embodiments of this disclosure can be implemented in software or in hardware. The described units can also be disposed in a processor, for example, a processor may be described as including an acquisition unit and a display unit.In some cases, the names of these units do not constitute a limitation on the unit itself. For example, the retrieval unit can also be described as "a unit that retrieves a pre-cached list of pop-up data for the first page".

[0097] The functions described above herein can be performed at least in part by one or more hardware logic components. For example, without limitation, exemplary types of hardware logic components that can be used include: field-programmable gate arrays (FPGAs), application-specific integrated circuits (ASICs), application-specific standard products (ASSPs), system-on-a-chip (SOCs), complex programmable logic devices (CPLDs), and so on.

[0098] Some embodiments of this disclosure also provide a computer program product, including a computer program that, when executed by a processor, implements any of the pop-up display methods described above.

[0099] The above description is merely a selection of preferred embodiments of this disclosure and an explanation of the technical principles employed. Those skilled in the art should understand that the scope of the invention involved in the embodiments of this disclosure is not limited to technical solutions formed by specific combinations of the above-described technical features, but should also cover other technical solutions formed by arbitrary combinations of the above-described technical features or their equivalents without departing from the above-described inventive concept. For example, technical solutions formed by mutually substituting the above-described features with (but not limited to) technical features with similar functions disclosed in the embodiments of this disclosure.< / iframe>

Claims

1. A method for displaying a pop-up window, comprising: Retrieve a pre-cached list of pop-up data for the first page; Using an asynchronous generator-based incremental loading mechanism, the pop-up data in the pop-up data list is traversed sequentially to be loaded into the pop-up data queue. The pop-up data in the pop-up data queue is rendered sequentially according to the order of the pop-up data in the pop-up data queue for pop-up display.

2. The method according to claim 1, wherein, The pop-up data queue includes: an active trigger queue and an event trigger queue; and The method of using an asynchronous generator-based incremental loading mechanism to sequentially traverse the pop-up data in the pop-up data list and load it into the pop-up data queue includes: Using the progressive loading mechanism, the pop-up data in the pop-up data list is traversed sequentially to load pop-up data of the automatic display type into the initial active trigger queue and pop-up data of the behavior trigger type into the initial event trigger queue according to the display priority.

3. The method according to claim 2, wherein, The step of rendering the pop-up data in the pop-up data queue sequentially according to the order of the pop-up data in the pop-up data queue for pop-up display includes: According to the order of the pop-up data corresponding to the active trigger queue, each pop-up data in the active trigger queue is rendered sequentially; In response to receiving a behavior trigger event during the rendering of target pop-up data in the active trigger queue, a pop-up data sub-queue corresponding to the behavior trigger event is selected from the event pool corresponding to the event trigger queue; The pop-up data in the pop-up data sub-queue is rendered sequentially to display each pop-up corresponding to the behavior triggering event; In response to the completion of the pop-up display for the behavior-triggered event, the sequential rendering of each pop-up data following the target pop-up data in the active trigger queue continues.

4. The method according to claim 2, wherein, The method further includes: In response to navigation from the first page to the second page, the following processing steps are performed: The active trigger queue and the event trigger queue are cleared. Delete each listener corresponding to the event triggering queue; Close all pop-ups displayed on the first page; Using the progressive loading mechanism, a pop-up rendering is performed for the second page.

5. The method according to claim 1, wherein, The step of rendering the pop-up data in the pop-up data queue sequentially according to the order of the pop-up data in the pop-up data queue for pop-up display includes: Based on the order of the pop-up data, a hybrid renderer that supports different rendering modes is used to render the pop-up data in the pop-up data queue sequentially for pop-up display.

6. The method according to claim 1, wherein, The method of using an asynchronous generator-based incremental loading mechanism to sequentially traverse the pop-up data in the pop-up data list and load it into the pop-up data queue includes: In response to the pop-up data being traversed in the pop-up data list being pop-up data in the first rendering order, the pop-up data in the first rendering order is rendered to display pop-ups in the first rendering order. In response to pop-up data that is not in the first rendering order during the traversal, the pop-up data being traversed is added to the pop-up data queue.

7. The method according to claim 1, wherein, The pop-up data list includes: an active trigger list and an event trigger list; and The pop-up data list is generated through the following steps: Add the pop-up data corresponding to the actively triggered pop-up in the pop-up data list to the initial actively triggered list to obtain the actively triggered list; Add the event-triggered pop-up data corresponding to the pop-up in the pop-up data list to the initial event trigger list to obtain the event trigger list; And perform the following steps on the event trigger list: Register the pop-up data in the event trigger list to the event pool corresponding to the event trigger manager, and register the corresponding listener for each trigger event in the event trigger queue.

8. The method according to claim 1, wherein, The pop-up data list is obtained through the following steps: The pop-up mapping information corresponding to the first page is determined from the cached pop-up mapping list, wherein the pop-up mapping list represents the association mapping relationship between the pop-up and the page; Extract the pop-up data list corresponding to the pop-up mapping information.

9. A pop-up display device, comprising: The retrieval unit is configured to retrieve a pre-cached list of pop-up data for the first page; The display unit is configured to use an asynchronous generator-based incremental loading mechanism to sequentially traverse the pop-up data in the pop-up data list to load it into the pop-up data queue, and to sequentially render the pop-up data in the pop-up data queue according to the order of the pop-up data corresponding to the pop-up data queue for pop-up display.

10. An electronic device, comprising: One or more processors; Storage device, on which one or more programs are stored, When the one or more programs are executed by the one or more processors, the one or more processors implement the method as described in any one of claims 1-8.

11. A computer-readable medium having a computer program stored thereon, wherein, When the computer program is executed by a processor, it implements the method as described in any one of claims 1-8.

12. A computer program product comprising a computer program that, when executed by a processor, implements the method according to any one of claims 1-8.

Images