Image loading method, device and storage medium

By determining the target reference aspect ratio and pixels on the terminal side and obtaining the lightweight image, the problem of high bandwidth consumption when the terminal loads the image is solved, and a faster loading speed is achieved.

CN114817780BActive Publication Date: 2025-08-12TENCENT TECHNOLOGY (SHENZHEN) CO LTD
View PDF 1 Cites 0 Cited by

Patent Information

Application Number
CN202110121723.7
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2021-01-28
Publication Date
2025-08-12
Estimated Expiration
2041-01-28

AI Technical Summary

Technical Problem

When the terminal loads pictures from the server, the large amount of data leads to a large amount of bandwidth resources, and the loading speed is too slow.

Method used

According to the display size of the screen pixels and the picture display area of the terminal, the target reference aspect ratio and the target reference pixel are determined, and the lightweighted target image is obtained from the various candidate images stored by the server, and loaded into the page.

Benefits of technology

Reduces bandwidth resource consumption required for image loading and improves loading speed.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN114817780B_ABST
    Figure CN114817780B_ABST
Patent Text Reader

Abstract

The present application relates to the field of image display processing technology, and provides an image loading method, device and storage medium. In this method, the terminal determines the source image to be loaded in the page of the application; obtains the display size of the image display area in the page; obtains the screen pixels of the terminal running the application; based on the screen pixels and display size, determines the target reference aspect ratio and target reference pixels suitable for the loaded source image from the configured multiple reference aspect ratios and multiple reference pixels; obtains the target image with the target reference aspect ratio and target reference pixels from the multiple candidate images corresponding to the source image stored on the server, wherein the multiple candidate images are multiple different images obtained by the server performing lightweight processing on the source image based on the multiple reference aspect ratios and multiple reference pixels; and loads the target image on the page. The solution of the present application can improve the speed of loading images at the terminal and reduce the consumption of bandwidth resources.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the technical field of image display processing, and in particular to an image loading method, device and storage medium. Background Art

[0002] With the development of Internet technology, terminals often need to obtain images from the server and display the images returned by the server on the terminal side. For example, the terminal side requests an image from the server through a browser and loads the image.

[0003] However, if the amount of data of the picture requested by the terminal from the server is large, it will consume more bandwidth resources on the terminal side and will also cause the speed of loading the picture on the terminal side to be too slow. Summary of the Invention

[0004] In view of this, the present application provides a method, device and storage medium for loading pictures to increase the speed at which a terminal loads pictures and reduce the bandwidth resources consumed by the terminal to obtain pictures.

[0005] To achieve the above objectives, this application provides the following technical solutions:

[0006] On the one hand, the present application provides a method for loading an image, comprising:

[0007] Determine the source image to be loaded in the application page;

[0008] Obtaining a display size of a picture display area on the page for displaying the source picture, wherein the display size is at least used to represent an aspect ratio of the picture display area;

[0009] Obtaining screen pixels of a terminal running the application;

[0010] Based on the screen pixels and the display size, determining a target reference aspect ratio and target reference pixels suitable for loading the source image from a plurality of configured reference aspect ratios and a plurality of reference pixels;

[0011] Obtaining a target picture having the target reference aspect ratio and target reference pixels from multiple candidate pictures corresponding to the source picture stored on the server, wherein the multiple candidate pictures are multiple different pictures obtained by the server performing lightweight processing on the source picture according to the multiple reference aspect ratios and the multiple reference pixels, and the data size of the pictures obtained by the lightweight processing is smaller than the data size of the source picture;

[0012] The target image is loaded in the image display area of the page.

[0013] In a possible implementation, determining the source image to be loaded in the application page includes:

[0014] Determine the image address of the source image to be loaded in the application page;

[0015] Obtaining a target picture having the target reference aspect ratio and target reference pixels from a plurality of candidate pictures corresponding to the source picture stored in the server includes:

[0016] Adding information of the target reference aspect ratio and the target reference pixels to the picture address to obtain a reconstructed picture address, wherein the reconstructed picture address is used to point to a target picture having the target reference aspect ratio and the target reference pixels among the multiple candidate pictures corresponding to the source picture;

[0017] Sending the reconstructed picture address to the server, so that the server locates the target picture based on the reconstructed picture address;

[0018] Obtain the target picture returned by the server based on the reconstructed picture address.

[0019] In another possible implementation, the display size further includes: aspect ratio of the image display area and screen ratio information of the image display area;

[0020] The determining, based on the screen pixels and the display size, a target reference aspect ratio and target reference pixels suitable for loading the source image from a plurality of configured reference aspect ratios and a plurality of reference pixels, includes:

[0021] Based on the configured multiple reference aspect ratios, determining a reference aspect ratio whose distance from the aspect ratio of the image display area satisfies a first set condition as a target reference aspect ratio;

[0022] Determining, based on the screen ratio information and the screen pixels, a minimum number of pixels of the image suitable for displaying in the image display area;

[0023] Based on the configured multiple reference pixels, a reference pixel whose difference with the lowest pixel satisfies a second set condition is determined as a target reference pixel.

[0024] In a possible implementation, before determining, based on the configured multiple reference pixels, a reference pixel whose difference with the lowest pixel satisfies a second set condition as a target reference pixel, the method further includes:

[0025] Obtaining the network connection status of the terminal;

[0026] The step of determining, based on the configured multiple reference pixels, a reference pixel that satisfies a second set condition with the lowest pixel as a target reference pixel includes:

[0027] If the network connection status of the terminal indicates that the terminal is connected to a first type of communication network, based on the configured multiple reference pixels, determine a reference pixel that is not less than the lowest pixel and whose difference with the lowest pixel satisfies a first difference condition as a target reference pixel;

[0028] If the network connection status of the terminal indicates that the terminal is connected to a second type of communication network, based on the configured multiple reference pixels, a reference pixel that is smaller than the lowest pixel and whose difference with the lowest pixel satisfies a second difference condition is determined as a target reference pixel.

[0029] In another aspect, the present application also provides a method for loading an image, comprising:

[0030] Obtaining an image request sent by an application of the terminal, the image request carrying a target reference aspect ratio and target reference pixels suitable for a source image requested to be loaded by the application, the target reference aspect ratio and target reference pixels being among multiple reference aspect ratios and multiple reference pixels set by the server;

[0031] determining, from a plurality of candidate pictures corresponding to the source picture, a target picture having the target reference aspect ratio and target reference pixels, the plurality of candidate pictures being a plurality of different pictures obtained by performing lightweight processing on the source picture according to the plurality of reference aspect ratios and the plurality of reference pixels, wherein a data volume of the pictures obtained by the lightweight processing is smaller than a data volume of the source picture;

[0032] The target image is returned to the application of the terminal, so that the application loads the target image in the page of the application.

[0033] In a possible implementation, before obtaining the image request sent by the application of the terminal, the method further includes:

[0034] Obtaining display sizes of pictures and picture pixels of the pictures respectively reported by applications of multiple terminals, wherein the display size is the display size of a picture display area for displaying the picture on a page of the terminal application, and the display size includes at least an aspect ratio of the picture display area;

[0035] Determining, from the obtained picture pixels and display size aspect ratios, a first number of aspect ratios and a second number of picture pixels that appear most frequently;

[0036] Determining, based on the selected first number of aspect ratios and the first second number of picture pixels, multiple reference aspect ratios and multiple reference pixels for processing the picture from the configured multiple candidate reference aspect ratios and multiple candidate reference pixels;

[0037] After obtaining the source image to be added to the database, the source image is lightweight processed according to the multiple reference aspect ratios and multiple reference pixels to obtain multiple candidate images corresponding to the source image, and the reference aspect ratios and reference pixels of the multiple candidate images are not completely the same.

[0038] In a possible implementation, the method further includes:

[0039] For each candidate picture, determining a frequency combination coefficient of a reference aspect ratio and a reference pixel of the candidate picture, where the frequency combination coefficient is a product of an occurrence frequency of the reference aspect ratio of the candidate picture and an occurrence frequency of the reference pixel;

[0040] For each candidate picture, determining a target priority level corresponding to the candidate picture according to a frequency combination coefficient corresponding to the candidate picture; wherein the priority level of a candidate picture with a higher frequency combination coefficient is not lower than the priority level of a candidate picture with a lower frequency combination coefficient;

[0041] Storing the candidate images in a storage layer corresponding to the target priority level, wherein the higher the priority level of the storage layer, the faster the speed of obtaining images;

[0042] Determining a target picture having the target reference aspect ratio and target reference pixels from multiple candidate pictures corresponding to the source picture includes:

[0043] Determining a storage layer corresponding to the target reference aspect ratio and the target reference pixel as a target storage layer;

[0044] A target image corresponding to the source image and having the target reference aspect ratio and target reference pixels is obtained from the target storage layer.

[0045] In another aspect, the present application further provides a picture loading device, comprising:

[0046] A loading determination unit, used to determine the source image to be loaded in the application page;

[0047] a size obtaining unit, configured to obtain a display size of a picture display area in the page for displaying the source picture, wherein the display size is at least used to characterize an aspect ratio of the picture display area;

[0048] A pixel obtaining unit, configured to obtain screen pixels of a terminal running the application;

[0049] a reference determination unit, configured to determine, based on the screen pixels and the display size, a target reference aspect ratio and target reference pixels suitable for loading the source image from a plurality of configured reference aspect ratios and a plurality of reference pixels;

