Image Optimization

• US 20120194519A1
• Filed: 01/25/2012
• Published: 08/02/2012
• Est. Priority Date: 01/28/2011
• Status: Active Grant

• Current Assignee: Radware Limited
• Original Assignee: Strangeloop Networks, Inc. (Radware Limited)
• Inventors: Alstad, Kent, Benna, Michael R., Bissell, Shawn
• Granted Patent: US 9,542,501 B2
• Time in Patent Office: Days
• US Class Current: 345/428
• CPC Class Codes: G06F 16/9577 Optimising the visualization of content, e.g. distillation of HTML documents

Abstract

Viewing of web pages is improved by prioritizing image rendering based on positioning of images within a web page. For example, for images that are likely to be initially viewable upon presentation of the web page (i.e., prior to scrolling), compressed proxy versions are made available so that the images can be transferred and rendered more quickly. These compressed proxy images are later replaced with better quality renderings of the same images. Fetching of images that are not initially visible can be deferred until after other, more important page resources are loaded. Prioritization of page loading in this manner helps to ensure that the page becomes operational earlier, resulting in improved perceived speed and responsiveness, and greater ease of navigation.

Claims

1. A computer-implemented method for presenting content in a client/server environment, comprising:

at a proxy device communicatively coupled to a client and a server via a communications network, performing the steps of;

intercepting a content item being transmitted from the server to the client;

identifying a plurality of resource references in the content item, each resource reference corresponding to a resource;

identifying at least a subset of the resources as being likely to be included within an initially viewable portion of the content item to be presented on an output device prior to presentation of at least one other resource in the content item;

for each of the resources identified as being likely to be included within the initially viewable portion of the content item;

retrieving an original version of the resource;

generating a proxy resource from the original version of the resource;

storing the generated proxy resource; and

modifying the content item to provide the generated proxy resource to the client; and

transmitting the modified content item to the client.

2. The method of claim 1, wherein:

the content item comprises a web page;

each resource comprises an image associated with a position in the web page; and

each proxy resource comprises a proxy image.

3. The method of claim 2, wherein generating a proxy image from an original version of an image comprises generating a version of the image that is of lower resolution than the original version of the image.

4. The method of claim 2, wherein generating a proxy image from an original version of an image comprises compressing the image to generate a version of the image that is of lower resolution than the original version of the image.

5. The method of claim 2, wherein generating a proxy image from an original version of an image comprises applying progressive compression to generate a version of the image that is of lower resolution than the original version of the image.

6. The method of claim 2, wherein generating a proxy image from an original version of an image comprises generating a version of the image that is smaller than the original version of the image.

7. The method of claim 2, wherein identifying at least a subset of the images as being likely to be included within an initially viewable portion of the web page comprises:

determining a display area size;

identifying a region of the web page corresponding to the display area size; and

identifying images associated with positions within the identified region of the web page.

8. The method of claim 7, wherein determining a display area size comprises determining a size of a window on a display screen.

9. The method of claim 7, wherein determining a display area size comprises determining a size based on at least one characteristic of an output device associated with the client.

10. The method of claim 7, wherein determining a display area size comprises determining a size based on a standardized size.

11. The method of claim 7, wherein determining a display area size comprises:

causing a script to return data specifying the size of a display area; and

receiving data generated by the script.

12. The method of claim 2, wherein:

the client is configured to provide an interactive scrolling ability in response to user input; and

identifying at least a subset of the images as being likely to be included within an initially viewable portion of the web page comprises identifying at least a subset of the images as being likely to be included within a portion of the web page prior to performing any scrolling.

13. The method of claim 1, wherein modifying the content item to provide the generated proxy resource to the client comprises replacing the resource reference corresponding to the resource with a modified resource reference corresponding to the stored generated proxy resource.

14. The method of claim 1, wherein modifying the content item to provide the generated proxy resource to the client comprises including the modified resource in-line within the content item.

15. The method of claim 1, wherein modifying the content item to provide the generated proxy resource to the client comprises including the modified resource in a package with at least one object associated with the content item.

16. The method of claim 1, further comprising, at the proxy device:

prior to transmitting the modified content item to the client, further modifying the content item to include a script configured to cause the client to issue a deferred request for at least one original version of at least one of the resources.

17. The method of claim 16, further comprising, at the proxy device:

generating at least one additional, intermediate-level proxy resource from the original version of the resource;

and wherein further modifying the content item to include a script comprises modifying the content item to include a script configured to cause the client to issue a sequence of deferred requests for successively higher-resolution versions of the resource.

18. The method of claim 1, wherein transmitting the modified content item to the client comprises transmitting the modified content item to the client in at least two parts.

19. The method of claim 1, wherein generating a proxy resource from an original version of a resource comprises applying compression to the original version of the resource.

20. The method of claim 1, further comprising, at the proxy device:

generating at least one additional, intermediate-level proxy resource from the original version of the resource;

responsive to a request from the client, providing the intermediate-level proxy resource.

21. The method of claim 1, wherein the client is configured to provide an interactive scrolling ability in response to user input, the method further comprising:

transmitting a script to cause the client to perform the steps of;

detecting a scrolling operation causing at least one additional resource to be within a viewable region on the output device; and

responsive to the detected scrolling operation;

retrieving the at least one additional resource; and

displaying the retrieved at least one additional resource on the display device.

22. A computer program product for presenting content in a client/server environment, comprising:

a non-transitory computer-readable storage medium; and

computer program code, encoded on the medium, configured to cause at least one processor at a proxy device communicatively coupled to a client and a server via a communications network to perform the steps of;

intercepting a content item being transmitted from the server to the client;

identifying a plurality of resource references in the content item, each resource reference corresponding to a resource;

identifying at least a subset of the resources as being likely to be included within an initially viewable portion of the content item to be presented on an output device prior to presentation of at least one other resource in the content item;

for each of the resources identified as being likely to be included within the initially viewable portion of the content item;

retrieving an original version of the resource;

generating a proxy resource from the original version of the resource;

storing the generated proxy resource; and

modifying the content item to provide the generated proxy resource to the client; and

transmitting the modified content item to the client.

23. The computer program product of claim 22, wherein:

the content item comprises a web page;

each resource comprises an image associated with a position in the web page; and

each proxy resource comprises a proxy image.

24. The computer program product of claim 23, wherein the computer program code configured to cause at least one processor to generate a proxy image from an original version of an image comprises computer program code configured to cause at least one processor to generate a version of the image that is of lower resolution than the original version of the image.

25. The computer program product of claim 23, wherein the computer program code configured to cause at least one processor to identify at least a subset of the images as being likely to be included within an initially viewable portion of the web page comprises computer program code configured to cause at least one processor to perform the steps of:

determining a display area size;

identifying a region of the web page corresponding to the display area size; and

identifying images associated with positions within the identified region of the web page.

26. The computer program product of claim 25, wherein the computer program code configured to cause at least one processor to determine a display area size comprises computer program code configured to cause at least one processor to perform the steps of:

causing a script to return data specifying the size of a display area; and

receiving data generated by the script.

27. The computer program product of claim 23, wherein:

the client is configured to provide an interactive scrolling ability in response to user input; and

computer program code configured to cause at least one processor to identify at least a subset of the images as being likely to be included within an initially viewable portion of the web page comprises computer program code configured to cause at least one processor to identify at least a subset of the images as being likely to be included within a portion of the web page prior to performing any scrolling.

28. The computer program product of claim 22, wherein the computer program code configured to cause at least one processor to modify the content item to provide the generated proxy resource to the client comprises computer program code configured to cause at least one processor to replace the resource reference corresponding to the resource with a modified resource reference corresponding to the stored generated proxy resource.

