METHODS FOR BUNDLING IMAGES AND DEVICES THEREOF

• US 20150019688A1
• Filed: 07/09/2013
• Published: 01/15/2015
• Est. Priority Date: 07/09/2013
• Status: Active Grant

• Current Assignee: Usablenet Incorporated
• Original Assignee: Usablenet Incorporated
• Inventors: Scoda, Enrico
• Granted Patent: US 10,116,726 B2
• Time in Patent Office: Days
• US Class Current: 709/219
• CPC Class Codes: G06F 16/9574 of access to content, e.g. by caching
• CPC Class Codes: H04L 67/02 based on web technology, e.g. hypertext transfer protocol [HTTP]

Abstract

A method, non-transitory computer readable medium, and web server device that obtains a web page comprising a plurality of image elements each including a source attribute having a value identifying an image. Each of the image elements is modified to insert a data attribute having a value of the respective source attribute value and to replace the source attribute value with a data URI. A reference to a executable file is inserted into the web page. The web page is sent to the client device and a request from the client device for the executable file is received. The executable file is sent to the client device and is configured when executed to replace the source attribute value of each of the image elements with a data URI of an image identified by the respective data attribute value.

Claims

1. A method for bundling images, the method comprising:

obtaining, with a web server, a web page requested by a client device, the web page comprising a plurality of image elements each including a source attribute having a value identifying an image;

modifying, with the web server, each of the plurality of image elements to insert a data attribute having a value of the respective source attribute value and to replace the source attribute value with a data uniform resource indicator (URI);

inserting, with the web server, a reference to an executable file into the requested web page, sending the requested web page to the client device, and receiving a request from the client device for the executable file; and

sending, with the web server, the executable file to the client device in response to the request, the executable file configured when executed to replace the source attribute value of each of the plurality of image elements with a data URI of an image identified by the respective data attribute value.

2. The method of claim 1, wherein the source attribute value of each of the plurality of image elements is replaced with a data URI of a spacer graphic interchange format (GIF) transparent image.

3. The method of claim 1, wherein the source attribute of one or more of the image elements has a value identifying a different directory than one or more other of the plurality of image elements and the reference to the executable file comprises a reference to a different executable file for each directory.

4. The method of claim 1, wherein the reference identifies the executable file based on a directory identified by the value of the source attribute included in the plurality of image elements and contents of a version file in the directory, the contents including at least a portion of a file name of the executable file.

5. The method of claim 1, wherein the reference to the executable file is a script element or a jQuery function call, the script element comprising a source attribute with a value identifying the executable file.

6. The method of claim 1, wherein the sending the executable file further comprises:

extracting at least a directory and a file name from a path included in the request received from the client device for the executable file;

determining whether the executable file is stored in the directory based on the file name; and

generating and storing the executable file, when it is determined that the executable file is not stored in the directory, the generating the executable file further comprising generating a data URI for each image in the directory.

7. The method of claim 6, wherein the generating the executable file further comprises generating a data URI for a cascading style sheet (CSS) background image stored in the directory and the executable file is further configured to, when executed by the client device, insert a style element into the web page, the style element including the data URI of the CSS background image.

8. A non-transitory computer readable medium having stored thereon instructions for bundling images comprising machine executable code which when executed by a processor, causes the processor to perform steps comprising:

obtaining a web page requested by a client device, the web page comprising a plurality of image elements each including a source attribute having a value identifying an image;

modifying each of the plurality of image elements to insert a data attribute having a value of the respective source attribute value and to replace the source attribute value with a data uniform resource indicator (URI);

inserting a reference to a executable file into the requested web page, sending the requested web page to the client device, and receiving a request from the client device for the executable file; and

sending the executable file to the client device in response to the request, the executable file configured when executed to replace the source attribute value of each of the plurality of image elements with a data URI of an image identified by the respective data attribute value.

9. The medium of claim 8, wherein the source attribute value of each of the plurality of image elements is replaced with a data URI of a spacer graphic interchange format (GIF) transparent image.

10. The medium of claim 8, wherein the source attribute of one or more of the image elements has a value identifying a different directory than one or more other of the plurality of image elements and the reference to the executable file comprises a reference to a different executable file for each directory.

11. The medium of claim 8, wherein the reference identifies the executable file based on a directory identified by the value of the source attribute included in the plurality of image elements and contents of a version file in the directory, the contents including at least a portion of a file name of the executable file.

12. The medium of claim 8, wherein the reference to the executable file is a script element or a jQuery function call, the script element comprising a source attribute with a value identifying the executable file.

13. The medium of claim 8, wherein the sending the executable file further comprises:

extracting at least a directory and a file name from a path included in the request received from the client device for the executable file;

determining whether the executable file is stored in the directory based on the file name; and

generating and storing the executable file, when it is determined that the executable file is not stored in the directory.

14. The medium of claim 13, wherein the generating the executable file further comprises generating a data URI for a cascading style sheet (CSS) background image stored in the directory and the executable file is further configured to, when executed by the client device, insert a style element into the web page, the style element including the data URI of the CSS background image.

15. A web server device, comprising:

a processor coupled to a memory and configured to execute programmed instructions stored in the memory comprising;

obtaining a web page requested by a client device, the web page comprising a plurality of image elements each including a source attribute having a value identifying an image;

modifying each of the plurality of image elements to insert a data attribute having a value of the respective source attribute value and to replace the source attribute value with a data uniform resource indicator (URI);

inserting a reference to a executable file into the requested web page, sending the requested web page to the client device, and receiving a request from the client device for the executable file; and

sending the executable file to the client device in response to the request, the executable file configured when executed to replace the source attribute value of each of the plurality of image elements with a data URI of an image identified by the respective data attribute value.

16. The device of claim 15, wherein the source attribute value of each of the plurality of image elements is replaced with a data URI of a spacer graphic interchange format (GIF) transparent image.

17. The device of claim 15, wherein the source attribute of one or more of the image elements has a value identifying a different directory than one or more other of the plurality of image elements and the reference to the executable file comprises a reference to a different executable file for each directory.

18. The device of claim 15, wherein the reference identifies the executable file based on a directory identified by the value of the source attribute included in the plurality of image elements and contents of a version file in the directory, the contents including at least a portion of a file name of the executable file.

19. The device of claim 15, wherein the reference to the executable file is a script element or a jQuery function call, the script element comprising a source attribute with a value identifying the executable file.

20. The device of claim 15, wherein the sending the executable file further comprises:

extracting at least a directory and a file name from a path included in the request received from the client device for the executable file;

determining whether the executable file is stored in the directory based on the file name; and

generating and storing the executable file, when it is determined that the executable file is not stored in the directory.

21. The device of claim 20, wherein the generating the executable file further comprises generating a data URI for a cascading style sheet (CSS) background image stored in the directory and the executable file is further configured to, when executed by the client device, insert a style element into the web page, the style element including the data URI of the CSS background image.