[0050] an image requesting unit, configured to obtain a target image having the target reference aspect ratio and target reference pixels from a plurality of candidate images corresponding to the source image stored on the server, wherein the plurality of candidate images are a plurality of different images obtained by the server performing lightweight processing on the source image according to the plurality of reference aspect ratios and the plurality of reference pixels, wherein the data size of the image obtained by the lightweight processing is smaller than the data size of the source image;

[0051] The picture loading unit is used to load the target picture into the picture display area of the page.

[0052] In another aspect, the present application further provides an image loading device, further comprising:

[0053] a request obtaining unit, configured to obtain an image request sent by an application of a terminal, the image request carrying a target reference aspect ratio and target reference pixels suitable for a source image requested to be loaded by the application, the target reference aspect ratio and target reference pixels being among multiple reference aspect ratios and multiple reference pixels set by a server;

[0054] a picture determination unit, configured to determine a target picture having the target reference aspect ratio and target reference pixels from a plurality of candidate pictures corresponding to the source picture, the plurality of candidate pictures being a plurality of different pictures obtained by performing lightweight processing on the source picture according to the plurality of reference aspect ratios and the plurality of reference pixels, wherein a data volume of the pictures obtained by the lightweight processing is smaller than a data volume of the source picture;

[0055] The image returning unit is configured to return the target image to the application of the terminal, so that the application loads the target image in the page of the application.

[0056] In another aspect, the present application further provides a computer device, comprising a memory and a processor;

[0057] Wherein, the memory is used to store programs;

[0058] The processor is used to execute the program, and when the program is executed, it is specifically used to implement any one of the image loading methods described above.

[0059] On the other hand, the present application also provides a storage medium for storing a program, which, when executed, is used to implement the image loading method described in any one of the above.

[0060] From the above content, it can be seen that in this application, when the terminal application needs to load a picture to the page, it will not directly obtain the original picture from the server. Instead, it will determine the target reference aspect ratio and target reference pixel of the picture suitable for loading in the picture display area from the configured multiple reference aspect ratios and multiple reference pixels based on the display size of the picture display area used to display the picture in the page and the screen pixels of the terminal, so that the picture display area can load a clear and visible picture. At the same time, since the target picture is a picture obtained by lightweight processing of the source picture, the data volume of the target picture is smaller than the data volume of the original picture. Therefore, obtaining the target picture from the server allows the application in the terminal to successfully load the picture on the page while reducing the amount of data required to obtain the picture to be loaded, thereby reducing bandwidth consumption and improving the picture loading speed. BRIEF DESCRIPTION OF THE DRAWINGS

[0061] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the following briefly introduces the drawings required for use in the description of the embodiments. Obviously, the drawings described below are merely embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on the provided drawings without any creative work.

[0062] Figure 1 A schematic diagram of a system composition architecture applicable to the solution of the present application is shown;

[0063] Figure 2 A schematic diagram showing a flow chart of a method for loading an image provided by an embodiment of the present application is shown;

[0064] Figure 3 A schematic diagram of an implementation process of determining the reference pixel and reference aspect ratio on the server side in this application is shown;

[0065] Figure 4 A schematic diagram showing a comparison of a source image and a cropped image of the source image is shown;

[0066] Figure 5 A schematic diagram showing the comparison of a source image and a compressed source image is shown;

[0067] Figure 6 A schematic diagram showing a flow chart of a method for loading an image provided by another embodiment of the present application is shown;

[0068] Figure 7 A schematic diagram showing two image display areas of the same size displayed side by side on an application page;

[0069] Figure 8 A schematic diagram showing three image display areas of the same size displayed side by side on an application page;

[0070] Figure 9 A schematic diagram showing a flow chart of a method for loading an image provided by another embodiment of the present application is shown;

[0071] Figure 10 A schematic diagram showing a framework of implementation principles of the image loading method in this application is shown;

[0072] Figure 11 A schematic diagram showing the structure of a picture loading device according to an embodiment of the present application is shown;

[0073] Figure 12 A schematic diagram showing the structure of a picture loading device according to another embodiment of the present application is shown;

[0074] Figure 13 A schematic diagram of the structure of a computer device of the present application is shown. DETAILED DESCRIPTION

[0075] The solution of this application is applicable to any scenario involving an application client obtaining and loading an image from a server. For example, this application can be applied to a scenario where a terminal requests an image from a server through a browser application and then loads the image. In another example, a terminal can request an image from a server through an application installed on the terminal, and after the server returns the image, the image is displayed on the application's page.

[0076] To facilitate understanding, a scenario to which the solution of this application is applicable is first introduced below.

[0077] like Figure 1 As shown, it shows a schematic diagram of the composition architecture of a system to which the image loading method of the present application is applicable.

[0078] The method of this embodiment may include: a terminal 101 and at least one server 102 .

[0079] The terminal may run an application program capable of establishing a connection with the server, for example, the terminal may run a browser or other application program with a browser.

[0080] For example, the terminal 101 may request the server for the image to be loaded through an application.

[0081] The server 102 may return the image to the terminal, so that the application of the terminal loads and displays the image in the page of the application.

[0082] In this application, there may be one or more servers, and multiple servers may constitute the image processing platform 100 .

[0083] Optionally, in order to improve the efficiency of image access and query, multiple servers can generally be set up, and the multiple servers can form a server cluster or a distributed system.

[0084] For example, the multiple servers may be a cloud service platform, referred to as a cloud platform, such as a cloud database or a cloud computer platform.

[0085] Correspondingly, a cloud service platform composed of multiple servers can be a cloud server that provides basic cloud computing services such as cloud services, cloud computing, cloud storage, cloud communications, big data and artificial intelligence platforms.

[0086] Cloud computing services are computing services based on cloud technology. Cloud technology refers to a hosting technology that unifies hardware, software, network and other resources within a wide area network or local area network to achieve data computing, storage, processing and sharing.

[0087] Cloud technology is a general term for network technologies, information technologies, integration technologies, management platform technologies, and application technologies based on the cloud computing business model. It can form a resource pool that can be used flexibly and conveniently on demand. Cloud computing technology will become a crucial support. Backend services for technical network systems, such as video websites, image websites, and more portals, require extensive computing and storage resources. With the rapid development and application of the internet industry, every item will likely have its own unique identifier, requiring transmission to backend systems for logical processing. Different levels of data will be processed separately, and data from various industries will require a strong system backend, which can only be achieved through cloud computing.

[0088] For example, the multiple servers can also be a blockchain system, on this basis, the pictures involved in this application can be stored through the blockchain nodes in the blockchain.

[0089] Blockchain is a new application model for computer technologies, including distributed data storage, peer-to-peer transmission, consensus mechanisms, and encryption algorithms. Essentially, a blockchain is a decentralized database, a series of data blocks linked using cryptographic methods. Each block contains information about a batch of online transactions, used to verify the validity of that information (to prevent counterfeiting) and generate the next block. Blockchain can include the underlying blockchain platform, the platform product and service layer, and the application service layer.

[0090] Of course, the multiple servers may have other forms, which are not limited thereto.

[0091] In order to improve the efficiency of the terminal in obtaining pictures, in this application, multiple servers can also be equipped with a content delivery network (CDN) to provide the required pictures to the terminal more efficiently through the content delivery network.

[0092] It is understandable that there may be one or more terminals accessing the server, and there is no restriction on this.

[0093] It is understandable that Figure 1 This is merely a schematic diagram of the composition architecture of a system applicable to the solution of the present application. In actual applications, the system may have other possible forms, which are not limited to this.

[0094] The inventors of the present application have found through research that for a certain picture, no matter what type of terminal is used and the size of the display area of the terminal displaying the picture is different, when the terminal requests the picture from the server, the server provides the same picture to the terminal.

[0095] With the diversification of terminals and their varying image display requirements, the image sizes suitable for displaying vary significantly. For example, different terminal types may have different screen pixel counts. Therefore, while ensuring clear image display, different terminals may have different requirements for image pixel counts. For another example, the image display sizes used for pages displayed on the same terminal may vary, resulting in different image sizes.

[0096] Based on the above research findings, if the image suitable for the terminal can be dynamically determined based on the display state parameters of the terminal display image, it will be beneficial to reduce the loading time of the image while taking into account the clarity of the image, and reduce the network bandwidth required for the terminal to obtain the image.

[0097] In combination with the above content, the image loading method of this application is first introduced from the terminal side.

[0098] like Figure 2 As shown, it shows a flow chart of an embodiment of a method for loading an image in the present application. The method of this embodiment is applied to a terminal. This embodiment may include:

[0099] S201: Determine a source image to be loaded in an application page.

[0100] The application page may be a page that has been displayed by the application, or a page that is to be displayed by the application.

[0101] Considering that the existing conventional method determines that the image to be loaded in the page is unique and fixed, while this application may be an image processed by the source image, on this basis, this application calls the image to be loaded in the page determined in this step the source image.

[0102] In one implementation, determining the source image to be loaded in the page may be obtaining an image identifier of the source image to be loaded.

[0103] The image identifier of the source image loaded into the page is an icon identifier of an image related to the page. Specifically, it can be the icon identifier of the image to be loaded into the page determined based on the operation instruction detected on the page, or the image identifier of the image to be loaded contained in the page data of the page.

[0104] The image identifier of the source image is used to uniquely identify the source image. For example, the image identifier of the source image may be an image code. Alternatively, the image identifier of the source image may be an image address of the source image, and the image address may be used to locate the source image. For example, the image address of the source image may be a uniform resource locator address used to locate the storage location of the source image.

[0105] For example, when an application is started or there is a need to update a page, the application will obtain page data of the page to be displayed from the server, and the page data will include the image address of the source image that needs to be loaded into the page.

[0106] S202: Obtain the display size of the picture display area in the page for displaying the source picture.

[0107] The image display area may be an interface area of an interface for displaying the source image, a control display area of a control, or other types of display areas in the page.

[0108] The display size of the picture display area is the size of the picture that can be finally displayed in the picture display area.

[0109] In the present application, the display size of the image display area is used to at least characterize the aspect ratio of the image display area. For example, the display size of the image display area may include the aspect ratio of the image display area, or may include the width and height of the image display area.

[0110] It is understood that when an application page involves displaying multiple images side by side horizontally, the display size of the image display area may also include screen ratio information of the image display area. This screen ratio information of the image display area can reflect the screen occupancy of the image display area. In combination with the screen pixels of the terminal, the minimum pixel size of the image required to clearly display the content in the image display area can be determined.

[0111] Of course, the display size may also include other information, and there is no limitation on this.

[0112] S203: Obtain screen pixels of the terminal.

[0113] This terminal is the terminal that runs the application.

[0114] The screen pixels of the terminal may reflect the resolution of the screen, and may also reflect the picture pixels required to clearly display the picture on the screen of the terminal.

[0115] The number of screen pixels may include both the horizontal and vertical pixel counts of the screen, or may simply include the horizontal pixel count of the screen, taking into account the user's image browsing habits.

[0116] S204 , based on the screen pixels and the display size, determine a target reference aspect ratio and target reference pixels suitable for the loaded source image from among the configured multiple reference aspect ratios and multiple reference pixels.

[0117] The reference aspect ratio is the aspect ratio that the image can present. For example, the reference aspect ratio may include

[0118] The reference pixel may be a pixel that can be presented in the picture (eg, one or both of a horizontal pixel and a vertical pixel).

[0119] In this application, the configured reference aspect ratio and reference pixel are actually the aspect ratio and pixel based on which the server side processes the image. For example, the server can perform different cropping on the stored images according to a variety of reference aspect ratios, and perform different pixel compression on the images according to different reference pixels, so that the same image corresponds to images with different reference aspect ratios and reference pixels.

[0120] Accordingly, the configured multiple reference aspect ratios and multiple reference pixels, that is, the source image stored on the server side, can be selectively presented with reference aspect ratios and reference pixels.

[0121] The multiple reference aspect ratios and multiple reference pixels configured in the application are pre-determined by the server. In actual applications, the server may determine the multiple reference aspect ratios and reference pixels and then configure the reference aspect ratios and reference pixels in a fixed manner in the application program package.

[0122] In the case where the server periodically updates the reference aspect ratio and reference pixel, the application may also periodically obtain multiple reference aspect ratios and reference pixel from the server; or, the application may be updated with multiple reference aspect ratios or reference pixel configured by upgrading the application.

[0123] This application does not impose any restrictions on the specific implementation method of configuring the reference aspect ratio and reference pixels in this application.

[0124] The target reference aspect ratio is a reference aspect ratio among multiple reference aspect ratios whose distance from the aspect ratio of the image display area represented by the display size satisfies a first set condition. The first set condition can be set as needed. For example, the first set condition may be: the distance from the aspect ratio represented by the display size is less than a set threshold, or the distance from the aspect ratio represented by the display size is the smallest, etc.

[0125] It is understood that to ensure that there is no blank area in the image display area of the page, the target reference aspect ratio should generally not be smaller than the aspect ratio of the image display area. Accordingly, the target reference aspect ratio that meets the first set condition can be: among multiple reference aspect ratios, the reference aspect ratio that is closest to the aspect ratio of the image display area represented by the display size and is not smaller than the aspect ratio of the image display area.

[0126] Similarly, the target reference pixel may be a reference pixel among multiple reference pixels whose difference with the screen pixel satisfies a second set condition. For example, when only one image is displayed side by side on a page, the reference pixel that satisfies the second set condition may be the reference pixel whose pixel difference with the screen pixel is the smallest (or smaller than a pixel threshold).

[0127] For another example, when a page may display multiple images side by side, the screen ratio information represented by the display size of the image display area may be combined to determine the lowest pixel suitable for displaying the image in the image display area from multiple reference pixels, and then determine the target reference pixel that meets the second set condition based on the lowest pixel. For example, the second set condition may be a reference pixel that is closest to the lowest pixel or has a difference with the lowest pixel that is not less than a pixel threshold.

[0128] It is understandable that, in order to ensure the clarity of the image, the target reference pixel is generally not less than the minimum pixel suitable for the image display area.

[0129] S205 : Obtain a target picture having a target reference aspect ratio and target reference pixels from a plurality of candidate pictures corresponding to the source picture stored in the server.

[0130] The plurality of candidate images are obtained by performing lightweight processing on the source image by the server according to a plurality of reference aspect ratios and a plurality of reference pixels, wherein the data volume of the image obtained by the lightweight processing is smaller than the data volume of the source image.

[0131] For example, a plurality of different images may be obtained by performing at least one of cropping and compressing a source image according to a plurality of reference aspect ratios and a plurality of reference pixels. The reference aspect ratio may be the aspect ratio of an image after cropping the source image, and the reference pixels may be the pixels of an image after compressing the source image.

[0132] The base aspect ratios and base pixels of the various candidate images are not identical. For example, the candidate images may have different aspect ratios, different pixels (such as the number of horizontal pixels), or different aspect ratios and different pixels.

[0133] The target image is a candidate image having an aspect ratio equal to the target reference aspect ratio and pixels equal to the target reference pixels among the multiple candidate images.

[0134] From the previous analysis, we can see that the pixels of the target image can meet the requirements of clearly presenting the image content in the image display area; moreover, compared with the source image, the data volume of the target image is relatively small, therefore, it can reduce the bandwidth cost required to obtain the target image from the server and reduce the number of loading failures or loading exceptions.

[0135] There are various ways to obtain the target image from the server. For example, the image identifier of the source image, the target reference pixel, and the target reference aspect ratio information can be sent to the server so that the server can locate the target image. Of course, there are other possible ways, which are not limited to this.

[0136] S206: Load the target image in the image display area of the page.

[0137] It is understandable that due to the different aspect ratios of different images, if the source image is directly obtained and loaded into the image display area, it is easy for the source image to not be fully displayed in the image display area because the source image is not blocked. The undisplayable part of the source image is actually meaningless to the image display area, but it generates bandwidth consumption when obtaining the source image.

[0138] In the present application, since the aspect ratio of the target image is closely matched with that of the image display area, after the target image is loaded and displayed in the image display area, the portion of the target image that is blocked and not fully displayed is reduced; and since the aspect ratio of the target image is smaller than that of the source image, the amount of data of the target image is reduced, thereby reducing the bandwidth required to obtain the image without affecting the normal viewing of the image content.

[0139] Similarly, the pixels of the target image match the screen pixels, allowing the terminal to obtain lightweight images such as compressed pixels while meeting the clarity requirements, reducing the amount of data consumed by the terminal to obtain the required loaded images, thereby reducing the consumption of bandwidth resources.

[0140] At the same time, since the amount of data required for loading pictures on the terminal side of this embodiment is relatively small, the terminal can load pictures more efficiently, thereby improving the picture loading speed.

[0141] In order to facilitate understanding of the solution of this application, the process of determining the reference pixel and reference aspect ratio on the server side in this application is described below. Figure 3 As shown, it shows a schematic diagram of an implementation process of determining multiple reference pixels and multiple reference aspect ratios in this application. This embodiment is applied to a server. The method of this embodiment may include:

[0142] S301: Obtain display sizes and picture pixels of pictures reported by applications of multiple terminals respectively.

[0143] The display size refers to the display size of the image display area on the terminal's application page used to display the image. This display size includes at least the aspect ratio of the image display area, i.e., the ratio of the width to the height of the image display area. This display size has the same meaning as the display size of the image display area obtained by the terminal previously. For details, please refer to the relevant description of the previous embodiment and will not be repeated here.

[0144] Image pixels are the image pixels of the image displayed on the terminal page. For example, the image pixels include the number of horizontal pixels and the number of vertical pixels of the image. In an optional manner, the image pixels can only refer to the number of horizontal pixels of the image.

[0145] After loading a picture in a page, the terminal can report the display size of the picture display area where the picture loaded in the page is located and the picture pixels of the picture, such as Figure 2 In an embodiment, after step S206 , the terminal may report the display size and picture pixels of the picture display area corresponding to the loaded picture to the server.

[0146] In actual applications, there are many possible ways and timings for the terminal to report the display size and image pixels to the server, which can be set according to needs and are not limited in this application.

[0147] S302 : Determine the first number of aspect ratios and the second number of picture pixels with the highest occurrence frequencies from the obtained picture pixels and aspect ratios of the picture display area.

[0148] The first number and the second number can be set as needed without limitation, and the first number and the second number can be the same or different. For example, the first number can be 6 and the second number can be 8.

[0149] S303 : Determine multiple reference aspect ratios and multiple reference pixels for processing the image from the configured multiple candidate reference aspect ratios and multiple candidate reference pixels based on the selected first number of aspect ratios and the first second number of image pixels.