29. The computer program product of claim 22, wherein the computer program code configured to cause at least one processor to modify the content item to provide the generated proxy resource to the client comprises computer program code configured to cause at least one processor to include the modified resource in-line within the content item.

30. The computer program product of claim 22, further comprising computer program code configured to cause at least one processor at the proxy device to perform the step of:

prior to transmitting the modified content item to the client, further modifying the content item to include a script configured to cause the client to issue a deferred request for at least one original version of at least one of the resources.

31. The computer program product of claim 22, wherein the client is configured to provide an interactive scrolling ability in response to user input, the computer program product further comprising computer program code configured to cause at least one processor at the proxy device to transmit a script to cause the client to perform the steps of:

detecting a scrolling operation causing at least one additional resource to be within a viewable region on the output device; and

responsive to the detected scrolling operation;

retrieving the at least one additional resource; and

displaying the retrieved at least one additional resource on the display device.

32. A system for presenting content in a client/server environment, comprising:

a client machine, communicatively coupled to a computing network;

a server, communicatively coupled to the computing network;

a storage device;

a proxy device, communicatively coupled to the computing network and to the storage device, the proxy device configured to perform the steps of;

intercepting a content item being transmitted from the server to the client;

identifying a plurality of resource references in the content item, each resource reference corresponding to a resource;

identifying at least a subset of the resources as being likely to be included within an initially viewable portion of the content item to be presented on an output device prior to presentation of at least one other resource in the content item;

for each of the resources identified as being likely to be included within the initially viewable portion of the content item;

retrieving an original version of the resource;

generating a proxy resource from the original version of the resource;

causing the storage device to store the generated proxy resource; and

modifying the content item to provide the generated proxy resource to the client; and

transmitting the modified content item to the client.

33. The system of claim 32, wherein:

the content item comprises a web page;

each resource comprises an image associated with a position in the web page; and

each proxy resource comprises a proxy image.

34. The system of claim 33, wherein the proxy device generates a proxy image from an original version of an image by generating a version of the image that is of lower resolution than the original version of the image.

35. The system of claim 33, wherein the proxy device identifies at least a subset of the images as being likely to be included within an initially viewable portion of the web page by performing the steps of:

determining a display area size;

identifying a region of the web page corresponding to the display area size; and

identifying images associated with positions within the identified region of the web page.

36. The system of claim 35, wherein the proxy device determines a display area size by performing the steps of:

causing a script to return data specifying the size of a display area; and

receiving data generated by the script.

37. The system of claim 33, wherein:

the client is configured to provide an interactive scrolling ability in response to user input; and

computer program code configured to cause at least one processor to identify at least a subset of the images as being likely to be included within an initially viewable portion of the web page comprises computer program code configured to cause at least one processor to identify at least a subset of the images as being likely to be included within a portion of the web page prior to performing any scrolling.

38. The system of claim 32, wherein the computer program code configured to cause at least one processor to modify the content item to provide the generated proxy resource to the client comprises computer program code configured to cause at least one processor to replace the resource reference corresponding to the resource with a modified resource reference corresponding to the stored generated proxy resource.

39. The system of claim 32, wherein the computer program code configured to cause at least one processor to modify the content item to provide the generated proxy resource to the client comprises computer program code configured to cause at least one processor to include the modified resource in-line within the content item.

40. The system of claim 32, further comprising computer program code configured to cause at least one processor at the proxy device to perform the step of:

prior to transmitting the modified content item to the client, further modifying the content item to include a script configured to cause the client to issue a deferred request for at least one original version of at least one of the resources.

41. The system of claim 32, wherein the client is configured to provide an interactive scrolling ability in response to user input, and wherein the proxy device is further configured to transmit a script to cause the client to perform the steps of:

detecting a scrolling operation causing at least one additional resource to be within a viewable region on the output device; and

responsive to the detected scrolling operation;

retrieving the at least one additional resource; and

displaying the retrieved at least one additional resource on the display device.