Image caching with html, JAVA Programming

Assignment Help:

In the airplane program, you may have noticed that the loading of each image appears to be jerky, erratic, or slow, and that the URL for each image flickers in the status bar each time the image changes. This happens because JavaScript does not save a copy of the image in memory that can be used whenever necessary. Instead, each time a different image is loaded by an element, JavaScript must open or reopen the image from its source. You probably accessed the airplane image files directly from the Data Disk on your local computer, and if you have a particularly fast computer, you may not have noticed a loading problem. If you did notice erratic loading of the images, then you can imagine how erratic and slow the animation would appear if you had to download the images from the Web server each time they are loaded. A technique for eliminating multiple downloads of the same file is called image caching. Image caching temporarily stores image files in memory on a local computer. This technique allows JavaScript to store and retrieve an image from memory rather than download the image each time it is needed.

Images are cached using the Image() constructor of the Image object. The Image() constructor creates a new Image object. There are three steps for caching an image in JavaScript:

1. Create a new object using the Image() constructor.

2. Assign a graphic file to the src property of the new Image object.

3. Assign the src property of the new Image object to the src property of an element.

In the following code, the src attribute of the element named myImage is initially set to an empty string "". In the script section, a new Image object named newImage is created. The newImage object is used to save and access the memory cache containing the image file. A file named graphic.jpg is assigned to the src property of the newImage object. The src property of the newImage object is then assigned to the src property of the element.

Be sure to understand that in the preceding code, the graphic.jpg file is not assigned directly to the src property of the element. Instead, the newImage object is assigned to the src property of the element. If you assigned the graphic.jpg file directly to the src property of the element using the statement document.myImage.src = "graphic.jpg";, then the file would reload from its source each time it was needed. The newImage object opens the file once and saves it to a memory cache.

The following code shows a version of the unicycle animation code modified to use image caching. The lines that add each image file to the unicycle[] array have been replaced by a for loop, which assigns a new object to each element of the unicycle[] array until the loadImages variable is greater than the length of the array. In the while loop, each object in the unicycle[] array is assigned an image file using the src property. In the turn() function, the unicycle[curUnicycle] operator in the statement document.images[0].src = unicycle [curUnicycle]; now includes the src property so that the statement reads document.images.


Related Discussions:- Image caching with html

Ajax- html- xml- css and tomcat used in java, AJAX- HTML- XML- CSS and  To...

AJAX- HTML- XML- CSS and  Tomcat used in Java: Project Title: Zee Ads   Role                       : Developer Domain                  : Web Ads Environment

Test plan & white box plan, i would like to ask if you have someone able to...

i would like to ask if you have someone able to do test plan & white box plan for the game 2048. Game already developed and tested (unit test only ). this task developed using the

Write a program in javascript that will read in an xml file, Write a progra...

Write a program in Javascript that will read in an XML file. This file will contain details of devices maintained by the IT department of an organisation including an ID number, de

Need to code using java in netbeans for my dissertation, I need to code usi...

I need to code using java in netbeans for my dissertation which is in data mining domain...deals with privacy preserving of sensitive rules or items using association rule hiding

Decode the code, By pressing ‘6’ (i.e. key’6’ one time) on the keypad, the ...

By pressing ‘6’ (i.e. key’6’ one time) on the keypad, the mobile shows ‘m’ on display screen in write text message area

The tic-tac-toe program, Instructions Modify the program so that the co...

Instructions Modify the program so that the computer will generate moves for the ‘O' player (it must continue to accept user input for ‘X'). A simple way to do this is to use a

Java assignment, Java Project Introduction: In this project, you will ex...

Java Project Introduction: In this project, you will explore a few sorting algorithms. You will also test their efficiency by both timing how long a given sorting operation take

Http tunneling and rmi calls across firewalls , RMI transport layer usually...

RMI transport layer usually opens direct sockets to the server. Several Intranets have firewalls that do not accept this. To get through the firewall an RMI call may be embedded wi

Diffentiate local and global variables, Diffentiate Local and Global Variab...

Diffentiate Local and Global Variables? Local or function level variable effective just in the function in that they are declared although global variables visible everywhere o

Conditional Execute, Write a program that prompts for two people’s birthday...

Write a program that prompts for two people’s birthdays (month and day), along with today’s month and day. The program should figure out how many days remain until each user’s birt

Write Your Message!

Captcha
Free Assignment Quote

Assured A++ Grade

Get guaranteed satisfaction & time on delivery in every assignment order you paid with us! We ensure premium quality solution document along with free turntin report!

All rights reserved! Copyrights ©2019-2020 ExpertsMind IT Educational Pvt Ltd