CN111930442A - Page view loading method and device, storage medium and electronic equipment - Google Patents
Page view loading method and device, storage medium and electronic equipment Download PDFInfo
- Publication number
- CN111930442A CN111930442A CN202011071321.2A CN202011071321A CN111930442A CN 111930442 A CN111930442 A CN 111930442A CN 202011071321 A CN202011071321 A CN 202011071321A CN 111930442 A CN111930442 A CN 111930442A
- Authority
- CN
- China
- Prior art keywords
- page
- view
- cache
- data
- interactive
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Data Mining & Analysis (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
- Processing Or Creating Images (AREA)
Abstract
The disclosure relates to a loading method, a loading device, a storage medium and an electronic device of a page view, wherein the method comprises the following steps: the method comprises the steps of generating a first page view of a target page according to first page data, displaying the first page view, then obtaining the first page data, rendering according to the first page data to generate a cache page view, and obtaining cache data according to the cache page view, wherein the cache data comprises: the method comprises the steps of caching images and interactive data, responding to a trigger instruction aiming at a target page, displaying the cached images on a display screen, acquiring second page data, and executing a received interactive instruction according to the cached interactive data before generating a second page view of the target page according to the second page data. According to the method and the device, the generation of the first page view and the generation of the cache page view are asynchronously executed, so that accurate cache images are generated, and interaction between a user and the cache images can be realized while the display speed of a target page is ensured.
Description
Technical Field
The present disclosure relates to the field of image processing technologies, and in particular, to a method and an apparatus for loading a page view, a storage medium, and an electronic device.
Background
With the continuous development of terminal technology, terminal devices are widely applied to various aspects of people's life. In the process that a user uses an App (english: Application, chinese: Application) on a terminal device, in order to improve the user experience, the display of an App page is usually optimized. At present, a cache page view is rendered for display before a page view of a target page is generated, so as to improve the display speed of the target page and reduce the waiting time of a user. And then after generating the page view of the target page, replacing the cache page view with the page view so as to finish the final display of the target page.
In the related art, a preset pocket floor-occupying image (e.g., a gray floor-occupying image) is generally adopted as a cache page view, or a cache page view is rendered by pre-caching page data of a page view of a last generation target page. The pocket bottom occupancy image is used as the cache page view, a user can only see the fixed pocket bottom occupancy image, effective information cannot be obtained, and the user cannot interact with the cache page view. And the cached page view is rendered through the cached page data, although the interaction between the user and the cached page view can be realized, when the cached data amount is large, inefficient I/O (Input/Output) operation is caused, and the cached page data needs to be measured and laid out again before being rendered, so that the load of a main thread is increased, and the display speed of a target page is reduced.
Disclosure of Invention
In order to solve the problems in the related art, the disclosure provides a page view loading method and device, a storage medium and an electronic device.
In order to achieve the above object, according to a first aspect of the embodiments of the present disclosure, there is provided a method for loading a page view, the method including:
the method comprises the steps that a first page view of a target page is generated according to first page data, and the first page data are obtained after the first page view is displayed on a display screen of terminal equipment;
rendering according to the first page data to generate a cache page view;
according to the cache page view, cache data are obtained, and the cache data comprise: the cache image is an image displayed by the cache page view, and the cache interaction data is used for indicating interaction operation which can be executed by the cache page view;
responding to a trigger instruction aiming at the target page, displaying the cache image on the display screen, and acquiring second page data;
and executing the received interaction instruction according to the cache interaction data before generating a second page view of the target page according to the second page data.
Optionally, the obtaining cache data according to the cache page view includes:
screenshot is carried out on the cached page view so as to obtain the cached image;
and determining the cache interactive data according to the view tree corresponding to the cache page view.
Optionally, before the screenshot is performed on the cached page view to obtain the cached image, the obtaining cached data according to the cached page view further includes:
and if the view tree has dynamic view elements, controlling the dynamic view elements to be displayed statically, wherein the dynamic view elements are dynamic images or videos.
Optionally, the determining the cache interaction data according to the view tree corresponding to the cache page view includes:
traversing the view tree to obtain attribute information of each view element, wherein the attribute information comprises: the location of the view element;
acquiring interactive view elements in the view tree, wherein the interactive view elements comprise interactive logic;
and taking the attribute information of the interactive view element as the cache interactive data.
Optionally, the executing the received interaction instruction according to the cached interaction data includes:
acquiring a first position of the interactive instruction on the cache image;
determining a target interactive view element corresponding to the first position in the cache interactive data, wherein the attribute information of the target interactive view element is matched with the first position;
and executing the interactive instruction according to the target interactive view element.
Optionally, the attribute information further includes: the executing the received interactive instruction according to the cached interactive data includes:
acquiring a first position of the interactive instruction on the cache image;
determining a target interactive view element corresponding to the first position in the cache interactive data, wherein the position of the target interactive view element is matched with the first position, and the depth of the target interactive view element meets a preset condition;
and executing the interactive instruction according to the target interactive view element.
Optionally, the method further comprises:
after the second page view is generated according to the second page data, the second page view is displayed on the display screen.
According to a second aspect of the embodiments of the present disclosure, there is provided an apparatus for loading a page view, the apparatus including:
the acquisition module is configured to acquire first page data after generating a first page view of a target page according to the first page data and displaying the first page view on a display screen of a terminal device;
a rendering module configured to render according to the first page data to generate a cached page view;
the obtaining module is further configured to obtain cache data according to the cache page view, where the cache data includes: the cache image is an image displayed by the cache page view, and the cache interaction data is used for indicating interaction operation which can be executed by the cache page view;
the processing module is configured to respond to a trigger instruction aiming at the target page, display the cache image on the display screen and acquire second page data;
an execution module configured to execute the received interaction instruction according to the cached interaction data before generating a second page view of the target page according to the second page data.
Optionally, the obtaining module includes:
a screenshot submodule configured to screenshot the cached page view to obtain the cached image;
the first determining submodule is configured to determine the cache interaction data according to the view tree corresponding to the cache page view.
Optionally, the obtaining module further includes:
the control submodule is configured to control a static display of a dynamic view element if the dynamic view element exists in the view tree before the cache page view is subjected to screenshot to obtain the cache image, wherein the dynamic view element is a dynamic image or a video.
Optionally, the view tree comprises at least one view element, the first determining submodule being configured to:
traversing the view tree to obtain attribute information of each view element, wherein the attribute information comprises: the location of the view element;
acquiring interactive view elements in the view tree, wherein the interactive view elements comprise interactive logic;
and taking the attribute information of the interactive view element as the cache interactive data.
Optionally, the execution module includes:
an obtaining sub-module configured to obtain a first position of the interaction instruction on the cache image;
a second determining submodule configured to determine a target interactive view element corresponding to the first position in the cached interactive data, wherein the attribute information of the target interactive view element matches with the first position;
an execution submodule configured to execute the interactive instruction according to the target interactive view element.
Optionally, the attribute information further includes: a depth of the view element, the execution module comprising:
an obtaining sub-module configured to obtain a first position of the interaction instruction on the cache image;
a second determining submodule configured to determine a target interactive view element corresponding to the first position in the cached interactive data, where the position of the target interactive view element matches the first position, and the depth of the target interactive view element satisfies a preset condition;
an execution submodule configured to execute the interactive instruction according to the target interactive view element.
Optionally, the apparatus further comprises:
a presentation module configured to present the second page view on the display screen after generating the second page view from the second page data.
According to a third aspect of embodiments of the present disclosure, there is provided a computer readable storage medium having stored thereon a computer program which, when executed by a processor, performs the steps of the method of the first aspect described above.
According to a fourth aspect of the embodiments of the present disclosure, there is provided an electronic apparatus including:
a memory having a computer program stored thereon;
a processor for executing the computer program in the memory to carry out the steps of the method of the first aspect above.
According to the technical scheme, the method comprises the steps of firstly generating a first page view of a target page according to first page data, obtaining the first page data after the first page view is displayed on a display screen of the terminal device, rendering according to the first page data to generate a cache page view, and then obtaining cache data according to the cache page view, wherein the cache data comprises the following steps: the method comprises the steps of caching images and caching interactive data, wherein the caching images are images displayed by a caching page view, the caching interactive data are used for indicating interactive operation which can be executed by the caching page view, then responding to a trigger instruction aiming at a target page, displaying the caching images on a display screen, acquiring second page data, and finally executing a received interactive instruction according to the caching interactive data before generating a second page view of the target page according to the second page data. According to the method and the device, after the first page view is generated according to the first page data, a piece of first page data is acquired to generate the cache page view, the generation of the first page view and the generation of the cache page view are asynchronously executed, so that the cache image acquired according to the cache page view is not influenced by an interaction instruction, the accurate cache image is ensured to be generated, then the cache image is directly displayed when a trigger instruction is received, the received interaction instruction is executed according to the cache interaction data, and the interaction between a user and the cache image can be realized while the display speed of a target page is ensured.
Additional features and advantages of the disclosure will be set forth in the detailed description which follows.
Drawings
The accompanying drawings, which are included to provide a further understanding of the disclosure and are incorporated in and constitute a part of this specification, illustrate embodiments of the disclosure and together with the description serve to explain the disclosure without limiting the disclosure. In the drawings:
FIG. 1 is a flowchart illustrating a method of loading a page view in accordance with an illustrative embodiment;
FIG. 2 is a flow chart illustrating one step 103 according to the embodiment shown in FIG. 1;
FIG. 3 is a flow chart illustrating another step 103 according to the embodiment shown in FIG. 1;
FIG. 4 is a flow chart illustrating one step 105 according to the embodiment shown in FIG. 1;
FIG. 5 is a flowchart illustrating another method of loading a page view in accordance with an illustrative embodiment;
FIG. 6 is a block diagram illustrating a page view loading apparatus in accordance with an illustrative embodiment;
FIG. 7 is a block diagram of an acquisition module according to the embodiment shown in FIG. 6;
FIG. 8 is a block diagram of another acquisition module shown in accordance with the embodiment shown in FIG. 6;
FIG. 9 is a block diagram of an execution module shown in accordance with the embodiment shown in FIG. 6;
FIG. 10 is a block diagram illustrating a loading mechanism of another page view in accordance with an illustrative embodiment;
FIG. 11 is a block diagram illustrating an electronic device in accordance with an example embodiment.
Detailed Description
The following detailed description of specific embodiments of the present disclosure is provided in connection with the accompanying drawings. It should be understood that the detailed description and specific examples, while indicating the present disclosure, are given by way of illustration and explanation only, not limitation.
Before introducing the page view loading method, device, storage medium and electronic device provided by the present disclosure, an application scenario related to each embodiment of the present disclosure is first introduced, where the application scenario may be a scenario in which a page view of a target page is loaded. In this scenario, when a user opens a target page through a terminal device, the terminal device may send a data request to the server to obtain page data of the target page sent by the server, and generate a page view of the target page according to the page data of the target page. The target page may be an APP page, a web page, or a form page, which is not specifically limited in this disclosure. The terminal may be a mobile terminal such as a smart phone, a tablet computer, a smart watch, a smart bracelet, a PDA (Personal Digital Assistant, chinese), or a fixed terminal such as a desktop computer. The server may include, but is not limited to: an entity server, a server cluster or a cloud server, etc.
FIG. 1 is a flowchart illustrating a method of loading a page view in accordance with an exemplary embodiment. As shown in fig. 1, the method may include the steps of:
And 102, rendering according to the first page data to generate a cache page view.
For example, the process of showing the target page is actually the process of loading the page view of the target page. When a user opens a target page through the terminal equipment at a first moment, a trigger instruction aiming at the target page is sent to the terminal equipment. After receiving the trigger instruction, the terminal device may acquire first page data of a target page sent by the server, and then may render the first page data through a main thread of an operating system of the terminal device to generate a first page view of the target page, and display the first page view on a display screen of the terminal device. The operating system of the terminal device may be, for example: android (chinese: Android), iOS (english: iPhone Operation System), Windows operating System, and the like. After the first page view is displayed on the display screen of the terminal device, a copy of the first page data may be obtained again through an asynchronous thread of an operating system of the terminal device (i.e., the copy of the first page data is made through the asynchronous thread), and the obtained first page data is rendered through the asynchronous thread to generate the cache page view.
And 103, acquiring cache data according to the cache page view. Wherein caching data comprises: the cache image is an image displayed by the cache page view, and the cache interaction data is used for indicating interaction operation which can be executed by the cache page view.
Specifically, the cached page view may correspond to at least one view element, and the view element is an element displayed on the cached page view. The view element may be a text element for characterizing text in the cached page view, an image element for characterizing an image in the cached page view, and an interactive view element for characterizing an interactive operation that can be performed in the cached page view, which may be, for example, a click operation, an exposure operation. After the cached page view is generated, screenshot can be firstly performed on the cached page view through an asynchronous thread to obtain a cached image exhibited by the cached page view and image information of the cached image, wherein the image information may include the height and the width of the cached image. Meanwhile, if the cached page view is a view capable of performing the interactive operation (i.e., the cached page view includes an interactive view element), the cached interactive data indicating the interactive operation that the cached page view is capable of performing may be obtained. The cached image and the cached interaction data can then be stored locally at the terminal device as cached data.
The cached interaction data may include a position and a depth of each interaction view element corresponding to the cached page view. The position of each interactive view element may be understood as the position of the corresponding region of the interactive view element on the cached page view, for example, when the corresponding region of the interactive view element on the cached page view is a rectangle, the coordinates of four vertices of the rectangle on the cached page view may be used as the position of the interactive view element. Taking the example of representing the position of the interactive view element in the form of four coordinates, the position of the interactive view element may be (0, 0, 480, 728). The depth of each interactive view element may be understood as the priority of the interactive operation characterized by the interactive view element, the deeper the depth, the higher the priority of the interactive operation.
And 104, responding to the trigger instruction aiming at the target page, displaying the cache image on the display screen, and acquiring second page data.
In this step, when the user opens the target page again through the terminal device at a second time, the terminal device receives the trigger instruction for the target page sent by the user again, where the second time is a time after the first time. At this time, since the terminal device stores the cache data including the cache image and the cache interactive data, the terminal device may read the cache image from the cache image address where the cache image is stored in response to the trigger instruction for the target page, simultaneously directly display the cache image on the display screen according to the image information, and obtain the second page data of the target page sent by the server. The cache image can be displayed through the asynchronous thread, and the second page data can be acquired through the main thread.
It should be noted that the first page data and the second page data may be the same or different. If the first page data and the second page data are the same, the target page at the second moment is represented, and compared with the target page at the first moment, the target page is not changed. If the first page data and the second page data are different, the target page at the second moment is represented, and compared with the target page at the first moment, the target page is changed. The cache images are displayed on the display screen, the screenshots of the cache page views are actually displayed instead of the fixed pocket bottom occupying images, the display effect of the target page is good, and the user can obtain effective information. In addition, the cached page data is not required to be loaded for displaying, the cached image is directly displayed on the display screen, and the displaying speed of the target page is improved. Furthermore, the cache image is directly displayed on the display screen, and only the cache image needs to be loaded, so that the condition that the image is visually flickered due to different loading addresses and different loading speeds of the cached page data and the image data can be avoided.
And 105, executing the received interactive instruction according to the cache interactive data before generating the second page view of the target page according to the second page data.
For example, before the main thread generates the second page view of the target page according to the second page data, if the terminal device receives an interaction instruction sent by a user, the asynchronous thread may execute the received interaction instruction according to the cached interaction data. The way of executing the interactive instruction may be: firstly, the position of an interactive instruction sent by a user on a cache image is obtained, and whether an interactive view element corresponding to the position of the interactive instruction on the cache image exists in cache interactive data or not is determined by using a preset rule according to the position of the interactive instruction on the cache image. And if so, executing the received interactive instruction according to the interactive view element. The preset rule may be, for example: and obtaining the interactive view element which is matched with the position of the interactive instruction on the cache image and has the deepest depth from the positions of the plurality of interactive view elements included in the cache interactive data. Further, after the main thread generates a second page view according to the second page data, the main thread may display the second page view on the display screen, that is, replace the cache image displayed on the display screen with the second page view. After the second page view is displayed on the display screen, the second page data may be used as the first page data, and the steps 101 to 103 are repeatedly executed to update the cache data.
It should be noted that the process of generating the cached page view by the asynchronous thread is executed asynchronously in the background of the operating system, that is, the generation of the first page view by the main thread and the generation of the cached page view by the asynchronous thread are executed asynchronously, and the cached page view is not shown on the display screen. Meanwhile, in order to avoid the problem of cross-thread data synchronization, the first page data of the main thread and the first page data of the asynchronous thread need to be isolated. Compared with the mode that the first page view generation and the cache page view generation are both completed by the main thread, the mode that the first page view generation and the cache page view generation are executed asynchronously can avoid the problem that the cache page view cannot be subjected to screenshot due to the fact that the main thread responds to the interactive instruction, and the screenshot success rate is improved.
In summary, the present disclosure first generates a first page view of a target page according to first page data, and after the first page view is displayed on a display screen of a terminal device, acquires the first page data, and renders according to the first page data to generate a cache page view, and then acquires cache data according to the cache page view, where the cache data includes: the method comprises the steps of caching images and caching interactive data, wherein the caching images are images displayed by a caching page view, the caching interactive data are used for indicating interactive operation which can be executed by the caching page view, then responding to a trigger instruction aiming at a target page, displaying the caching images on a display screen, acquiring second page data, and finally executing a received interactive instruction according to the caching interactive data before generating a second page view of the target page according to the second page data. According to the method and the device, after the first page view is generated according to the first page data, a piece of first page data is acquired to generate the cache page view, the generation of the first page view and the generation of the cache page view are asynchronously executed, so that the cache image acquired according to the cache page view is not influenced by an interaction instruction, the accurate cache image is ensured to be generated, then the cache image is directly displayed when a trigger instruction is received, the received interaction instruction is executed according to the cache interaction data, and the interaction between a user and the cache image can be realized while the display speed of a target page is ensured.
Fig. 2 is a flow chart illustrating one step 103 according to the embodiment shown in fig. 1. As shown in fig. 2, step 103 may include the steps of:
and step 1031, screenshot is carried out on the cached page view so as to obtain a cached image.
For example, after generating the cached page view, the asynchronous thread may snapshot the cached page view to obtain the cached image. And then the asynchronous thread can store the cache image to a preset image cache address and acquire image information of the cache image, wherein the image information can comprise the height and the width of the cache image.
And 1032, determining the cache interaction data according to the view tree corresponding to the cache page view.
Illustratively, a cached page view may correspond to a view tree that includes at least one view element. The asynchronous thread may first traverse the view tree to obtain attribute information for each view element, the attribute information including: the position of the view element. Second, the asynchronous thread may retrieve an interactive view element in the view tree, the interactive view element including interactive logic. For example, an interactive view element including interactive logic, which may include interactive types (e.g., click, buried point report) and interactive attributes (e.g., jump link), may be obtained by an asynchronous thread through an API (english: Application Programming Interface, chinese: Application program Interface). Finally, the asynchronous thread may use the attribute information of the interactive view element as the cached interactive data.
The manner of obtaining the attribute information of each view element may be: the whole view tree is traversed by using DFS (Depth-First-Search, Chinese: Depth-First traversal algorithm), and the Depth of each view element is gradually generated in the traversal process. Then, the depth of the view element corresponding to the root node of the view tree may be marked as 0, and the depth of the view element corresponding to the child node of the root node of the view tree may be marked as 1, which are sequentially incremented. And then establishing a coordinate system by taking the root node as an origin, calculating the position of each view element in the coordinate system, and taking the position of the view element in the coordinate system as the attribute information of the view element.
For example, the data format of the cached interaction data may be as follows:
{
imagePath：“/ data / user / 0 / com.xxx.xxx / xxxx”,
width:480,
height:728,
CacheEvents:[
{
type: "click",// click behavior
positition：[0,0,480,728],
url: "xxxx"// jump floor page
},
{
type:“click”,
positition：[400,648,440,688],
url: "xxxx"// pop negative feedback
},
{
type: "exposure"// Exposure behavior
positition：[0,0,480,728],
report:{
xxx// data reporting
}
},
],
}
The description of the parameters in the above data structure is shown in table 1.
TABLE 1
Fig. 3 is a flow chart illustrating another step 103 according to the embodiment shown in fig. 1. As shown in fig. 3, before step 1031, step 103 may further include the steps of:
and 1033, if the view tree has dynamic view elements, controlling the dynamic view elements to be statically displayed, wherein the dynamic view elements are dynamic images or videos.
For example, if a dynamic view element exists in the view tree (that is, when the cache page view includes the dynamic view element), the asynchronous thread is difficult to control the timing of screenshot when the cache page view is screenshot, and the situation that the captured image is incomplete easily occurs, which may affect the quality of screenshot on the cache page view. In order to improve the quality of screenshot of the cached page view, when a dynamic view element exists in the view tree, the static display of the dynamic view element can be controlled. The dynamic view element may be a dynamic image, the dynamic image may be, for example, a GIF (Graphics Interchange Format, chinese) diagram, and the dynamic view element may also be a video (e.g., an animation). For example, when the dynamic view element is an animation, the asynchronous thread may disable an animation effect of the dynamic view element when rendering the cached page view, and obtain a first frame of the dynamic view element for displaying.
Fig. 4 is a flow chart illustrating one step 105 according to the embodiment shown in fig. 1. As shown in fig. 4, step 105 may include the steps of:
In one scenario, if the terminal device receives an interactive instruction sent by a user, the asynchronous thread may first obtain a first position of the interactive instruction on the cache image. For example, when the user performs a click operation at a certain position on the display screen (i.e., the interaction instruction is a click operation), the asynchronous thread may take the position as the first position. The asynchronous thread may then further determine whether there is an interactive view element in the cached interactive data whose attribute information matches the first location. And if so, taking the interactive view element as a target interactive view element corresponding to the first position. And finally, executing the interactive instruction according to the target interactive view element. The way of determining whether there is an interactive view element whose attribute information matches the first position may be: traversing the attribute information of each interactive view element in the cached interactive data, comparing the first position with the position of the view element included in the attribute information of each interactive view element, and if the first position is located in an area corresponding to the position of a certain interactive view element, determining that the attribute information of the interactive view element is matched with the first position.
Optionally, the attribute information may further include: the depth of the view element, step 105, may comprise the steps of:
and step A), acquiring a first position of the interactive instruction on the cache image.
And step B), determining a target interactive view element corresponding to the first position in the cache interactive data, wherein the position of the target interactive view element is matched with the first position, and the depth of the target interactive view element meets a preset condition.
And C), executing the interactive instruction according to the target interactive view element.
In another scenario, in the process of traversing the view tree, the depth of each view element may also be used as attribute information of the view element, and each view element is sequentially arranged according to the order of the depth of each view element from deep to shallow. If the terminal device receives an interactive instruction sent by a user, the asynchronous thread can firstly acquire a first position of the interactive instruction on the cache image. And then, the asynchronous thread may use the interactive view element, in the cached interactive data, whose position matches the first position and whose depth satisfies the preset condition as the target interactive view element corresponding to the first position. It is to be understood that there may be a plurality of interactive view elements whose positions match the first position, and then the interactive view element with the deepest depth of the plurality of interactive view elements may be used as the target interactive view element. For example, the sorted view tree may be traversed to find a first interactive view element whose position matches the first position as the target interactive view element. And finally, executing the interactive instruction according to the target interactive view element.
FIG. 5 is a flowchart illustrating another method of loading a page view in accordance with an illustrative embodiment. As shown in fig. 5, the method may further include the steps of:
and 106, after generating a second page view according to the second page data, displaying the second page view on the display screen.
For example, after the asynchronous thread presents the cached image on the display screen, the user may first view the target page through the cached image. Meanwhile, the main thread may continue to generate the second page view according to the second page data, and after the second page view is generated, the second page view is displayed on the display screen, that is, the cache image displayed on the display screen is replaced by the second page view.
In summary, the present disclosure first generates a first page view of a target page according to first page data, and after the first page view is displayed on a display screen of a terminal device, acquires the first page data, and renders according to the first page data to generate a cache page view, and then acquires cache data according to the cache page view, where the cache data includes: the method comprises the steps of caching images and caching interactive data, wherein the caching images are images displayed by a caching page view, the caching interactive data are used for indicating interactive operation which can be executed by the caching page view, then responding to a trigger instruction aiming at a target page, displaying the caching images on a display screen, acquiring second page data, and finally executing a received interactive instruction according to the caching interactive data before generating a second page view of the target page according to the second page data. According to the method and the device, after the first page view is generated according to the first page data, a piece of first page data is acquired to generate the cache page view, the generation of the first page view and the generation of the cache page view are asynchronously executed, so that the cache image acquired according to the cache page view is not influenced by an interaction instruction, the accurate cache image is ensured to be generated, then the cache image is directly displayed when a trigger instruction is received, the received interaction instruction is executed according to the cache interaction data, and the interaction between a user and the cache image can be realized while the display speed of a target page is ensured.
FIG. 6 is a block diagram illustrating a loading apparatus of a page view in accordance with an exemplary embodiment. As shown in fig. 6, the apparatus 200 includes:
the obtaining module 201 is configured to obtain the first page data after generating the first page view of the target page according to the first page data and displaying the first page view on the display screen of the terminal device.
A rendering module 202 configured to render according to the first page data to generate a cached page view.
The obtaining module 201 is further configured to obtain cache data according to the cache page view, where the cache data includes: the cache image is an image displayed by the cache page view, and the cache interaction data is used for indicating interaction operation which can be executed by the cache page view.
And the processing module 203 is configured to, in response to the trigger instruction for the target page, present the cache image on the display screen and acquire second page data.
The execution module 204 is configured to execute the received interaction instruction according to the cached interaction data before generating the second page view of the target page according to the second page data.
Fig. 7 is a block diagram of an acquisition module according to the embodiment shown in fig. 6. As shown in fig. 7, the obtaining module 201 includes:
a screenshot sub-module 2011 configured to screenshot the cached page view to obtain a cached image.
The first determining sub-module 2012 is configured to determine the cache interaction data according to the view tree corresponding to the cache page view.
Fig. 8 is a block diagram of another acquisition module shown in accordance with the embodiment shown in fig. 6. As shown in fig. 8, the obtaining module 201 further includes:
the control submodule 2013 is configured to, before screenshot is performed on the cached page view to obtain the cached image, control the dynamic view element to be statically displayed if the dynamic view element exists in the view tree, where the dynamic view element is a dynamic image or a video.
Optionally, the view tree comprises at least one view element, the first determination submodule 2012 is configured to:
traversing the view tree to obtain attribute information of each view element, wherein the attribute information comprises: the position of the view element.
An interactive view element in a view tree is obtained, the interactive view element including interactive logic.
And taking the attribute information of the interactive view element as cache interactive data.
FIG. 9 is a block diagram illustrating an execution module according to the embodiment shown in FIG. 6. As shown in fig. 9, the execution module 204 includes:
the obtaining sub-module 2041 is configured to obtain a first position of the interactive instruction on the cached image.
The second determining submodule 2042 is configured to determine a target interactive view element corresponding to the first position in the cached interactive data, where the attribute information of the target interactive view element matches the first position.
The execution submodule 2043 is configured to execute the interactive instruction according to the target interactive view element.
Optionally, the attribute information further includes: the depth of the view element, the execution module 204 includes:
the obtaining sub-module 2041 is configured to obtain a first position of the interactive instruction on the cached image.
The second determining submodule 2042 is configured to determine a target interactive view element corresponding to the first position in the cached interactive data, where the position of the target interactive view element matches the first position, and the depth of the target interactive view element meets a preset condition.
The execution submodule 2043 is configured to execute the interactive instruction according to the target interactive view element.
FIG. 10 is a block diagram illustrating another page view loading apparatus in accordance with an illustrative embodiment. As shown in fig. 10, the apparatus 200 further includes:
a presentation module 205 configured for presenting the second page view on the display screen after generating the second page view from the second page data.
With regard to the apparatus in the above-described embodiment, the specific manner in which each module performs the operation has been described in detail in the embodiment related to the method, and will not be elaborated here.
In summary, the present disclosure first generates a first page view of a target page according to first page data, and after the first page view is displayed on a display screen of a terminal device, acquires the first page data, and renders according to the first page data to generate a cache page view, and then acquires cache data according to the cache page view, where the cache data includes: the method comprises the steps of caching images and caching interactive data, wherein the caching images are images displayed by a caching page view, the caching interactive data are used for indicating interactive operation which can be executed by the caching page view, then responding to a trigger instruction aiming at a target page, displaying the caching images on a display screen, acquiring second page data, and finally executing a received interactive instruction according to the caching interactive data before generating a second page view of the target page according to the second page data. According to the method and the device, after the first page view is generated according to the first page data, a piece of first page data is acquired to generate the cache page view, the generation of the first page view and the generation of the cache page view are asynchronously executed, so that the cache image acquired according to the cache page view is not influenced by an interaction instruction, the accurate cache image is ensured to be generated, then the cache image is directly displayed when a trigger instruction is received, the received interaction instruction is executed according to the cache interaction data, and the interaction between a user and the cache image can be realized while the display speed of a target page is ensured.
Fig. 11 is a block diagram illustrating an electronic device 700 in accordance with an example embodiment. As shown in fig. 11, the electronic device 700 may include: a processor 701 and a memory 702. The electronic device 700 may also include one or more of a multimedia component 703, an input/output (I/O) interface 704, and a communication component 705.
The processor 701 is configured to control the overall operation of the electronic device 700, so as to complete all or part of the steps in the above-mentioned page view loading method. The memory 702 is used to store various types of data to support operation of the electronic device 700, such as instructions for any application or method operating on the electronic device 700 and application-related data, such as contact data, transmitted and received messages, images, audio, video, and so forth. The Memory 702 may be implemented by any type of volatile or non-volatile Memory device or combination thereof, such as Static Random Access Memory (SRAM), Electrically Erasable Programmable Read-Only Memory (EEPROM), Erasable Programmable Read-Only Memory (EPROM), Programmable Read-Only Memory (PROM), Read-Only Memory (ROM), magnetic Memory, flash Memory, magnetic disk, or optical disk. The multimedia components 703 may include screen and audio components. Wherein the screen may be, for example, a touch screen and the audio component is used for outputting and/or inputting audio signals. For example, the audio component may include a microphone for receiving external audio signals. The received audio signal may further be stored in the memory 702 or transmitted through the communication component 705. The audio assembly also includes at least one speaker for outputting audio signals. The I/O interface 704 provides an interface between the processor 701 and other interface modules, such as a keyboard, mouse, buttons, etc. These buttons may be virtual buttons or physical buttons. The communication component 705 is used for wired or wireless communication between the electronic device 700 and other devices. Wireless Communication, such as Wi-Fi, bluetooth, Near Field Communication (NFC), 2G, 3G, 4G, NB-IOT, eMTC, or other 5G, etc., or a combination of one or more of them, which is not limited herein. The corresponding communication component 705 may thus include: Wi-Fi module, Bluetooth module, NFC module, etc.
In an exemplary embodiment, the electronic Device 700 may be implemented by one or more Application Specific Integrated Circuits (ASICs), Digital Signal Processors (DSPs), Digital Signal Processing Devices (DSPDs), Programmable Logic Devices (PLDs), Field Programmable Gate Arrays (FPGAs), controllers, microcontrollers, microprocessors, or other electronic components, for performing the loading method of the page view.
In another exemplary embodiment, there is also provided a computer readable storage medium comprising program instructions which, when executed by a processor, implement the steps of the loading method of page views described above. For example, the computer readable storage medium may be the memory 702 comprising program instructions executable by the processor 701 of the electronic device 700 to perform the loading method of the page view described above.
In another exemplary embodiment, a computer program product is also provided, which comprises a computer program executable by a programmable apparatus, the computer program having code portions for performing the loading method of page views described above when executed by the programmable apparatus.
The preferred embodiments of the present disclosure are described in detail with reference to the accompanying drawings, however, the present disclosure is not limited to the specific details of the above embodiments, and various simple modifications may be made to the technical solution of the present disclosure within the technical idea of the present disclosure, and these simple modifications all belong to the protection scope of the present disclosure.
It should be noted that, in the foregoing embodiments, various features described in the above embodiments may be combined in any suitable manner, and in order to avoid unnecessary repetition, various combinations that are possible in the present disclosure are not described again.
In addition, any combination of various embodiments of the present disclosure may be made, and the same should be considered as the disclosure of the present disclosure, as long as it does not depart from the spirit of the present disclosure.
Claims (10)
1. A method for loading a page view is characterized by comprising the following steps:
the method comprises the steps that a first page view of a target page is generated according to first page data, and the first page data are obtained after the first page view is displayed on a display screen of terminal equipment;
rendering according to the first page data to generate a cache page view;
according to the cache page view, cache data are obtained, and the cache data comprise: the cache image is an image displayed by the cache page view, and the cache interaction data is used for indicating interaction operation which can be executed by the cache page view;
responding to a trigger instruction aiming at the target page, displaying the cache image on the display screen, and acquiring second page data;
and executing the received interaction instruction according to the cache interaction data before generating a second page view of the target page according to the second page data.
2. The method of claim 1, wherein obtaining cache data according to the cache page view comprises:
screenshot is carried out on the cached page view so as to obtain the cached image;
and determining the cache interactive data according to the view tree corresponding to the cache page view.
3. The method of claim 2, wherein before the screenshot of the cached page view to obtain the cached image, obtaining cached data according to the cached page view further comprises:
and if the view tree has dynamic view elements, controlling the dynamic view elements to be displayed statically, wherein the dynamic view elements are dynamic images or videos.
4. The method of claim 2, wherein the view tree includes at least one view element, and wherein determining the cache interaction data according to the view tree corresponding to the cache page view comprises:
traversing the view tree to obtain attribute information of each view element, wherein the attribute information comprises: the location of the view element;
acquiring interactive view elements in the view tree, wherein the interactive view elements comprise interactive logic;
and taking the attribute information of the interactive view element as the cache interactive data.
5. The method of claim 4, wherein executing the received interaction instruction according to the cached interaction data comprises:
acquiring a first position of the interactive instruction on the cache image;
determining a target interactive view element corresponding to the first position in the cache interactive data, wherein the attribute information of the target interactive view element is matched with the first position;
and executing the interactive instruction according to the target interactive view element.
6. The method of claim 4, wherein the attribute information further comprises: the executing the received interactive instruction according to the cached interactive data includes:
acquiring a first position of the interactive instruction on the cache image;
determining a target interactive view element corresponding to the first position in the cache interactive data, wherein the position of the target interactive view element is matched with the first position, and the depth of the target interactive view element meets a preset condition;
and executing the interactive instruction according to the target interactive view element.
7. The method according to any one of claims 1-6, further comprising:
after the second page view is generated according to the second page data, the second page view is displayed on the display screen.
8. An apparatus for loading a page view, the apparatus comprising:
the acquisition module is configured to acquire first page data after generating a first page view of a target page according to the first page data and displaying the first page view on a display screen of a terminal device;
a rendering module configured to render according to the first page data to generate a cached page view;
the obtaining module is further configured to obtain cache data according to the cache page view, where the cache data includes: the cache image is an image displayed by the cache page view, and the cache interaction data is used for indicating interaction operation which can be executed by the cache page view;
the processing module is configured to respond to a trigger instruction aiming at the target page, display the cache image on the display screen and acquire second page data;
an execution module configured to execute the received interaction instruction according to the cached interaction data before generating a second page view of the target page according to the second page data.
9. A computer-readable storage medium, on which a computer program is stored which, when being executed by a processor, carries out the steps of the method according to any one of claims 1 to 7.
10. An electronic device, comprising:
a memory having a computer program stored thereon;
a processor for executing the computer program in the memory to carry out the steps of the method of any one of claims 1 to 7.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011071321.2A CN111930442B (en) | 2020-10-09 | 2020-10-09 | Page view loading method and device, storage medium and electronic equipment |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011071321.2A CN111930442B (en) | 2020-10-09 | 2020-10-09 | Page view loading method and device, storage medium and electronic equipment |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN111930442A true CN111930442A (en) | 2020-11-13 |
| CN111930442B CN111930442B (en) | 2021-01-01 |
Family
ID=73334340
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202011071321.2A Active CN111930442B (en) | 2020-10-09 | 2020-10-09 | Page view loading method and device, storage medium and electronic equipment |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111930442B (en) |
Cited By (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112905931A (en) * | 2021-01-25 | 2021-06-04 | 北京达佳互联信息技术有限公司 | Page information display method and device, electronic equipment and storage medium |
| CN113625909A (en) * | 2021-07-30 | 2021-11-09 | 北京达佳互联信息技术有限公司 | Application page display method and device, electronic equipment and storage medium |
| CN113672835A (en) * | 2021-07-13 | 2021-11-19 | 上海硬通网络科技有限公司 | Method, device and equipment for setting dynamic special effect of webpage and storage medium |
| CN114218052A (en) * | 2021-11-11 | 2022-03-22 | 深圳前海微众银行股份有限公司 | Service interaction graph generation method, device, equipment and storage medium |
| CN114860330A (en) * | 2022-03-31 | 2022-08-05 | 珠海豹趣科技有限公司 | Page loading method and device |
| CN115469959A (en) * | 2022-11-11 | 2022-12-13 | 成都摹客科技有限公司 | Page rendering method, rendering device and computer storage medium |
| CN116740235A (en) * | 2023-08-14 | 2023-09-12 | 福昕鲲鹏(北京)信息科技有限公司 | Text annotation rendering method and device based on format document |
Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106682171A (en) * | 2016-12-28 | 2017-05-17 | 北京奇艺世纪科技有限公司 | Caching method and device of webpage data |
| CN109684574A (en) * | 2018-08-20 | 2019-04-26 | 平安普惠企业管理有限公司 | Page loading method, device, equipment and storage medium |
| CN110765381A (en) * | 2019-10-10 | 2020-02-07 | 许昌许继软件技术有限公司 | Web publishing method and system of distribution network main station based on WebAssembly technology |
| WO2020034951A1 (en) * | 2018-08-15 | 2020-02-20 | 深圳点猫科技有限公司 | Front-end programming language-based method for optimizing image lazy-loading, and electronic apparatus |
| CN111258736A (en) * | 2020-01-17 | 2020-06-09 | 北京无限光场科技有限公司 | Information processing method and device and electronic equipment |
-
2020
- 2020-10-09 CN CN202011071321.2A patent/CN111930442B/en active Active
Patent Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106682171A (en) * | 2016-12-28 | 2017-05-17 | 北京奇艺世纪科技有限公司 | Caching method and device of webpage data |
| WO2020034951A1 (en) * | 2018-08-15 | 2020-02-20 | 深圳点猫科技有限公司 | Front-end programming language-based method for optimizing image lazy-loading, and electronic apparatus |
| CN109684574A (en) * | 2018-08-20 | 2019-04-26 | 平安普惠企业管理有限公司 | Page loading method, device, equipment and storage medium |
| CN110765381A (en) * | 2019-10-10 | 2020-02-07 | 许昌许继软件技术有限公司 | Web publishing method and system of distribution network main station based on WebAssembly technology |
| CN111258736A (en) * | 2020-01-17 | 2020-06-09 | 北京无限光场科技有限公司 | Information processing method and device and electronic equipment |
Non-Patent Citations (1)
| Title |
|---|
| AZENGQIANG的博客: "APP中缓存、加载与刷新机制设计", 《HTTPS://BLOG.CSDN.NET》 * |
Cited By (11)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112905931A (en) * | 2021-01-25 | 2021-06-04 | 北京达佳互联信息技术有限公司 | Page information display method and device, electronic equipment and storage medium |
| CN112905931B (en) * | 2021-01-25 | 2023-11-21 | 北京达佳互联信息技术有限公司 | Page information display method and device, electronic equipment and storage medium |
| CN113672835A (en) * | 2021-07-13 | 2021-11-19 | 上海硬通网络科技有限公司 | Method, device and equipment for setting dynamic special effect of webpage and storage medium |
| CN113672835B (en) * | 2021-07-13 | 2024-04-12 | 上海硬通网络科技有限公司 | Method, device, equipment and storage medium for setting dynamic special effects of web pages |
| CN113625909A (en) * | 2021-07-30 | 2021-11-09 | 北京达佳互联信息技术有限公司 | Application page display method and device, electronic equipment and storage medium |
| CN114218052A (en) * | 2021-11-11 | 2022-03-22 | 深圳前海微众银行股份有限公司 | Service interaction graph generation method, device, equipment and storage medium |
| CN114218052B (en) * | 2021-11-11 | 2023-08-29 | 深圳前海微众银行股份有限公司 | Service interaction diagram generation method, device, equipment and storage medium |
| CN114860330A (en) * | 2022-03-31 | 2022-08-05 | 珠海豹趣科技有限公司 | Page loading method and device |
| CN115469959A (en) * | 2022-11-11 | 2022-12-13 | 成都摹客科技有限公司 | Page rendering method, rendering device and computer storage medium |
| CN115469959B (en) * | 2022-11-11 | 2023-01-31 | 成都摹客科技有限公司 | Page rendering method, rendering device and computer storage medium |
| CN116740235A (en) * | 2023-08-14 | 2023-09-12 | 福昕鲲鹏(北京)信息科技有限公司 | Text annotation rendering method and device based on format document |
Also Published As
| Publication number | Publication date |
|---|---|
| CN111930442B (en) | 2021-01-01 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN111930442B (en) | Page view loading method and device, storage medium and electronic equipment | |
| AU2014235484B2 (en) | Contextual local image recognition dataset | |
| US9760777B2 (en) | Campaign optimization for experience content dataset | |
| AU2014235416B2 (en) | Real world analytics visualization | |
| CN110750664B (en) | Picture display method and device | |
| US20140267407A1 (en) | Segmentation of content delivery | |
| CN110471700B (en) | Graphic processing method, apparatus, storage medium and electronic device | |
| CN117576388A (en) | Image processing method and device, storage medium and electronic equipment | |
| CN109656995B (en) | Data export method, device, terminal, server and storage medium | |
| CN113625923A (en) | Mouse processing method and device based on remote cloud desktop, storage medium and equipment | |
| CN116342799A (en) | Graphic display method, graphic display device, electronic equipment and readable storage medium | |
| CN108491230A (en) | Cartoon display method and device, client | |
| US8615744B2 (en) | Methods and system for managing assets in programming code translation | |
| CN112116719B (en) | Method and device for determining object in three-dimensional scene, storage medium and electronic equipment | |
| CN108449625B (en) | Video screenshot method, device and terminal | |
| CN111159593A (en) | Method and device for generating flow chart, storage medium and electronic equipment | |
| CN116456131B (en) | Special effect rendering method and device, electronic equipment and storage medium | |
| CN115237317B (en) | Data display method and device, electronic equipment and storage medium | |
| CN114647804A (en) | Interface rendering method, device and equipment and readable storage medium | |
| CN107800618B (en) | Picture recommendation method and device, terminal and computer-readable storage medium | |
| CN117274431A (en) | Comment processing method and device, electronic equipment and storage medium | |
| CN117237508A (en) | Pixel texture value loading method, device, equipment and storage medium | |
| CN118710483A (en) | Optimization method and device for depth test | |
| CN113766326A (en) | Interface object prompting method and device, electronic equipment and readable storage medium | |
| CN114764329A (en) | UI (user interface) self-adaptive constraint solving method and related device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |