CN113835772A

CN113835772A - Method and device for loading image

Info

Publication number: CN113835772A
Application number: CN202011163929.8A
Authority: CN
Inventors: 宋小兵
Original assignee: Beijing Jingdong Century Trading Co Ltd; Beijing Wodong Tianjun Information Technology Co Ltd
Current assignee: Beijing Jingdong Century Trading Co Ltd; Beijing Wodong Tianjun Information Technology Co Ltd
Priority date: 2020-10-27
Filing date: 2020-10-27
Publication date: 2021-12-24

Abstract

The embodiment of the disclosure discloses a method and a device for loading images. One embodiment of the method comprises: monitoring whether the display position of the image to be loaded in the current page reaches a preset loading position or not by using a monitor corresponding to the image to be loaded; and loading the image to be loaded in response to the fact that the display position reaches the preset loading position. The embodiment realizes flexible control of the loading opportunity of the image to be loaded.

Description

Method and device for loading image

Technical Field

The embodiment of the disclosure relates to the technical field of computers, in particular to a method and a device for loading images.

Background

Many websites or applications, including applets and the like, in which there are often pages with too many images, so when loading these pages, if all the images in the pages are loaded at one time, the page loading speed is very slow, and for the user, it often happens that the pages are already opened, but the user needs to wait for the images in the pages to be loaded slowly for a long time, and the user experience is poor.

In order to accelerate page loading speed and improve user experience, currently, image loading of a page is generally performed by using a lazy loading or preloading mode and the like. The lazy loading generally refers to that images which do not appear in a visible area in a page are not loaded at first, and the images are loaded when the images appear in the visible area along with page rolling, so that the page loading speed is increased. Preloading generally means that when a page is opened, an image which is loaded completely in the current page is displayed to a user first, so as to improve user experience.

Disclosure of Invention

The embodiment of the disclosure provides a method and a device for loading an image.

In a first aspect, an embodiment of the present disclosure provides a method for loading an image, the method including: monitoring whether the display position of the image to be loaded in the current page reaches a preset loading position or not by using a monitor corresponding to the image to be loaded; and loading the image to be loaded in response to the fact that the display position reaches the preset loading position.

In some embodiments, after loading the image to be loaded in response to monitoring that the display position reaches the preset loading position, the method further includes: in response to determining that the loading of the image to be loaded is complete, acquiring the loaded image to be loaded, and displaying the image to be loaded at the display position.

In some embodiments, after loading the image to be loaded in response to monitoring that the display position reaches the preset loading position, the method further includes: in response to determining that the image to be loaded is not completely loaded, acquiring a first preset image for prompting that the image to be loaded is being loaded, and displaying the first preset image at a display position.

In some embodiments, after loading the image to be loaded in response to monitoring that the display position reaches the preset loading position, the method further includes: and in response to determining that the image to be loaded fails to be loaded, acquiring a second preset image for prompting the loading failure of the image to be loaded, and displaying the second preset image at the display position.

In some embodiments, displaying the image to be loaded at the display location comprises: and setting the visible image at the display position as the image to be loaded.

In some embodiments, the monitoring whether the display position of the image to be loaded in the current page reaches the preset loading position includes: determining whether a distance between the display position and a boundary of a visible region for displaying the page is not greater than a preset distance; in response to determining that the distance between the display position and the boundary of the visible area for displaying the page is not greater than the preset distance, determining that the display position reaches the preset load position.

In some embodiments, the boundaries of the viewable area include boundaries in a horizontal direction and/or boundaries in a vertical direction.

In some embodiments, the method further comprises: in response to receiving an update request for requesting an update of a preset distance, obtaining an update value indicated by the update request; the preset distance is updated to an updated value.

In some embodiments, the method further comprises: and in response to receiving a display request for requesting to display the page, creating a listener corresponding to each image to be loaded in the page where the image to be loaded is located.

In a second aspect, an embodiment of the present disclosure provides an apparatus for loading an image, the apparatus including: the monitoring unit is configured to monitor whether the display position of the image to be loaded in the current page reaches a preset loading position or not by using a monitor corresponding to the image to be loaded; and the loading unit is configured to load the image to be loaded in response to the fact that the display position reaches the preset loading position.

In some embodiments, the apparatus further comprises: a display unit configured to acquire the loaded image to be loaded and display the loaded image at a display position in response to determining that the loading of the image to be loaded is completed.

In some embodiments, the display unit is further configured to: in response to determining that the image to be loaded is not completely loaded, acquiring a first preset image for prompting that the image to be loaded is being loaded, and displaying the first preset image at a display position.

In some embodiments, the display unit is further configured to: and in response to determining that the image to be loaded fails to be loaded, acquiring a second preset image for prompting the loading failure of the image to be loaded, and displaying the second preset image at the display position.

In some embodiments, the display unit is further configured to: and setting the visible image at the display position as the image to be loaded.

In some embodiments, the listening unit is further configured to: determining whether a distance between the display position and a boundary of a visible region for displaying the page is not greater than a preset distance; in response to determining that the distance between the display position and the boundary of the visible area for displaying the page is not greater than the preset distance, determining that the display position reaches the preset load position.

In some embodiments, the apparatus further comprises: an update unit configured to: in response to receiving an update request for requesting an update of a preset distance, obtaining an update value indicated by the update request; the preset distance is updated to an updated value.

In some embodiments, the apparatus further comprises: a creation unit configured to: and in response to receiving a display request for requesting to display the page, creating a listener corresponding to each image to be loaded in the page where the image to be loaded is located.

In a third aspect, an embodiment of the present disclosure provides an electronic device, including: one or more processors; storage means for storing one or more programs; when the one or more programs are executed by the one or more processors, the one or more processors are caused to implement the method as described in any implementation of the first aspect.

In a fourth aspect, embodiments of the present disclosure provide a computer-readable medium on which a computer program is stored, which computer program, when executed by a processor, implements the method as described in any of the implementations of the first aspect.

According to the method and the device for loading the image, the monitor corresponding to the image to be loaded in the page monitors the display position of the image to be loaded in the page to determine whether the display position of the image to be loaded reaches the preset loading position, and the image is loaded when the display position of the image to be loaded reaches the preset loading position, so that the display position of the image to be loaded can be timely loaded when the display position of the image to be loaded reaches the preset loading position, and the loading opportunity of the image to be loaded is accurately controlled.

Drawings

Other features, objects and advantages of the disclosure will become more apparent upon reading of the following detailed description of non-limiting embodiments thereof, made with reference to the accompanying drawings in which:

FIG. 1 is an exemplary system architecture diagram in which one embodiment of the present disclosure may be applied;

FIG. 2 is a flow diagram for one embodiment of a method for loading images, according to the present disclosure;

FIG. 3 is a schematic illustration of one application scenario of a method for loading an image according to an embodiment of the present disclosure;

FIG. 4 is a flow diagram of yet another embodiment of a method for loading an image according to the present disclosure;

FIG. 5 is a schematic block diagram illustrating one embodiment of an apparatus for loading images according to the present disclosure;

FIG. 6 is a schematic structural diagram of an electronic device suitable for use in implementing embodiments of the present disclosure.

Detailed Description

The present disclosure is described in further detail below with reference to the accompanying drawings and examples. It is to be understood that the specific embodiments described herein are merely illustrative of the relevant invention and not restrictive of the invention. It should be noted that, for convenience of description, only the portions related to the related invention are shown in the drawings.

It should be noted that, in the present disclosure, the embodiments and features of the embodiments may be combined with each other without conflict. The present disclosure will be described in detail below with reference to the accompanying drawings in conjunction with embodiments.

Fig. 1 illustrates an exemplary architecture 100 to which embodiments of the disclosed method for loading images or apparatus for loading images may be applied.

As shown in fig. 1, the system architecture 100 may include

terminal devices

101, 102, 103, a network 104, and a server 105. The network 104 serves as a medium for providing communication links between the

terminal devices

101, 102, 103 and the server 105. Network 104 may include various connection types, such as wired, wireless communication links, or fiber optic cables, to name a few.

The

terminal devices

101, 102, 103 interact with a server 105 via a network 104 to receive or send messages or the like. Various client applications may be installed on the

terminal devices

101, 102, 103. Such as web browser-like applications, search-like applications, shopping-like applications, instant messaging tools, social platform software, information flow-like applications, and the like.

The

terminal apparatuses

101, 102, and 103 may be hardware or software. When the

terminal devices

101, 102, 103 are hardware, they may be various electronic devices including, but not limited to, smart phones, tablet computers, e-book readers, laptop portable computers, desktop computers, and the like. When the

terminal apparatuses

101, 102, 103 are software, they can be installed in the electronic apparatuses listed above. It may be implemented as multiple pieces of software or software modules (e.g., multiple pieces of software or software modules to provide distributed services) or as a single piece of software or software module. And is not particularly limited herein.

The server 105 may be a server that provides various services, such as a backend server that provides support for client applications installed on the

terminal devices

101, 102, 103. The server 105 may return the resource corresponding to the request to the

terminal device

101, 102, 103 according to the request sent by the client application installed on the

terminal device

101, 102, 103. After loading the resource returned by the server 105 to the local, the

terminal devices

101, 102, 103 may display the loaded resource.

It should be noted that the method for loading the image provided by the embodiment of the present disclosure is generally executed by the

terminal devices

101, 102, 103, and accordingly, the apparatus for loading the image is generally disposed in the

terminal devices

101, 102, 103.

It should also be noted that the server 105 may also load and display the loaded image. At this time, the method for loading the image may also be executed by the server 105, and accordingly, the apparatus for loading the image may also be provided in the server 105.

The server 105 may be hardware or software. When the server 105 is hardware, it may be implemented as a distributed server cluster composed of a plurality of servers, or may be implemented as a single server. When the server 105 is software, it may be implemented as multiple pieces of software or software modules (e.g., multiple pieces of software or software modules used to provide distributed services), or as a single piece of software or software module. And is not particularly limited herein.

It should be understood that the number of terminal devices, networks, and servers in fig. 1 is merely illustrative. There may be any number of terminal devices, networks, and servers, as desired for implementation.

With continued reference to FIG. 2, a flow 200 of one embodiment of a method for loading an image according to the present disclosure is shown. The method for loading the image comprises the following steps:

step 201, monitoring whether the display position of the image to be loaded in the current page reaches a preset loading position by using a monitor corresponding to the image to be loaded.

In the present embodiment, the images may be images of various formats and various contents. The image to be loaded may be any image. Generally, an image to be loaded is displayed through a page by taking the page as a carrier. The page may be various pages displayable by an execution subject (such as the terminal device shown in fig. 1). For example, the page may be an applet page (e.g., H5 page, etc.). The current page may refer to a page currently requested by the user.

When the execution main body displays the page, there may be a case that the visible region can only display partial content of the page, but cannot display the complete content of the page. Wherein the visible region may refer to a region in which the displayed content is visible to the user. For example, the visible region may be a region constituted by the display screen of the execution main body described above. In these cases, the content of the portions of the page may be displayed in the visible region by page scrolling. For example, a user may browse all content in a page by sliding the page.

The display position of the image to be loaded in the current page may refer to a position of an area for displaying the image to be loaded in the current page. The preset loading position may be a position for instructing to start loading the image. The preset loading position can be preset by a technician according to actual application requirements or application scenes, and can also be preset according to user requirements. Generally, the preset loading position may be set according to the above-described visible region. For example, the preset loading position may be a position of the visible region. For another example, assuming that the height of the visible region is H, the preset loading position may be a position having a distance of 3H from the visible region.

The listener may be used to listen for preset operations to determine whether a specified event is triggered. The monitor corresponding to the image to be loaded may be configured to monitor a display position of the image to be loaded in the current page, and determine whether the display position of the image to be loaded in the current page reaches a preset loading position.

Specifically, the listener can flexibly determine whether the display position of the image to be loaded in the current page reaches the preset loading position by adopting various methods. For example, the monitor may determine a current page scrolling speed according to an operation of a user sliding a page, and determine a change of a display position of the image to be loaded in the current page according to the current page scrolling speed, so as to determine whether the display position of the image to be loaded in the current page reaches a preset loading position.

And 202, loading the image to be loaded in response to the fact that the display position reaches the preset loading position.

In this embodiment, if the display position of the image to be loaded in the current page reaches the preset loading position, the execution main body may start loading the image to be loaded, so as to store the image to be loaded locally. For example, the execution subject may load an image to be loaded from a server.

In some optional implementations of the embodiment, in response to determining that the loading of the image to be loaded is complete, the loaded image to be loaded is acquired, and the image to be loaded is displayed at the display position.

If the image to be loaded is loaded completely, it may indicate that the image to be loaded is stored in the local of the execution main body, and at this time, the execution main body may directly obtain the image to be loaded from the local, and display the image to be loaded at the display position of the image to be loaded in the current page.

Specifically, the image to be loaded may be displayed at the display position of the image to be loaded in the current page using various methods according to different application scenarios, such as different adopted programming languages, and the like. For example, the address (such as src attribute) of the image to be displayed at the display position of the image to be loaded in the current page may be set as the storage address of the image to be loaded after the loading is completed.

Alternatively, the visible image of the image to be loaded at the display position in the current page may be set as the image to be loaded. Namely, the image to be loaded is associated with the display position of the image to be loaded in the current page in advance, and the image to be loaded is set to be invisible. After the image to be loaded is loaded, the image to be loaded is set to be visible, so that the image to be loaded is displayed in time.

In some optional implementation manners of this embodiment, a listener corresponding to the image to be loaded may monitor whether a display position of the image to be loaded in the current page reaches the preset loading position in the following manner:

firstly, whether the distance between the display position of the image to be loaded in the current page and the boundary of the visible area for displaying the page is not more than a preset distance is determined. In response to determining that the distance between the display position of the image to be loaded in the current page and the boundary of the visible region is not greater than the preset distance, it may be determined that the display position of the image to be loaded in the current page reaches the preset loading position.

Wherein the visible region for displaying the page may refer to a region in which the appearing page content is visible to the user. The boundary of the visible region may refer to a boundary between the visible region and the invisible region. Taking the visible region as an example of a region formed by the display screen of the execution subject, in this case, the visible region is generally rectangular, and therefore the boundary of the visible region includes four sides of the rectangle.

The distance between the display position of the image to be loaded in the current page and the boundary of the visible region may refer to a distance between the display position of the image to be loaded in the current page and a specified boundary of the visible region. Wherein the designated boundary of the visible region can be preset by a technician according to an actual application scenario.

Alternatively, the boundaries of the visible region may include boundaries in a horizontal direction and/or boundaries in a vertical direction. In an actual application scenario, if the page scrolling direction is a vertical direction, it may be determined whether a distance between a display position of the image to be loaded in the current page and a boundary in a horizontal direction of the visible area is not greater than a preset distance.

If the page scrolling direction is the horizontal direction, it may be determined whether a distance between a display position of the image to be loaded in the current page and a boundary in the vertical direction of the visible region is greater than a preset distance. If the page scrolling direction includes a horizontal direction and a vertical direction, it may be determined whether a distance between a display position of the image to be loaded in the current page and a boundary of the visible area in the horizontal direction and a boundary of the visible area in the vertical direction is greater than a preset distance, respectively.

Therefore, the scene that the page is scrolled in the vertical direction for lazy loading in the prior art can be realized, and the scene that the page is scrolled in the horizontal direction for lazy loading can also be realized.

The preset distance may be preset by a technician according to an actual application scenario or a received user requirement. Generally, when the distance between the display position of the image to be loaded in the current page and the boundary of the visible region is a preset distance, the display position of the image to be loaded in the current page may belong to the invisible region, so as to ensure that the image to be loaded may be loaded in advance for a certain time before the display position of the image to be loaded in the current page enters the visible region, and thus the loaded image to be loaded may be directly displayed after the display position of the image to be loaded in the current page enters the visible region.

Alternatively, in response to receiving an update request for requesting an update of the preset distance, the update value indicated by the update request may be obtained, and the preset distance may be updated to the update value.

Specifically, the execution main body may receive an update request sent by a user, and modify the preset distance according to an update value indicated by the update request, so as to implement user-defined control on the image loading opportunity.

In the prior art, the height of the visible area is generally taken as a basic unit, and the loading of the image is started within a fixed distance of detecting that the image is about to enter the visible area, wherein the fixed distance is generally integral multiple of the height of the visible area. Therefore, the time for starting loading the image cannot be customized, and the finally undisplayed image is easily loaded, so that the flow of the user is wasted. The embodiment of the disclosure can flexibly adjust the preset distance according to the user requirement or the actual application scene (such as the change of the network speed, the size of the image and the like), thereby realizing the flexible control of the image loading opportunity, being beneficial to saving the user flow and also improving the image loading speed.

In some optional implementation manners of this embodiment, in response to receiving a display request for requesting display of a page where an image to be loaded is located, a listener corresponding to each image to be loaded in the page is created.

Specifically, when receiving a request sent by a user to display a specified page, the execution main body may respectively create corresponding listeners for each image in the page, so as to respectively perform monitoring control on the loading timing of each image.

Optionally, in response to receiving a display request for requesting to display a page where the image to be loaded is located, the execution main body may first determine whether the image to be loaded on the page is completely loaded. If the loading is not finished, the listener corresponding to the image to be loaded can be created.

As an example, a load identification may be set in advance for each image for identifying whether the image has completed loading. At this time, whether the image to be loaded is determined by checking the identifier corresponding to the image to be loaded.

In some cases, the partial image in the page currently requested by the user may be stored locally in the execution subject, and at this time, by first determining whether each image in the page has been loaded, a corresponding listener may be created only for the image that has not been loaded so as to facilitate subsequent image loading processing, and a corresponding listener does not need to be created for the image that has been loaded, so that resources may be saved, and the page loading speed may be increased.

Optionally, before creating a corresponding listener for an unloaded image in a page, it may be determined whether a listener corresponding to the image currently exists. If not, a listener corresponding to the image can be created. If the image exists, the monitor corresponding to the image does not need to be repeatedly created, so that resource waste is avoided.

Optionally, after it is determined that the image to be loaded is successfully loaded, the listener corresponding to the image to be loaded may be destroyed, so as to recycle the useless resources in time.

With continued reference to fig. 3, fig. 3 is an illustrative application scenario 300 of the method for loading an image according to the present embodiment. In the application scenario of fig. 3, a terminal device 301 that a user can use can send a page request for instructing to open an applet page to a server 302, and the server 302 can return a page resource for displaying the applet page to the terminal device according to the request.

The applet page includes text a and image B. The terminal device 301, while sending a page request to the server 302 for instructing opening of the applet page, may create a listener corresponding to image B for listening to the distance d between the position of image B in the applet page and the visible area of the terminal device 301. Specifically, as shown by reference numeral 303, in the process that the user slides the page through the sliding operation, when the listener detects that the distance d between the position of the image B in the applet page and the visible area of the terminal device 301 is not greater than the preset distance, the listener sends a loading request for loading the image B to the server 302, so as to obtain the image B from the server 302 and store the image B in the local area of the terminal device 301. At this time, when the position of the image B in the applet page enters the visible region as the page is scrolled, the terminal device 301 may directly acquire the image B from the local for display.

The method provided by the embodiment of the disclosure establishes a listener for each image to be loaded in the page, and monitors the change of the display position of each image to be loaded in the page to determine whether the display position of each image to be loaded in the page reaches the preset loading position, and starts to load the image to be loaded when the display position of each image to be loaded in the page reaches the preset loading position, so as to control the loading time of each image to be loaded in the page, which is beneficial to saving user traffic and increasing the page loading speed.

With further reference to FIG. 4, a flow 400 of yet another embodiment of a method for loading an image is shown. The flow 400 of the method for loading an image comprises the following steps:

step 401, monitoring whether the display position of the image to be loaded in the current page reaches a preset loading position by using a monitor corresponding to the image to be loaded.

And 402, loading the image to be loaded in response to the fact that the display position reaches the preset loading position.

Step 403, determining whether the image to be loaded is loaded completely and determining whether the image to be loaded fails to be loaded, in response to determining that the image to be loaded is not loaded completely, executing step 404 as follows, in response to determining that the image to be loaded is loaded completely, executing step 405 as follows, and in response to determining that the image to be loaded fails to be loaded, executing step 406 as follows.

In this embodiment, since the image to be loaded usually needs a certain time to be loaded, and there are also situations such as loading failure of the image to be loaded due to network fluctuation and the like, after the image to be loaded starts to be loaded, whether the image to be loaded is loaded completely and whether the image to be loaded fails to be loaded can be determined in real time.

Specifically, various methods may be adopted according to the actual application scenario to determine whether the loading of the image to be loaded is completed, and determine whether the loading of the image to be loaded fails. For example, when the execution main body loads the image to be loaded to the specified storage address from the server, whether the image to be loaded is loaded completely or not can be determined by detecting whether the image to be loaded which is loaded completely exists in the specified storage address in real time, and whether the image to be loaded fails to be loaded or not can be determined.

If the image to be loaded is present in the specified storage address, it may indicate whether the image to be loaded is loaded completely. If the image to be loaded does not exist in the specified storage address within the preset time, it may be indicated that the image to be loaded is not yet loaded. If the image to be loaded does not exist in the specified storage address after the preset time, it can be indicated whether the image to be loaded fails to be loaded.

Step 404, acquiring a first preset image for prompting that the image to be loaded is being loaded, and displaying the first preset image at the display position of the image to be loaded in the current page.

In this embodiment, the first preset image may be preset by a technician. If the image to be loaded is still in the loading process, the address of the image to be displayed at the display position of the image to be loaded in the current page can be set as the storage address of the first preset image, and meanwhile, the first preset image is set to be visible and the image to be loaded is set to be invisible.

The first preset image can be stored in the local of the execution main body, so that the first preset image can be rapidly read for display in the loading process of the image to be loaded, and the situation that a user can only see that the display content of the image to be loaded at the display position in the current page is blank in the loading process of the image to be loaded is avoided.

Step 405, acquiring the loaded image to be loaded, and displaying the image to be loaded at the display position of the image to be loaded in the current page.

And step 406, acquiring a second preset image for prompting that the image to be loaded fails to be loaded, and displaying the second preset image at the display position of the image to be loaded in the current page.

In this embodiment, the second preset image may be preset by a technician. If the loading of the image to be loaded fails, the address of the image to be displayed at the display position of the image to be loaded in the current page can be set as the storage address of the second preset image, and meanwhile, the second preset image is set to be visible and the image to be loaded is set to be invisible.

The second preset image can be stored in the local of the execution main body, so that the second preset image can be rapidly read for display when the loading of the image to be loaded fails, and the situation that a user can only see that the display content of the image to be loaded at the display position in the current page is blank when the loading of the image to be loaded fails is avoided.

Optionally, in response to determining that the image to be loaded fails to be loaded, it may be determined whether the number of times of loading failure of the image to be loaded exceeds a preset threshold, and if the number of times of loading failure of the image to be loaded exceeds the preset threshold, the listener corresponding to the image to be loaded may be destroyed, and the user is prompted that the image to be loaded fails to be loaded. If the image loading time does not exceed the preset threshold, the image to be loaded can be tried to be loaded again, and the stability of the image loading of the page is improved.

The content that is not specifically described in the above step may refer to the related description of the step in the corresponding embodiment of fig. 2, and is not repeated herein.

In some optional implementations of this embodiment, each image in the page may be defined as a component (components), and the dynamic configuration of the user for the image (such as the preset distance, the storage address of the first preset image, the storage address of the second preset image, the storage address of the image visible at the position, etc.) is recorded by using the property (properties) of the component.

The method provided by the embodiment of the disclosure can display the local first preset image at the display position of the image to be loaded in the page in the loading process of the image to be loaded, and then display the image to be loaded when the image to be loaded is successfully loaded, and in addition, display the local second preset image at the display position of the image to be loaded in the page when the image to be loaded is unsuccessfully loaded, so that the content is displayed at the display position of the page in the whole loading process of the image to be loaded, and in different stages of loading, the different display contents can be seamlessly switched, and for a user, the method is favorable for improving the user experience.

With further reference to fig. 5, as an implementation of the methods shown in the above figures, the present disclosure provides an embodiment of an apparatus for loading an image, which corresponds to the method embodiment shown in fig. 2, and which is particularly applicable in various electronic devices.

As shown in fig. 5, the apparatus 500 for loading an image provided by the present embodiment includes a listening unit 501 and a loading unit 502. The monitoring unit is configured to monitor whether the display position of the image to be loaded in the current page reaches a preset loading position or not by using a monitor corresponding to the image to be loaded; and the loading unit is configured to load the image to be loaded in response to the fact that the display position reaches the preset loading position.

In the present embodiment, in the apparatus 500 for loading an image: the specific processing of the snooping unit 501 and the loading unit 502 and the technical effects thereof can refer to the related descriptions of step 201 and step 202 in the corresponding embodiment of fig. 2, which are not described herein again.

In some optional implementations of the present embodiment, the apparatus 500 for loading an image further includes: the display unit (not shown in the figure) is configured to acquire the loaded image to be loaded and display the image to be loaded at the display position in response to determining that the loading of the image to be loaded is completed.

In some optional implementations of this embodiment, the display unit is further configured to: in response to determining that the image to be loaded is not completely loaded, acquiring a first preset image for prompting that the image to be loaded is being loaded, and displaying the first preset image at a display position.

In some optional implementations of this embodiment, the display unit is further configured to: and in response to determining that the image to be loaded fails to be loaded, acquiring a second preset image for prompting the loading failure of the image to be loaded, and displaying the second preset image at the display position.

In some optional implementations of this embodiment, the display unit is further configured to: and setting the visible image at the display position as the image to be loaded.

In some optional implementations of this embodiment, the monitoring unit 501 is further configured to: determining whether a distance between the display position and a boundary of a visible region for displaying the page is not greater than a preset distance; in response to determining that the distance between the display position and the boundary of the visible area for displaying the page is not greater than the preset distance, determining that the display position reaches the preset load position.

In some optional implementations of the present embodiment, the boundary of the visible region includes a boundary in a horizontal direction and/or a boundary in a vertical direction.

In some optional implementations of the present embodiment, the apparatus 500 for loading an image further includes: the update unit (not shown in the figure) is configured to: in response to receiving an update request for requesting an update of a preset distance, obtaining an update value indicated by the update request; the preset distance is updated to an updated value.

In some optional implementations of the present embodiment, the apparatus 500 for loading an image further includes: the creation unit (not shown in the figure) is configured to: and in response to receiving a display request for requesting to display the page, creating a listener corresponding to each image to be loaded in the page where the image to be loaded is located.

The device provided by the above embodiment of the present disclosure monitors whether the display position of the image to be loaded in the current page reaches the preset loading position by using the monitor corresponding to the image to be loaded through the monitoring unit; and the loading unit loads the image to be loaded in response to the fact that the display position reaches the preset loading position. Therefore, the display position of the image to be loaded can be guaranteed to be timely loaded when reaching the preset loading position, and the loading time of the image to be loaded is accurately controlled.

Referring now to fig. 6, shown is a schematic diagram of an electronic device (e.g., terminal device in fig. 1) 600 suitable for use in implementing embodiments of the present disclosure. The terminal device in the embodiments of the present disclosure may include, but is not limited to, a mobile terminal such as a mobile phone, a notebook computer, a digital broadcast receiver, a PDA (personal digital assistant), a PAD (tablet computer), a PMP (portable multimedia player), a vehicle terminal (e.g., a car navigation terminal), and the like, and a fixed terminal such as a digital TV, a desktop computer, and the like. The terminal device shown in fig. 6 is only an example, and should not bring any limitation to the functions and the use range of the embodiments of the present disclosure.

As shown in fig. 6, electronic device 600 may include a processing means (e.g., central processing unit, graphics processor, etc.) 601 that may perform various appropriate actions and processes in accordance with a program stored in a Read Only Memory (ROM)602 or a program loaded from a storage means 608 into a Random Access Memory (RAM) 603. In the RAM 603, various programs and data necessary for the operation of the electronic apparatus 600 are also stored. The processing device 601, the ROM 602, and the RAM 603 are connected to each other via a bus 604. An input/output (I/O) interface 605 is also connected to bus 604.

Generally, the following devices may be connected to the I/O interface 605: input devices 606 including, for example, a touch screen, touch pad, keyboard, mouse, camera, microphone, accelerometer, gyroscope, etc.; output devices 607 including, for example, a Liquid Crystal Display (LCD), a speaker, a vibrator, and the like; storage 608 including, for example, tape, hard disk, etc.; and a communication device 609. The communication means 609 may allow the electronic device 600 to communicate with other devices wirelessly or by wire to exchange data. While fig. 6 illustrates an electronic device 600 having various means, it is to be understood that not all illustrated means are required to be implemented or provided. More or fewer devices may alternatively be implemented or provided. Each block shown in fig. 6 may represent one device or may represent multiple devices as desired.

In particular, according to an embodiment of the present disclosure, the processes described above with reference to the flowcharts may be implemented as computer software programs. For example, embodiments of the present disclosure include a computer program product comprising a computer program embodied on a computer readable medium, the computer program comprising program code for performing the method illustrated in the flow chart. In such an embodiment, the computer program may be downloaded and installed from a network via the communication means 609, or may be installed from the storage means 608, or may be installed from the ROM 602. The computer program, when executed by the processing device 601, performs the above-described functions defined in the methods of embodiments of the present disclosure.

It should be noted that the computer readable medium described in the embodiments of the present disclosure may be a computer readable signal medium or a computer readable storage medium or any combination of the two. A computer readable storage medium may be, for example, but not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination of the foregoing. More specific examples of the computer readable storage medium may include, but are not limited to: an electrical connection having one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing. In embodiments of the disclosure, a computer readable storage medium may be any tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device. In embodiments of the present disclosure, however, a computer readable signal medium may comprise a propagated data signal with computer readable program code embodied therein, for example, in baseband or as part of a carrier wave. Such a propagated data signal may take many forms, including, but not limited to, electro-magnetic, optical, or any suitable combination thereof. A computer readable signal medium may also be any computer readable medium that is not a computer readable storage medium and that can communicate, propagate, or transport a program for use by or in connection with an instruction execution system, apparatus, or device. Program code embodied on a computer readable medium may be transmitted using any appropriate medium, including but not limited to: electrical wires, optical cables, RF (radio frequency), etc., or any suitable combination of the foregoing.

The computer readable medium may be embodied in the terminal; or may exist separately and not be assembled into the terminal. The computer readable medium carries one or more programs which, when executed by the terminal, cause the terminal to: monitoring whether the display position of the image to be loaded in the current page reaches a preset loading position or not by using a monitor corresponding to the image to be loaded; and loading the image to be loaded in response to the fact that the display position reaches the preset loading position.

