Normally, when a JS script is included via HTML, the browser stops until it has interpreted the script, and only then does it continue with the rest of the HTML file.
This may slow the loading of the page enough for the user to be inconvenienced, especially if the script in question is very large or includes long and involved operations.
A first 'trick' to improve the perception of the page's loading time is to include the script at the end of
<body> rather than in the
This permits most pages to load prior to starting to run the script.
IThe reason that browsers block in order to run scripts is to avoid situations of conflict between two scripts (race conditions), where one script executes before (or simultaneously) another, potentially causing errors. This fact must be borne in mind when using this technique.
<script> and include it in the HTML page:
We create a function called loadScript which takes two arguments: a string containing the address of the file to be loaded (mandatory) and a function (optional) to execute as soon as the script has loaded and executed.
The first thing the function does is create an HTML element
<script> with the file address as source. After this, if a function has been supplied as a second argument, it is assigned to the onload property of the tag.
Finally, the script is included at the end of the
<head> element of our HTML file.
Simple, but effective!
If a webpage contains a lot of images of a bulky size, despite the rapid download rates of broadband, there are a number of good reasons to manage their download. A basic technique is preloading hidden images so they are ready for the application which is launched by the user. An example of this would be a slideshow.
This avoids delays which would occur if the page only downloads the images at the time they are called by the browser to load.
Used well, this technique can also avoid multiple loadings of bulky items. The cache retains the downloaded items, even when the page is left, and makes them available when the visitor returns to the page. Good web design aims to enhance the experience of the user as much as possible, and this is a technique which aids in achieving that objective.
Furthermore, in some cases, the preloading of images is essential for the proper function of the page, as we shall now see.
Usually, however, more than a single image is loaded. To load a list of images we run the following script:
Here we have put the code to preload the images in a function called preload. Then we use a loop to call that function for each element in the image list.
Content © Renewable.Media. All rights reserved. Created : March 2, 2014 Last updated :March 7, 2016
The most recent article is:
View this item in the topic:
and many more articles in the subject:
Science resources on ScienceLibrary.info. Games, puzzles, enigmas, internet resources, science fiction and fact, the weird and the wonderful things about the natural world. Have fun while learning Science with ScienceLibrary.info.
1822 - 1884
Gregor Mendel is known as 'the Father of Modern Genetics' published his work, Versuche über Pflanzenhybriden [Experiments on Plant Hybridization], on hereditary traits of peas, in 1866. The insight of his work became apparent later when the science of genetics confirmed his findings.
Growth is one of the stupidest purposes ever invented by any culture. We've got to have an enough. We have got to ask growth for what, and why, for whom, and who pays the cost, and how long can it last, and what's the cost to the planet, and how much is enough?
Website © renewable-media.com | Designed by: Andrew Bone