There are some tips and tricks, that I discovered while creating our web page:

1. It is better not to use cookies, if possible. And better use less Javascript. I used cookies in the following code to save a number of the current image. Then I took this number and tried to load a fresh image when user enters to the cite after a while.
   ————————————————————————————–
   
var currentN=0;
currentN = get_cookie("currentN");
//alert("Read currentN = " + currentN.toString());  

   function changecenterimg(img_name)
{
var N = getRandomArbitary(1, 4);
N = Number(currentN) + Number(1);

   while(N == currentN)
{
N = getRandomArbitary(1, 4);
}

   if (N != currentN)
{
currentN = N;
var img_src = 'images/c'+ N.toString() + '.jpg';
document[img_name].src=img_src;
}
set_cookie("currentN", currentN);
//alert("Set currentN = " + currentN.toString());
}

   function init()
{
//alert("init started");
changecenterimg('centerimg');
}

   function set_cookie ( cookie_name, cookie_value )
{
document.cookie = "currentN=" + currentN.toString();
}

   function get_cookie ( cookie_name )
{
var cookie_string = document.cookie ;
if (cookie_string.length != 0) {
var cookie_value = cookie_string.match (
'(^|;)[\s]*' +
cookie_name +
'=([^;]*)' );
return decodeURIComponent ( cookie_value[2] ) ;
}
   ————————————————————————————–

   And I understood after some time, that this code was seriously lowering web page loading. After this I tried to change center image loading process to the following:

   ————————————————————————————–
   
function changecenterimg(img_name)
{
N = Number(currentN) + Number(1);
if (N > 4)
{
N = 1;
}
currentN = N;
var img_src = 'images/c'+ N.toString() + '.jpg';
document[img_name].src=img_src;
}
   ————————————————————————————–

   Less Javascript we have – faster the page loads. Also I removed infinite cycle in generating new random image number. Although this cycle didn’t work more than two times. It’s noteworthy that in Javascript to make a sum of two numbers we should write:

   ————————————————————————————–
   
N = Number(currentN) + Number(1);
   ————————————————————————————–

   Because if we write just

   ————————————————————————————–
   
N = currentN + 1;
   ————————————————————————————–

   we will get concatenation of strings, so that for example N will become 11 after 1+1.




2. Images can be optimized to be smaller in size and unfortunately in quality. The following link was very useful for this purpose: http://tools.dynamicdrive.com/imageoptimizer/index.php I managed to make my images more than two times smaller from 24 kbyte to 10 kbyte




3. Try to avoid reloading whole page and try to reload or change only some elements. For example, I was reloading page to refresh image after user clicks on it:

   ————————————————————————————–
   <div id="center-column">  

   <a href="index.html">

   <img src="#" alt="Image" width="350" height="250" />

   </a>

   </div>

   ————————————————————————————–

   I changed this to the following to reload only one image:

   ————————————————————————————–
   <div id="center-column">

   <a href="javascript:changecenterimg('centerimg');">

   <img name="centerimg" src="#" alt="Image" width="350" height="250">

   </a>

   </div>
   ————————————————————————————–