Computer program code for carrying out operations for embodiments of the present disclosure may be written in any combination of one or more programming languages, including an object oriented programming language such as Java, Smalltalk, C + +, and conventional procedural programming languages, such as the "C" programming language or similar programming languages. The program code may execute entirely on the user's computer, partly on the user's computer, as a stand-alone software package, partly on the user's computer and partly on a remote computer or entirely on the remote computer or server. In the case of a remote computer, the remote computer may be connected to the user's computer through any type of network, including a Local Area Network (LAN) or a Wide Area Network (WAN), or the connection may be made to an external computer (for example, through the Internet using an Internet service provider).

The flowchart and block diagrams in the figures 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 the flowchart or block diagrams may represent a module, segment, or portion of code, which comprises one or more executable instructions for implementing the specified logical function(s). It should also be noted that, in some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams and/or flowchart illustration, and combinations of blocks in the block diagrams and/or flowchart illustration, can be implemented by special purpose hardware-based systems which perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.

The units described in the embodiments of the present disclosure may be implemented by software or hardware. The described units may also be provided in a processor, and may be described as: a processor includes a snoop unit and a load unit. The names of the units do not form a limitation on the units themselves in some cases, for example, the monitoring unit may also be described as a "unit that monitors whether the display position of the image to be loaded in the current page reaches the preset loading position by using the corresponding monitor of the image to be loaded".

The foregoing description is only exemplary of the preferred embodiments of the disclosure and is illustrative of the principles of the technology employed. It will be appreciated by those skilled in the art that the scope of the invention in the embodiments of the present disclosure is not limited to the specific combination of the above-mentioned features, but also encompasses other embodiments in which any combination of the above-mentioned features or their equivalents is made without departing from the inventive concept as defined above. For example, the above features and (but not limited to) technical features with similar functions disclosed in the embodiments of the present disclosure are mutually replaced to form the technical solution.

Claims

1. A method for loading an image, comprising:

monitoring whether the display position of the image to be loaded in the current page reaches a preset loading position or not by using a monitor corresponding to the image to be loaded;

and loading the image to be loaded in response to the fact that the display position reaches a preset loading position.

2. The method of claim 1, wherein after loading the image to be loaded in response to listening that the display position reaches a preset loading position, the method further comprises:

in response to determining that the image to be loaded is loaded;

and acquiring the loaded image to be loaded, and displaying the image to be loaded at the display position.

3. The method of claim 1, wherein after loading the image to be loaded in response to listening that the display position reaches a preset loading position, the method further comprises:

and in response to determining that the image to be loaded is not completely loaded, acquiring a first preset image for prompting that the image to be loaded is being loaded, and displaying the first preset image at the display position.

4. The method of claim 1, wherein after loading the image to be loaded in response to listening that the display position reaches a preset loading position, the method further comprises:

and responding to the situation that the image to be loaded fails to be loaded, acquiring a second preset image for prompting the loading failure of the image to be loaded, and displaying the second preset image at the display position.

5. The method of claim 2, wherein said displaying the image to be loaded at the display location comprises:

and setting the visible image at the display position as the image to be loaded.

6. The method according to one of claims 1 to 5, wherein the monitoring whether the display position of the image to be loaded in the current page reaches a preset loading position comprises:

determining whether a distance between the display position and a boundary of a visible region for displaying the page is not greater than a preset distance;

in response to determining that the distance between the display position and the boundary of the visible region for displaying the page is not greater than a preset distance, determining that the display position reaches a preset load position.

7. The method of claim 6, wherein the boundaries of the viewable area include boundaries in a horizontal direction and/or boundaries in a vertical direction.

8. The method of claim 6, wherein the method further comprises:

in response to receiving an update request for requesting to update the preset distance, acquiring an update value indicated by the update request;

and updating the preset distance to be the updated value.

9. The method according to one of claims 1-5, wherein the method further comprises:

and in response to receiving a display request for requesting to display the page, creating a monitor corresponding to each image to be loaded in the page.

10. An apparatus for loading an image, wherein the apparatus comprises:

the monitoring unit is configured to monitor whether the display position of the image to be loaded in the current page reaches a preset loading position or not by using a monitor corresponding to the image to be loaded;

the loading unit is configured to respond to the condition that the display position reaches the preset loading position, and load the image to be loaded.

11. A terminal, comprising:

one or more processors;

a storage device having one or more programs stored thereon;

when executed by the one or more processors, cause the one or more processors to implement the method of any one of claims 1-9.

12. A computer-readable medium, on which a computer program is stored which, when being executed by a processor, carries out the method according to any one of claims 1-9.