[0150] It is understandable that, considering the large differences in screen pixels of different terminals and the display sizes of image display areas in the application pages of the terminals, in order to make the set reference pixels and reference aspect ratios universally applicable, the present application can also pre-configure multiple candidate reference aspect ratios and multiple candidate reference pixels.

[0151] The multiple candidate reference aspect ratios may include a minimum candidate reference aspect ratio and a maximum candidate reference aspect ratio, and multiple candidate reference aspect ratios may be set between the minimum candidate reference aspect ratio and the maximum candidate reference aspect ratio according to a set step length.

[0152] In the present application, the reference aspect ratio determined as a basis for image processing may be: a reference aspect ratio that is closest to the first number of aspect ratios or is smaller than a set threshold.

[0153] In an optional manner, for any selected aspect ratio, a candidate reference aspect ratio that is closest to and not less than the aspect ratio can be determined from multiple candidate reference aspect ratios as an aspect ratio for processing the image, thereby ultimately obtaining multiple reference aspect ratios.

[0154] Similarly, the reference pixel determined as the basis for image processing may be a plurality of candidate reference pixels that match the selected image pixel with the highest occurrence frequency.

[0155] For example, in an optional manner, for each selected image pixel, a candidate reference pixel having the smallest difference with the image pixel and not less than the image pixel can be determined from multiple candidate reference pixels as the reference pixel based on which the image is processed.

[0156] For example, the following 22 discrete values can be preset as 22 candidate reference aspect ratios, namely:

[0157] 0.4, 0.5, …, 2.3, 2.4, 2.5.

[0158] Among them, the minimum candidate benchmark aspect ratio is 0.4, the maximum candidate aspect ratio is 2.5, and the step size is 0.1.

[0159] Based on this, after determining the most frequently occurring aspect ratios, for each aspect ratio, a value that is closest to the aspect ratio and not less than it is found from all candidate baseline aspect ratios. For example, if the reported aspect ratio is 0.98, the closest baseline aspect ratio is 1.0. Since 1.0 is greater than 0.98, 1.0 can be used as the determined baseline aspect ratio. If the more frequently occurring aspect ratio is 0.95, then the distance between it and both candidate baseline aspect ratios is the same. Based on this, the candidate with the larger value is selected as the baseline aspect ratio, which is 1.0 in this case.

[0160] The following example uses reference pixels as an example. For ease of understanding, it is assumed that both the image pixels and the candidate reference pixels are the number of horizontal pixels in the image:

[0161] For example, there are 10 discrete candidate benchmark pixels: 100, 200, ..., 900, and 1000, with the minimum candidate benchmark pixel being 100, the maximum candidate benchmark pixel being 1000, and the step size being 100. For example, if the image pixel with the highest frequency is 150, then the smallest candidate benchmark pixel greater than this value is 200, and 200 is the determined benchmark pixel. If the reported image pixel is 101, then the smallest candidate benchmark pixel greater than this value is still 200.

[0162] It is understandable that in actual applications, if the terminal reports a small amount of image display size and image pixel data, it may not be possible to accurately calculate the most frequently used aspect ratios and reference pixels. In this case, several default initial reference aspect ratios can be set as the reference aspect ratios for image processing. Similarly, setting a default initial reference pixel as the reference pixel for image processing can reduce the problem of large variance fluctuations caused by a small amount of initial data.

[0163] For example, if we continue to use the baseline aspect ratio, we can use 0.4, 0.8, 1.2, 1.6, 2.0, and 2.4 as the default baseline aspect ratios for image processing. Similarly, we can set 100, 300, 600, and 1000 as the initial baseline pixels.

[0164] It is understandable that as the reported image pixels and display size continue to increase, the server will also periodically or regularly execute the above steps. Figure 3 The implementation process is to continuously refresh the most frequently appearing picture pixels and aspect ratios, and finally update the base pixels and base aspect ratios.

[0165] It is understandable that after determining multiple reference aspect ratios and reference pixels, in order for the terminal to obtain images with different reference aspect ratios and reference pixels from the server according to its own different image display requirements, the server in this application, after obtaining the source image to be added to the database, performs lightweight processing on the source image according to the multiple reference aspect ratios and multiple reference pixels, and obtains multiple candidate images corresponding to the source image. The reference pixels and reference aspect ratios corresponding to the multiple candidate images are not exactly the same. For ease of understanding, the lightweight processing includes one or more of cropping and compression as an example.

[0166] The reference aspect ratio actually represents the ratio of the image's width to its height. Therefore, the image needs to be cropped based on the reference aspect ratio to produce an image with the reference aspect ratio. Accordingly, the source image needs to be cropped in various ways based on various reference pixels to obtain candidate images with different reference pixels.

[0167] like Figure 4 , which respectively show a comparison diagram of the source image and the image after the source image is cropped.

[0168] exist Figure 4 The leftmost picture is the source picture, and the second, third, and fourth pictures from left to right are the source pictures that are cropped with aspect ratios of 1.0, 1.5, and 2.5, respectively.

[0169] Although cropping an image reduces the amount of content displayed, the uncropped portion of the original image cannot be displayed if the image display area on the terminal page has a limited display size. Cropping an image not only does not change the image content displayed in the image display area, but also reduces the image data size, thereby saving bandwidth costs for transmitting the image and reducing the time required for image loading and display.

[0170] It is understood that since the reference pixel refers to the number of pixels in an image, the source image needs to be compressed to ensure that the image has the reference pixel. Therefore, each reference pixel in this application can also be regarded as a compression ratio. Accordingly, based on multiple reference pixels, the source image needs to be compressed in multiple ways to obtain candidate images with different reference pixels corresponding to the source image.

[0171] As an optional method, the reference pixel of the present application can be a reference pixel in the horizontal direction of the image. On this basis, the image is compressed according to the reference pixel so that the number of horizontal pixels in the compressed source image is the reference pixel.

[0172] For example, assuming that the benchmark pixels include five horizontal pixel sizes: 900, 600, 300, 200, and 100, then the source image needs to be compressed into multiple images with horizontal pixels of 900, 600, 300, 200, and 100 respectively. Among them, the lower the value of the horizontal benchmark pixels, the higher the compression ratio, and the smaller the size of the image.

[0173] like Figure 5 As shown, it shows a schematic diagram of the comparison of the source image and the compressed source image.

[0174] in, Figure 5 The first picture from left to right is the source picture, and the second to fourth pictures from left to right are three pictures after the source picture is compressed, and the horizontal pixels of these three pictures are 900, 600, and 300 respectively.

[0175] Correspondingly, the data size of the source image is 84KB, while the data sizes of the second to fourth images from left to right are 80KB, 68KB, and 26KB, respectively. As the compression ratio increases, the data size of the image decreases.

[0176] It is understandable that some candidate images may be images obtained by cropping and compressing the source images respectively, while some candidate images may be images obtained by simply cropping the source images, or images obtained by simply compressing the pixels.

[0177] For example, assuming there are m reference aspect ratios and n reference pixel values, this application processes the source image through m cropping methods, n compression methods, or any combination of these methods. This results in m candidate images that are only cropped, n candidate images that are only compressed, and m*n candidate images that are both cropped and compressed. Here, m and n are both natural numbers greater than 1.

[0178] Accordingly, the server will store the multiple candidate images obtained by processing the source image in the database. At the same time, in order for the terminal to query the source image as needed, the server will also store the source image in the database.

[0179] It is understandable that the frequency of access to images with different base pixels and base aspect ratios will also be different. Based on this, in order to enable images with higher requirements for base pixels and base aspect ratios to be accessed more efficiently, this application can also set priority levels corresponding to different base pixels and base aspect ratios.

[0180] Specifically, the frequency of occurrence of each of the multiple reference pixels being accessed and the frequency of occurrence of the corresponding multiple reference aspect ratios can be counted according to the image pixels and display size reported by the terminal. Then, the frequency combination coefficients corresponding to different reference combinations are determined. Each reference combination includes one or two of the multiple reference aspect ratios and multiple reference pixels. For example, under the premise that there are m aspect ratios and n reference pixels, there may be m+n+m*n reference combinations. The frequency combination coefficient of the reference combination is the product of the frequency of occurrence of each reference object included in the reference combination. The reference object can be a reference aspect ratio or a reference pixel.

[0181] For example, assuming that the reference combination is a combination of a reference aspect ratio of 100 and reference pixels 800, the product of the occurrence frequency corresponding to the reference aspect ratio 100 and the occurrence frequency of the reference pixels 800 is determined as the frequency combination coefficient of the reference combination.

[0182] Based on the above, multiple benchmark combinations can be divided into different priority levels according to the frequency coefficients. Among them, benchmark combinations with high frequency coefficients have relatively high priority levels. Accordingly, more access resources can be allocated to high-priority benchmark combinations.

[0183] Accordingly, for any candidate image after the source image has been subjected to at least one of processing steps, such as cropping and compression, a frequency combination coefficient of the reference aspect ratio and reference pixels of the candidate image can be determined. As described above, the frequency combination coefficient is the product of the frequency of occurrence of the reference aspect ratio of the candidate image and the frequency of occurrence of the reference pixels of the candidate image.

[0184] If the candidate image has only been processed by cropping or compression, that is, the candidate image only has the benchmark aspect ratio or benchmark pixels, then the frequency of occurrence corresponding to the benchmark dimension that is not present in the candidate image is set to 1. For example, if the candidate image is obtained by processing the source image based on a certain benchmark aspect ratio, then the pixels of the candidate image are the pixels of the source image, and the frequency of occurrence corresponding to the benchmark pixels of the candidate image can be defaulted to 1. Therefore, the frequency combination coefficient of the candidate image is the frequency of occurrence of the benchmark aspect ratio of the candidate image.

[0185] On the basis of the above, for each candidate picture of the source picture, the target priority level corresponding to the candidate picture can be determined according to the frequency combination coefficient corresponding to the candidate picture. Among them, the priority level of the candidate picture with a high frequency combination coefficient is not lower than the priority level of the candidate picture with a low frequency combination coefficient;

[0186] For example, the range intervals of the frequency combination coefficients corresponding to different priority levels can be set, and based on the corresponding relationship, the target priority level to which the frequency combination coefficient corresponding to the candidate picture belongs can be determined.

[0187] Accordingly, the candidate image is stored in the storage layer corresponding to the target priority level to which the candidate image belongs. The higher the priority level, the higher the image access performance of the storage layer corresponding to the priority level. Accordingly, the higher the priority level, the faster the image is retrieved from the storage layer.

[0188] For example, different storage layers have different resources, wherein the higher the priority level, the more resources are allocated to the storage layer corresponding to the priority level.

[0189] For example, the priority levels can be set to be divided into three levels, and the priority levels from high to low are priority level 1, priority level 2 and priority level 3. Among them, priority level 1 corresponds to the most storage layer resources, and accordingly, the terminal has the highest access efficiency to the candidate images in storage layer 1. In one possible implementation method, for the highest priority level, the storage layer corresponding to the priority level can be set to include a storage area where a content distribution network system is deployed. The storage layers corresponding to other priority levels may not deploy a storage area of a content distribution network system. On this basis, if the target priority level corresponding to the candidate image belongs to the highest priority level, the candidate image can be stored in the content distribution network system, so that high-priority candidate images can be more efficiently acquired by the terminal.

[0190] Based on the above, after obtaining the target reference aspect ratio and target reference pixels suitable for the source image requested by the terminal, the server can determine the storage layer corresponding to the target reference aspect ratio and target reference pixels as the target storage layer, and obtain a target image corresponding to the source image and having the target reference aspect ratio and target reference pixels from the target storage layer. The target image is one of the multiple candidate images corresponding to the source image.

[0191] In combination with the above introduction, the following introduces the image loading method of the present application from the terminal side using a possible situation of image identification.

[0192] like Figure 6 , which shows a flow chart of another embodiment of a method for loading an image in the present application. The method of this embodiment can be applied to a terminal having an application installed therein. The method of this embodiment may include:

[0193] S601: Determine the image address of the source image to be loaded in the page of the application.

[0194] For example, the image address may be the uniform resource locator of the source image.

[0195] S602: Obtain the display size of the picture display area in the page for displaying the source picture.

[0196] The display size may include the aspect ratio of the image display area.

[0197] The display size may also include screen ratio information of the image display area, such as the ratio of the image display area to the horizontal width of the screen.

[0198] S603: Obtain screen pixels of the terminal.

[0199] S604 : Based on the configured multiple reference aspect ratios, determine a reference aspect ratio whose distance from the aspect ratio of the image display area satisfies a first set condition as a target reference aspect ratio.

[0200] For example, the target reference aspect ratio that meets the first setting condition may be a reference aspect ratio that has the smallest difference from the aspect ratio in the display size and is not less than the aspect ratio in the display size.

[0201] S605: Based on the screen ratio information and the screen pixels, determine the minimum pixel count of the image that is suitable for displaying in the image display area.

[0202] It can be understood that the screen ratio information reflects the proportion of the screen occupied by the image display area. When the screen pixels are known, based on the screen ratio information, the minimum pixels required for the image displayed in the image display area to clearly display the image content can be determined.

[0203] In a possible case, if the screen ratio information can reflect the ratio of the image display area to the horizontal screen, then the minimum pixel is the minimum value of the horizontal pixels of the image that the image display area is suitable for displaying.

[0204] For example, assuming that two image display areas of the same size need to be displayed side by side horizontally in a certain page of an application, the screen ratio information of each image display area may be that the horizontal ratio of the image display area is half of the screen.

[0205] like Figure 7 As shown, it shows a schematic diagram of displaying two picture display areas of the same size side by side on an application page.

[0206] exist Figure 7 On the basis of this, assuming that the horizontal pixel value of the screen is 828, then the minimum horizontal pixel value of the picture displayed in each picture display area should be 828 / 2=414 pixels to ensure that the picture display area clearly displays the picture. Therefore, the minimum pixel value of the picture suitable for displaying in the picture display area is 414.

[0207] Similarly, if a page needs to display three pictures side by side in the horizontal direction, then according to the shielding ratio information of the picture display area, it can be determined that the average number of pixels required for each picture display area to be suitable for displaying a picture is at least 828 / 3=276 pixels. Figure 8 As shown, in Figure 8 The page shown has three picture display areas of the same size displayed side by side. Therefore, the page needs to display three pictures side by side. On this basis, in order to ensure that each picture can be displayed clearly, the horizontal pixel count of each picture cannot be less than 276.

[0208] S606 , based on the configured multiple reference pixels, determine a reference pixel whose difference with the lowest pixel satisfies a second set condition as a target reference pixel.

[0209] For example, the target reference pixel that meets the second setting condition is a reference pixel that is not smaller than the lowest pixel and has the smallest difference with the lowest pixel.

[0210] For example, assuming that the reference pixel is the horizontal pixel of the image, and the reference pixels include 900, 600, 300, 200, and 100, then for Figure 7 In the case shown in the figure, since the minimum pixel suitable for the image display area is 276, the target reference pixel should be 300. Figure 7 The horizontal pixels of the image displayed on the page can be 300.

[0211] It is understandable that in actual applications, the network status of the terminal will also affect the picture message of the picture loaded on the terminal side. Therefore, in one possible implementation method, the present application can also obtain the network connection status of the terminal, which can represent one or more information such as the network communication rate of the terminal or the type of network accessed.

[0212] Accordingly, the terminal's network connection status indicates that the terminal is connected to the first type of communication network. Based on the configured multiple reference pixels, a reference pixel that is not less than the minimum pixel and whose difference with the minimum pixel satisfies a first difference condition is determined as the target reference pixel. For example, the first difference condition may be a minimum difference, or a difference that is less than a set threshold.

[0213] If the terminal's network connection status indicates that the terminal is connected to a second type of communication network, a reference pixel that is smaller than the minimum pixel and whose difference with the minimum pixel satisfies a second difference condition among the multiple configured reference pixels is determined as the target reference pixel. The second difference condition can also be a minimum difference or a difference less than a set threshold, etc., without limitation.

[0214] Among them, the data transmission rate of the first type of communication network is higher than that of the second type of communication network. For example, the first type of communication network can include the fifth generation mobile communication network and the fourth generation mobile communication network, etc., while the second type of communication network can be the third generation mobile communication network, etc. Of course, in actual applications, it can also be divided into other categories as needed, but the principles are similar and there is no restriction on this.

[0215] Of course, in practical applications, there may be other possible ways to determine the target reference pixel in combination with the network connection status of the terminal, and there is no limitation to this.

[0216] It should be noted that the above is an example of an implementation method for determining the target reference aspect ratio and target reference pixels suitable for the loaded source image. However, the other implementation methods for determining the target reference aspect ratio and target reference pixels mentioned in the previous embodiments are also applicable to this embodiment.

[0217] S607 , adding the target reference aspect ratio and the target reference pixel information to the picture address to obtain a reconstructed picture address.

[0218] The reconstructed picture address is used to point to a target picture having the target reference aspect ratio and the target reference pixels among the multiple candidate pictures corresponding to the source picture.

[0219] For example, add the target base aspect ratio and target base pixel to the end of the image address of the source image.

[0220] For example:

[0221] Assume that the image address of the source image is: http: / / a*****b** / c**open, and the target base aspect ratio is 10, and the target base pixel is 300, then the reconstructed image address can be: http: / / a*****b** / c**open_10 / 300.

[0222] Of course, there are other possible ways to add the target reference aspect ratio and the target reference pixel to the image address, as long as the server can locate the target image according to the reconstructed image address, and there is no limitation on this.

[0223] S608: Send the reconstructed picture address to the server, so that the server locates the target picture based on the reconstructed picture address.

[0224] For example, the server may determine the storage address of the target image based on the reconstructed image address and obtain the data of the target image.

[0225] S609: Obtain the target image returned by the server based on the reconstructed image address.

[0226] S610: Load the target image in the page of the application.

[0227] In an embodiment of the present application, the terminal side can combine the screen ratio and aspect ratio of the image display area in the page and the screen pixels of the terminal to comprehensively determine the pixels and aspect ratio of the image suitable for loading in the image display area, so as to more reliably ensure that the image display area can clearly display the image while reducing the amount of data of the loaded image.

[0228] At the same time, this application reconstructs the image address of the source image based on the target reference pixels and target reference aspect ratio suitable for the image display area, so that the server can directly locate the corresponding target image based on the reconstructed image address, thereby reducing the time required for the server to query the target image, which is conducive to improving the efficiency of image acquisition.

[0229] It can be understood that in the above scheme of the present application, considering that the image formats supported for display in the pages of the same application on different terminals may also be different, therefore, in the present application, the server can also generate multiple candidate images with different base aspect ratios and base pixels and different image formats for the source image.

[0230] Accordingly, the terminal application can also determine at least one image format supported by the terminal, and obtain a target image having the target reference aspect ratio, target pixels and an image format supported by the terminal from multiple candidate images corresponding to the source image stored in the server.

[0231] For ease of understanding, the image loading method of this application is introduced from the server side below.

[0232] like Figure 9 , which shows a flow chart of another embodiment of a method for loading an image in the present application. The method of this embodiment is applied to a server, and the method of this embodiment may include:

[0233] S901: Obtain an image request sent by an application of a terminal.

[0234] The image request carries the target reference aspect ratio and target reference pixels suitable for the source image requested to be loaded by the application.

[0235] For example, the image request may carry the image identifier of the source image, as well as the target reference aspect ratio and target reference pixels suitable for loading the source image.

[0236] The target reference aspect ratio and target reference pixel are multiple reference aspect ratios and multiple reference pixels set by the server. For details, please refer to the relevant introduction of the previous embodiment, which will not be repeated here.

[0237] S902 : Determine a target picture having a target reference aspect ratio and target reference pixels from multiple candidate pictures corresponding to the source picture.

[0238] The multiple candidate images are multiple different images obtained by performing at least one of cropping and compressing the source image based on multiple reference aspect ratios and multiple reference pixels. The generation of the candidate images can be combined with the relevant description of the previous embodiment, which will not be repeated here.

[0239] For example, in one possible implementation, the image request may be a source image address with the target reference aspect ratio and target reference pixel added to the image address, i.e., the reconstructed image address mentioned above. Based on this, the server may determine the target image based on the reconstructed image address.

[0240] S903: Return the target image to the application of the terminal, so that the application loads the target image in the application page.

[0241] It is understandable that in Figure 9 In the embodiment, if the image request sent by the terminal carries an image format supported by the terminal, the server can also determine the target image by combining the target reference aspect ratio, target reference pixel and the image format. The specific process is as described above and is not limited to this.

[0242] To facilitate understanding of the solution of the present application, the following is an introduction based on the implementation principle architecture of the solution of the present application and an exemplary application scenario.

[0243] like Figure 10 As shown, it shows a schematic diagram of an implementation principle framework of the solution of the present application. For ease of understanding, an application scenario is used as an example, where the terminal is a client of an application for providing news content, and the server is the server of the application, which has a browser for presenting news content.

[0244] In this scenario, after the terminal displays the image on the browser page through the browser, the image pixels and display size of the image displayed by the terminal can be sent to the server. The display size includes the aspect ratio of the image or the aspect ratio of the image display area corresponding to the image in the page.

[0245] The server will process the image pixel and display size data reported by the terminal, such as some deduplication processing, to complete Figure 10 Operation of the "data processing" module in the server.

[0246] Accordingly, the server's data statistics module performs statistical analysis of the display size and image pixels reported by the terminal to determine the top first number of aspect ratios and top second number of image pixels with the highest frequency. Based on these top first number of aspect ratios and top second number of image pixels, and in combination with multiple configured candidate baseline aspect ratios and candidate baseline pixels, multiple baseline aspect ratios and multiple baseline pixels can be determined as a basis for image lightweighting.

[0247] Based on the above, after the server obtains the pictures to be stored in the database, it can process the pictures through the cropping / compression module. Specifically, based on the determined multiple reference aspect ratios and multiple reference pixels, the pictures are cropped and compressed in one or more ways to obtain multiple pictures with smaller data volumes corresponding to the pictures, and the processed pictures are stored through the picture storage module.

[0248] Among them, the picture storage module can determine the frequency combination coefficient of each picture after cropping / compression processing in the manner mentioned above, and the frequency combination coefficient corresponding to each picture, determine the priority level corresponding to the candidate picture, and then store each picture in layers according to the priority level, so that high-priority pictures are stored in a storage layer with richer resources.

[0249] Based on the above, if the terminal application needs to load news pictures in the news page displayed by the browser, after determining the picture address of the news picture, the target benchmark pixels and target benchmark aspect ratio of the news picture suitable for loading can be determined based on the aspect ratio of the picture display area displaying the news picture in the news page, the screen ratio of the picture display area and the screen pixels of the terminal.

[0250] Accordingly, the terminal may reconstruct the picture address based on the target reference pixels and the target reference aspect ratio to obtain a reconstructed picture address, and send the reconstructed picture address to the server.

[0251] After the server obtains the reconstructed image address, it can determine the storage layer where the news image with the corresponding aspect ratio and pixels is located based on the reconstructed image address, and obtain the news image with the corresponding aspect ratio and pixels and return it to the terminal, so that the terminal can load the news image with the aspect ratio and pixels suitable for the image display area, and also reduce the resource consumption caused by obtaining the original news image.

[0252] Corresponding to the operation of a picture loading method of the present application on the terminal side, the present application also provides a picture loading device.

[0253] like Figure 11As shown, it shows a schematic diagram of the composition structure of an embodiment of a picture loading device of the present application. The device can be applied to a terminal, and the device may include:

[0254] The loading determination unit 1101 is used to determine the image identifier of the source image to be loaded in the application page;

[0255] A size obtaining unit 1102 is configured to obtain a display size of an image display area on the page for displaying the source image, where the display size is at least used to represent an aspect ratio of the image display area.

[0256] The pixel obtaining unit 1103 is used to obtain the screen pixels of the terminal running the application;

[0257] A reference determination unit 1104 is configured to determine, based on the screen pixels and the display size, a target reference aspect ratio and target reference pixels suitable for loading the source image from among multiple configured reference aspect ratios and multiple reference pixels;

[0258] The image request unit 1105 is configured to obtain a target image having the target reference aspect ratio and target reference pixel count from a plurality of candidate images corresponding to the source image stored on the server, wherein the plurality of candidate images are a plurality of different images obtained by the server performing lightweight processing on the source image according to the plurality of reference aspect ratios and the plurality of reference pixel counts, wherein the data size of the images obtained by the lightweight processing is smaller than the data size of the source image;

[0259] The picture loading unit 1106 is used to load the target picture into the picture display area of the page.

[0260] In a possible case, the loading determination unit may include:

[0261] An address determination unit, configured to determine an image address of a source image to be loaded in a page of an application;

[0262] The image request unit includes:

[0263] an address reconstruction unit, configured to add information of the target reference aspect ratio and the target reference pixels to the picture address to obtain a reconstructed picture address, wherein the reconstructed picture address is used to point to a target picture having the target reference aspect ratio and the target reference pixels among the multiple candidate pictures corresponding to the source picture;

[0264] an address sending unit, configured to send the reconstructed image address to the server, so that the server locates the target image based on the reconstructed image address;

[0265] The image obtaining unit is configured to obtain the target image returned by the server based on the reconstructed image address.

[0266] In another possible case, the display size obtained by the size obtaining unit includes: aspect ratio of the image display area and screen ratio information of the image display area;

[0267] The benchmark determination unit includes:

[0268] an aspect ratio determining unit configured to determine, based on a plurality of configured reference aspect ratios, a reference aspect ratio whose distance from the aspect ratio of the image display area satisfies a first set condition as a target reference aspect ratio;

[0269] a minimum pixel determination unit, configured to determine, based on the screen ratio information and the screen pixels, a minimum pixel of the image suitable for displaying in the image display area;

[0270] The reference pixel determining unit is configured to determine, based on the configured multiple reference pixels, a reference pixel whose difference with the lowest pixel satisfies a second set condition as a target reference pixel.

[0271] In an optional implementation, the apparatus may further include:

[0272] a network status obtaining unit, configured to obtain a network connection status of the terminal before the reference pixel determining unit determines the target reference pixel;

[0273] The reference pixel determination unit includes:

[0274] a first pixel determining unit configured to, if the network connection state of the terminal indicates that the terminal is connected to the first type of communication network, determine, based on a plurality of configured reference pixels, a reference pixel that is not less than the lowest pixel and whose difference with the lowest pixel satisfies a first difference condition as a target reference pixel;

[0275] The second pixel determination unit is used to characterize that the terminal is connected to the second type of communication network, such as the network connection status of the terminal. Based on the configured multiple reference pixels, a reference pixel that is smaller than the minimum pixel and whose difference with the minimum pixel meets a second difference condition is determined as a target reference pixel.

[0276] Corresponding to the operation of the image loading method in this application on the server side, this application also provides another image loading device.

[0277] like Figure 12 , which shows a schematic diagram of the composition structure of an embodiment of another image loading device of the present application. The device can be applied to a server, and the device may include:

[0278] A request obtaining unit 1201 is configured to obtain an image request sent by an application of a terminal, the image request carrying a target reference aspect ratio and target reference pixels suitable for a source image requested to be loaded by the application, the target reference aspect ratio and target reference pixels being among multiple reference aspect ratios and multiple reference pixels set by a server;

[0279] The picture determining unit 1202 is configured to determine a target picture having the target reference aspect ratio and target reference pixels from a plurality of candidate pictures corresponding to the source picture, wherein the plurality of candidate pictures are a plurality of different pictures obtained by performing lightweight processing on the source picture according to the plurality of reference aspect ratios and the plurality of reference pixels, wherein the data size of the pictures obtained by the lightweight processing is smaller than the data size of the source picture;

[0280] The image returning unit 1203 is configured to return the target image to the application of the terminal, so that the application loads the target image in the page of the application.

[0281] In a possible implementation, the device may further include:

[0282] a data obtaining unit configured to obtain, before the request obtaining unit obtains the image request sent by the terminal application, the display size and the image pixels of the image respectively reported by the applications of the multiple terminals, wherein the display size is the display size of the image display area for displaying the image on the page of the terminal application, and the display size includes at least the aspect ratio of the image display area;

[0283] A data screening unit is configured to determine, from the obtained picture pixels and aspect ratios of the picture display area, a first number of aspect ratios and a second number of picture pixels with the highest occurrence frequencies;

[0284] a reference determination unit for determining, based on the selected first number of aspect ratios and the first second number of picture pixels, a plurality of reference aspect ratios and a plurality of reference pixels for processing the picture from a plurality of configured candidate reference aspect ratios and a plurality of candidate reference pixels;

[0285] The image processing unit is used to, after obtaining the source image to be added to the database, perform lightweight processing on the source image according to the multiple reference aspect ratios and the multiple reference pixels to obtain multiple candidate images corresponding to the source image, where the reference aspect ratios and reference pixels of the multiple candidate images are not completely the same.

[0286] In yet another possible implementation, the apparatus further includes:

[0287] a coefficient determination unit, configured to determine, for each candidate picture, a frequency combination coefficient of a reference aspect ratio and a reference pixel of the candidate picture, wherein the frequency combination coefficient is a product of an occurrence frequency of the reference aspect ratio of the candidate picture and an occurrence frequency of the reference pixel;

[0288] a level determination unit, configured to determine, for each candidate picture, a target priority level corresponding to the candidate picture according to a frequency combination coefficient corresponding to the candidate picture; wherein the priority level of a candidate picture with a higher frequency combination coefficient is not lower than the priority level of a candidate picture with a lower frequency combination coefficient;

[0289] a storage layer determining unit, configured to store the candidate images in a storage layer corresponding to the target priority layer, wherein a storage layer with a higher priority layer is faster in acquiring images;

[0290] The picture determination unit includes:

[0291] a layer positioning unit, configured to determine a storage layer corresponding to the target reference aspect ratio and the target reference pixel as a target storage layer;

[0292] The image obtaining unit is configured to obtain, from the target storage layer, a target image corresponding to the source image and having the target reference aspect ratio and target reference pixels.

[0293] On the other hand, the present application also provides a computer device, which can be the terminal or server mentioned above, such as Figure 13 , which shows a schematic diagram of the composition architecture of the computer device provided by this application. Figure 13 In the embodiment, the computer device 1300 may include: a processor 1301 and a memory 1302.

[0294] Optionally, the computer device may further include: a communication interface 1303 , an input unit 1304 , a display 1305 , and a communication bus 1306 .

[0295] The processor 1301 , the memory 1302 , the communication interface 1303 , the input unit 1304 and the display 1305 all communicate with each other via a communication bus 1306 .

[0296] In the embodiment of the present application, the processor 1301 may be a central processing unit, an application-specific integrated circuit, etc.

[0297] The processor may call the program stored in the memory 1302 . Specifically, the processor may execute the operations of the computer device or terminal side in the above embodiments.

[0298] The memory 1302 is used to store one or more programs, which may include program codes, and the program codes include computer operating instructions. In an embodiment of the present application, the memory at least stores a picture loading method for implementing any one of the embodiments corresponding to the above terminal or computer device side.

[0299] In one possible implementation, the memory 1302 may include a program storage area and a data storage area, wherein the program storage area may store an operating system, the programs mentioned above, etc.; the data storage area may store data created during the use of the computer device.

[0300] The communication interface 1303 may be an interface of a communication module.

[0301] The present application may further include an input unit 1304 , which may include a touch sensing unit, a keyboard, and the like.

[0302] The display 1305 includes a display panel, such as a touch display panel.

[0303] certainly, Figure 13 The computer device structure shown does not constitute a limitation on the computer device in the embodiment of the present application. In actual applications, the computer device may include Figure 13 More or fewer components than shown, or combinations of certain components.

[0304] On the other hand, the present application also provides a storage medium storing computer-executable instructions. When the computer-executable instructions are loaded and executed by a processor, the image loading method in any of the above embodiments is implemented.

[0305] This application also provides a computer program product or computer program, which includes computer instructions stored in a computer-readable storage medium. A processor of a computer device reads the computer instructions from the computer-readable storage medium and executes the computer instructions, causing the computer device to perform the methods provided in the various optional implementations of the above-mentioned image loading method or image loading apparatus. The specific implementation process can be referred to the description of the corresponding embodiments above and is not repeated here.

[0306] It should be noted that the various embodiments in this specification are described in a progressive manner, and each embodiment focuses on the differences from other embodiments. The same or similar parts between the various embodiments can be referred to each other. At the same time, the features described in the various embodiments in this specification can be replaced or combined with each other, so that professionals in this field can implement or use this application. For device embodiments, since they are basically similar to method embodiments, the description is relatively simple, and the relevant parts can be referred to the partial description of the method embodiment.

[0307] Finally, it should be noted that, in this document, relational terms such as first and second, etc., are used only to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any actual relationship or order between these entities or operations. Moreover, the terms "comprises," "comprising," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or device comprising a series of elements includes not only those elements, but also other elements not explicitly listed, or elements inherent to such process, method, article, or device. In the absence of further limitations, an element defined by the phrase "comprising a ..." does not exclude the presence of additional identical elements in the process, method, article, or device comprising the element.

[0308] The above description of the disclosed embodiments will enable one skilled in the art to implement or use the present invention. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the general principles defined herein may be implemented in other embodiments without departing from the spirit or scope of the present invention. Therefore, the present invention is not limited to the embodiments shown herein, but is to be construed in the widest manner consistent with the principles and novel features disclosed herein.

[0309] The above are only preferred embodiments of the present invention. It should be pointed out that for ordinary technicians in this technical field, several improvements and modifications can be made without departing from the principles of the present invention. These improvements and modifications should also be regarded as the scope of protection of the present invention.

Claims

1. A method for loading an image, characterized in that: include: Determine the source image to be loaded in the application page; Obtaining a display size of a picture display area on the page for displaying the source picture, the display size including: an aspect ratio of the picture display area and screen ratio information of the picture display area; Obtaining screen pixels of a terminal running the application; Based on the configured multiple reference aspect ratios, determining a reference aspect ratio whose distance from the aspect ratio of the image display area meets a first setting condition and is not less than the aspect ratio of the image display area as a target reference aspect ratio; Determining, based on the screen ratio information and the screen pixels, a minimum number of pixels of the image suitable for displaying in the image display area; Based on the configured multiple reference pixels, determining a reference pixel whose difference with the lowest pixel satisfies a second set condition as a target reference pixel; Obtaining a target picture having the target reference aspect ratio and target reference pixels from multiple candidate pictures corresponding to the source picture stored on the server, wherein the multiple candidate pictures are multiple different pictures obtained by the server performing lightweight processing on the source picture according to the multiple reference aspect ratios and the multiple reference pixels, and the data size of the pictures obtained by the lightweight processing is smaller than the data size of the source picture; The target image is loaded in the image display area of the page.

2. The method according to claim 1, characterized in that The step of determining the source image to be loaded in the application page includes: Determine the image address of the source image to be loaded in the application page; Obtaining a target picture having the target reference aspect ratio and target reference pixels from a plurality of candidate pictures corresponding to the source picture stored in the server includes: Adding information of the target reference aspect ratio and the target reference pixels to the picture address to obtain a reconstructed picture address, wherein the reconstructed picture address is used to point to a target picture having the target reference aspect ratio and the target reference pixels among the multiple candidate pictures corresponding to the source picture; Sending the reconstructed picture address to the server, so that the server locates the target picture based on the reconstructed picture address; Obtain the target picture returned by the server based on the reconstructed picture address.

3. The method according to claim 1, characterized in that Before determining, based on the configured multiple reference pixels, a reference pixel whose difference with the lowest pixel satisfies a second set condition as a target reference pixel, the method further includes: Obtaining the network connection status of the terminal; The step of determining, based on the configured multiple reference pixels, a reference pixel whose difference with the lowest pixel satisfies a second set condition as a target reference pixel includes: If the network connection status of the terminal indicates that the terminal is connected to a first type of communication network, based on the configured multiple reference pixels, determine a reference pixel that is not less than the lowest pixel and whose difference with the lowest pixel satisfies a first difference condition as a target reference pixel; If the network connection status of the terminal indicates that the terminal is connected to a second type of communication network, based on the configured multiple reference pixels, a reference pixel that is smaller than the lowest pixel and whose difference with the lowest pixel satisfies a second difference condition is determined as a target reference pixel.

4. A method for loading an image, characterized in that: include: Obtaining an image request sent by an application of the terminal, the image request carrying a target reference aspect ratio and target reference pixels suitable for a source image requested to be loaded by the application, the target reference aspect ratio and target reference pixels being among multiple reference aspect ratios and multiple reference pixels set by the server; The target reference aspect ratio is a reference aspect ratio among the multiple reference aspect ratios, the distance from the aspect ratio of the picture display area for displaying the source picture meeting a first set condition and being not less than the aspect ratio of the picture display area; the target reference pixel is a reference pixel among the multiple reference pixels, the difference from the lowest pixel of the picture suitable for displaying the picture display area meeting a second set condition; the lowest pixel is determined based on the screen ratio information of the picture display area and the screen pixels of the terminal; determining, from a plurality of candidate pictures corresponding to the source picture, a target picture having the target reference aspect ratio and target reference pixels, the plurality of candidate pictures being a plurality of different pictures obtained by performing lightweight processing on the source picture according to the plurality of reference aspect ratios and the plurality of reference pixels, wherein a data volume of the pictures obtained by the lightweight processing is smaller than a data volume of the source picture; The target image is returned to the application of the terminal, so that the application loads the target image in the page of the application.

5. The method according to claim 4, characterized in that Before obtaining the image request sent by the application of the terminal, the method further includes: Obtaining display sizes of pictures and picture pixels of the pictures respectively reported by applications of multiple terminals, wherein the display size is the display size of a picture display area for displaying the picture on a page of the terminal application, and the display size includes at least an aspect ratio of the picture display area; Determining, from the obtained picture pixels and aspect ratios of the picture display area, a first number of aspect ratios and a second number of picture pixels having the highest occurrence frequencies; Determining, based on the selected first number of aspect ratios and the first second number of picture pixels, multiple reference aspect ratios and multiple reference pixels for processing the picture from the configured multiple candidate reference aspect ratios and multiple candidate reference pixels; After obtaining the source image to be added to the database, the source image is lightweight processed according to the multiple reference aspect ratios and multiple reference pixels to obtain multiple candidate images corresponding to the source image, and the reference aspect ratios and reference pixels of the multiple candidate images are not completely the same.

6. The method according to claim 5, characterized in that Also includes: For each candidate picture, determining a frequency combination coefficient of a reference aspect ratio and a reference pixel of the candidate picture, where the frequency combination coefficient is a product of an occurrence frequency of the reference aspect ratio of the candidate picture and an occurrence frequency of the reference pixel; For each candidate picture, determining a target priority level corresponding to the candidate picture according to a frequency combination coefficient corresponding to the candidate picture; wherein the priority level of a candidate picture with a higher frequency combination coefficient is not lower than the priority level of a candidate picture with a lower frequency combination coefficient; Storing the candidate images in a storage layer corresponding to the target priority level, wherein the higher the priority level of the storage layer, the faster the speed of obtaining images; Determining a target picture having the target reference aspect ratio and target reference pixels from multiple candidate pictures corresponding to the source picture includes: Determining a storage layer corresponding to the target reference aspect ratio and the target reference pixel as a target storage layer; A target image corresponding to the source image and having the target reference aspect ratio and target reference pixels is obtained from the target storage layer.

7. A picture loading device, characterized in that: include: A loading determination unit, used to determine the source image to be loaded in the application page; a size obtaining unit, configured to obtain a display size of a picture display area in the page for displaying the source picture, the display size including: an aspect ratio of the picture display area and screen ratio information of the picture display area; A pixel obtaining unit, configured to obtain screen pixels of a terminal running the application; an aspect ratio determining unit for determining, based on a plurality of configured reference aspect ratios, a reference aspect ratio whose distance from the aspect ratio of the image display area satisfies a first set condition and is not less than the aspect ratio of the image display area as a target reference aspect ratio; a minimum pixel determination unit, configured to determine, based on the screen ratio information and the screen pixels, a minimum pixel of the image suitable for displaying in the image display area; a reference pixel determining unit, configured to determine, based on the configured multiple reference pixels, a reference pixel whose difference with the lowest pixel satisfies a second set condition as a target reference pixel; a picture requesting unit, configured to obtain a target picture having the target reference aspect ratio and target reference pixels from a plurality of candidate pictures corresponding to the source picture stored on the server, wherein the plurality of candidate pictures are a plurality of different pictures obtained by the server performing lightweight processing on the source picture according to the plurality of reference aspect ratios and the plurality of reference pixels, and the data size of the pictures obtained by the lightweight processing is smaller than the data size of the source picture; The picture loading unit is used to load the target picture into the picture display area of the page.

8. The device according to claim 7, characterized in that The loading determination unit includes: An address determination unit, configured to determine an image address of a source image to be loaded in a page of an application; The image request unit includes: an address reconstruction unit, configured to add information of the target reference aspect ratio and the target reference pixels to the picture address to obtain a reconstructed picture address, wherein the reconstructed picture address is used to point to a target picture having the target reference aspect ratio and the target reference pixels among the multiple candidate pictures corresponding to the source picture; an address sending unit, configured to send the reconstructed picture address to the server, so that the server locates the target picture based on the reconstructed picture address; The image obtaining unit is configured to obtain the target image returned by the server based on the reconstructed image address.

9. The device according to claim 7, characterized in that The device further comprises: a network status obtaining unit, configured to obtain a network connection status of the terminal before determining, based on the configured multiple reference pixels, a reference pixel whose difference with the lowest pixel satisfies a second set condition as a target reference pixel; The reference pixel determination unit includes: a first pixel determining unit configured to determine, as a target reference pixel, a reference pixel that is not less than the lowest pixel and whose difference with the lowest pixel satisfies a first difference condition based on multiple configured reference pixels, if the network connection state of the terminal indicates that the terminal is connected to the first type of communication network; The second pixel determination unit is used to characterize that the terminal is connected to the second type of communication network as the network connection status of the terminal, and based on the configured multiple reference pixels, determine a reference pixel that is smaller than the minimum pixel and whose difference with the minimum pixel meets a second difference condition as a target reference pixel.

10. A picture loading device, characterized in that: Also includes: a request obtaining unit, configured to obtain an image request sent by an application of a terminal, the image request carrying a target reference aspect ratio and target reference pixels suitable for a source image requested to be loaded by the application, the target reference aspect ratio and target reference pixels being among multiple reference aspect ratios and multiple reference pixels set by a server; The target reference aspect ratio is a reference aspect ratio among the multiple reference aspect ratios, the distance from the aspect ratio of the picture display area for displaying the source picture meeting a first set condition and being not less than the aspect ratio of the picture display area; the target reference pixel is a reference pixel among the multiple reference pixels, the difference from the lowest pixel of the picture suitable for displaying the picture display area meeting a second set condition; the lowest pixel is determined based on the screen ratio information of the picture display area and the screen pixels of the terminal; a picture determination unit, configured to determine a target picture having the target reference aspect ratio and target reference pixels from a plurality of candidate pictures corresponding to the source picture, the plurality of candidate pictures being a plurality of different pictures obtained by performing lightweight processing on the source picture according to the plurality of reference aspect ratios and the plurality of reference pixels, wherein a data volume of the pictures obtained by the lightweight processing is smaller than a data volume of the source picture; The image returning unit is configured to return the target image to the application of the terminal, so that the application loads the target image in the page of the application.

11. The device according to claim 10, characterized in that The device further comprises: a data obtaining unit, configured to obtain, before the request obtaining unit obtains the image request sent by the terminal application, the display size of the image and the image pixels of the image respectively reported by the applications of the multiple terminals, wherein the display size is the display size of the image display area for displaying the image on the page of the terminal application, and the display size at least includes the aspect ratio of the image display area; A data screening unit is configured to determine, from the obtained picture pixels and aspect ratios of the picture display area, a first number of aspect ratios and a second number of picture pixels with the highest occurrence frequencies; a reference determination unit for determining, based on the selected first number of aspect ratios and the first second number of picture pixels, a plurality of reference aspect ratios and a plurality of reference pixels for processing the picture from a plurality of configured candidate reference aspect ratios and a plurality of candidate reference pixels; The image processing unit is used to, after obtaining the source image to be added to the database, perform lightweight processing on the source image according to the multiple reference aspect ratios and the multiple reference pixels to obtain multiple candidate images corresponding to the source image, where the reference aspect ratios and reference pixels of the multiple candidate images are not completely the same.

12. The device according to claim 11, characterized in that Also includes: a coefficient determination unit, configured to determine, for each candidate picture, a frequency combination coefficient of a reference aspect ratio and a reference pixel of the candidate picture, wherein the frequency combination coefficient is a product of an occurrence frequency of the reference aspect ratio of the candidate picture and an occurrence frequency of the reference pixel; a level determination unit, configured to determine, for each candidate picture, a target priority level corresponding to the candidate picture according to a frequency combination coefficient corresponding to the candidate picture; wherein the priority level of a candidate picture with a higher frequency combination coefficient is not lower than the priority level of a candidate picture with a lower frequency combination coefficient; a storage layer determining unit, configured to store the candidate images in a storage layer corresponding to the target priority layer, wherein a storage layer with a higher priority layer is faster in acquiring images; The picture determination unit includes: a layer positioning unit, configured to determine a storage layer corresponding to the target reference aspect ratio and the target reference pixel as a target storage layer; The image obtaining unit is configured to obtain, from the target storage layer, a target image corresponding to the source image and having the target reference aspect ratio and target reference pixels.

13. A computer-readable storage medium, characterized in that Used to store a program, which, when executed, is used to implement the image loading method as described in any one of claims 1 to 3, or claims 4 to 6.

14. A computer device, characterized in that: including memory and processor; Wherein, the memory is used to store programs; The processor is used to execute the program, and when the program is executed, it is specifically used to implement the image loading method described in any one of claims 1 to 3, or claims 4 to 6.

15. A computer program product, characterized in that The method comprises computer instructions, which are stored in a computer-readable storage medium; a processor of a computer device reads the computer instructions from the computer-readable storage medium, and the processor executes the computer instructions, so that the computer device executes the image loading method as described in any one of claims 1 to 3, or claims 4 to 6.

Citation Information

Patent Citations

  • Picture loading method and device, terminal and computer readable storage medium

    CN109918592A