Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Code Performance Issue

Reply
Thread Tools

Code Performance Issue

 
 
Martin
Guest
Posts: n/a
 
      02-13-2004
Hi Guys,

I am a bit of a JavaScript rookie, so please bear with me ....

Some time ago, I asked for help with some code to populate a drop down
country box based on a value I was returning from a popup menu.

This is all now working fine (Thanks !) but I have noticed, it
unfortunately does not scale well, and is causing quite some delay
[approx 5 - 10 secs] between the user hitting 'go', and the country
being writing back to the drop down in the calling window.

I have been trying to re-write the code, but have not been able
achieve efficiency and get the code working correctly.

Does anyone have any ideas I might try to shave those seconds off, and
get back to a near instantanious results not matter how many countries
are in the drop down list?

All suggestions welcome, and much appreciated.

Thanks guys,
Martin


Example Code
************

<html>
<body>

<script>function Goodbye()
{
for (var i = 0; i <
document.DefaultFormName.IgsPePersonAddrCountry.le ngth; i++)
{
if (document.DefaultFormName.IgsPePersonAddrCountry.o ptions[i].value.match(document.InputForm.countrycode.value) )
{
document.DefaultFormName.IgsPePersonAddrCountry.se lectedIndex =
i;
break;
}
}
}
</script>
<p>Example Code</p>
<p>Child Form : Window Spawned from Parent</p>
<form name ="InputForm">
<table>
<tr>
<td>
<input type="text" name="countrycode"></td><td> e.g. GB or US
</td>
</tr>
<tr>
<td>
<input type="button" value="Go!" onclick="javascript:Goodbye(); return
false;"></a>
</td>
</tr>
</table>
</form>
<hr>
<p>Parent Form</p>
<form name ="DefaultFormName">
<table>
<tr>
<td vAlign=top noWrap>
<SELECT id=IgsPePersonAddrCountry title=Country onchange=""
name=IgsPePersonAddrCountry>
<OPTION value="" selected></OPTION><OPTION
value=AF>Afghanistan</OPTION><OPTION
value=AL>Albania</OPTION><OPTION
value=DZ>Algeria</OPTION><OPTION value=AS>American
Samoa</OPTION><OPTION
value=AD>Andorra</OPTION><OPTION
value=AO>Angola</OPTION><OPTION
value=AI>Anguilla</OPTION><OPTION
value=AQ>Antarctica</OPTION><OPTION
value=AG>Antigua and
Barbuda</OPTION><OPTION
value=AR>Argentina</OPTION><OPTION
value=AM>Armenia</OPTION><OPTION
value=AW>Aruba</OPTION><OPTION
value=AU>Australia</OPTION><OPTION
value=AT>Austria</OPTION><OPTION
value=AZ>Azerbaijan</OPTION><OPTION
value=BS>Bahamas</OPTION><OPTION
value=BH>Bahrain</OPTION><OPTION
value=BD>Bangladesh</OPTION><OPTION
value=BB>Barbados</OPTION><OPTION
value=BY>Belarus</OPTION><OPTION
value=BE>Belgium</OPTION><OPTION
value=BZ>Belize</OPTION><OPTION
value=BJ>Benin</OPTION><OPTION
value=BM>Bermuda</OPTION><OPTION
value=BT>Bhutan</OPTION><OPTION
value=BO>Bolivia</OPTION><OPTION value=BA>Bosnia
and
Herzegovina</OPTION><OPTION
value=BW>Botswana</OPTION><OPTION value=BV>Bouvet
Island</OPTION><OPTION
value=BR>Brazil</OPTION><OPTION
value=IO>British Indian Ocean
Territory</OPTION><OPTION
value=BN>Brunei Darussalam</OPTION><OPTION
value=BG>Bulgaria</OPTION><OPTION value=BF>Burkina
Faso</OPTION><OPTION
value=BI>Burundi</OPTION><OPTION
value=KH>Cambodia</OPTION><OPTION
value=CM>Cameroon</OPTION><OPTION
value=CA>Canada</OPTION><OPTION value=CV>Cape
Verde</OPTION><OPTION
value=XC>Catalonia</OPTION><OPTION
value=KY>Cayman Islands</OPTION><OPTION
value=CF>Central
African Republic</OPTION><OPTION
value=TD>Chad</OPTION><OPTION
value=CL>Chile</OPTION><OPTION
value=CN>China</OPTION><OPTION value=CX>Christmas
Island</OPTION><OPTION value=CC>Cocos (Keeling)
Islands</OPTION><OPTION
value=CO>Colombia</OPTION><OPTION
value=KM>Comoros</OPTION><OPTION
value=CG>Congo</OPTION><OPTION value=CD>Congo, The
Democratic Republic of the</OPTION><OPTION
value=CK>Cook
Islands</OPTION><OPTION value=CR>Costa
Rica</OPTION><OPTION
value=CI>Cote d'Ivoire</OPTION><OPTION
value=HR>Croatia</OPTION><OPTION
value=CU>Cuba</OPTION><OPTION
value=CY>Cyprus</OPTION><OPTION value=CZ>Czech
Republic</OPTION><OPTION
value=DK>Denmark</OPTION><OPTION
value=DJ>Djibouti</OPTION><OPTION
value=DM>Dominica</OPTION><OPTION
value=DO>Dominican
Republic</OPTION><OPTION value=TP>East
Timor</OPTION><OPTION
value=EC>Ecuador</OPTION><OPTION
value=EG>Egypt</OPTION><OPTION value=SV>El
Salvador</OPTION><OPTION value=GQ>Equatorial
Guinea</OPTION><OPTION
value=ER>Eritrea</OPTION><OPTION
value=EE>Estonia</OPTION><OPTION
value=ET>Ethiopia</OPTION><OPTION
value=FK>Falkland Islands
(Malvinas)</OPTION><OPTION value=FO>Faroe
Islands</OPTION><OPTION
value=FJ>Fiji</OPTION><OPTION
value=FI>Finland</OPTION><OPTION
value=FR>France</OPTION><OPTION value=GF>French
Guiana</OPTION><OPTION value=PF>French
Polynesia</OPTION><OPTION value=TF>French Southern
Territories</OPTION><OPTION
value=GA>Gabon</OPTION><OPTION
value=GM>Gambia</OPTION><OPTION
value=GE>Georgia</OPTION><OPTION
value=DE>Germany</OPTION><OPTION
value=GH>Ghana</OPTION><OPTION
value=GI>Gibraltar</OPTION><OPTION
value=GR>Greece</OPTION><OPTION
value=GL>Greenland</OPTION><OPTION
value=GD>Grenada</OPTION><OPTION
value=GP>Guadeloupe</OPTION><OPTION
value=GU>Guam</OPTION><OPTION
value=GT>Guatemala</OPTION><OPTION
value=GN>Guinea</OPTION><OPTION
value=GW>Guinea-Bissau</OPTION><OPTION
value=GY>Guyana</OPTION><OPTION
value=HT>Haiti</OPTION><OPTION value=HM>Heard
Island and
McDonald Islands</OPTION><OPTION value=VA>Holy See
(Vatican
City State)</OPTION><OPTION
value=HN>Honduras</OPTION><OPTION value=HK>Hong
Kong</OPTION><OPTION
value=HU>Hungary</OPTION><OPTION
value=IS>Iceland</OPTION><OPTION
value=IN>India</OPTION><OPTION
value=ID>Indonesia</OPTION><OPTION value=IR>Iran
(Islamic
Republic of)</OPTION><OPTION
value=IQ>Iraq</OPTION><OPTION
value=IE>Ireland</OPTION><OPTION
value=IL>Israel</OPTION><OPTION
value=IT>Italy</OPTION><OPTION
value=JM>Jamaica</OPTION><OPTION
value=JP>Japan</OPTION><OPTION
value=JO>Jordan</OPTION><OPTION
value=KZ>Kazakhstan</OPTION><OPTION
value=KE>Kenya</OPTION><OPTION
value=KI>Kiribati</OPTION><OPTION value=KP>Korea,
Democratic
People's Republic of</OPTION><OPTION
value=KR>Korea,
Republic of</OPTION><OPTION
value=KW>Kuwait</OPTION><OPTION
value=KG>Kyrgyzstan</OPTION><OPTION value=LA>Lao
People's
Democratic Republic</OPTION><OPTION
value=LV>Latvia</OPTION><OPTION
value=LB>Lebanon</OPTION><OPTION
value=LS>Lesotho</OPTION><OPTION
value=LR>Liberia</OPTION><OPTION value=LY>Libyan
Arab
Jamahiriya</OPTION><OPTION
value=LI>Liechtenstein</OPTION><OPTION
value=LT>Lithuania</OPTION><OPTION
value=LU>Luxembourg</OPTION><OPTION
value=MO>Macau</OPTION><OPTION value=MK>Macedonia,
The
Former Yugoslav Republic of</OPTION><OPTION
value=MG>Madagascar</OPTION><OPTION
value=MW>Malawi</OPTION><OPTION
value=MY>Malaysia</OPTION><OPTION
value=MV>Maldives</OPTION><OPTION
value=ML>Mali</OPTION><OPTION
value=MT>Malta</OPTION><OPTION
value=MH>Marshall Islands</OPTION><OPTION
value=MQ>Martinique</OPTION><OPTION
value=MR>Mauritania</OPTION><OPTION
value=MU>Mauritius</OPTION><OPTION
value=YT>Mayotte</OPTION><OPTION
value=MX>Mexico</OPTION><OPTION
value=FM>Micronesia
(Federated States of)</OPTION><OPTION
value=MD>Moldova,
Republic of</OPTION><OPTION
value=MC>Monaco</OPTION><OPTION
value=MN>Mongolia</OPTION><OPTION
value=MS>Montserrat</OPTION><OPTION
value=MA>Morocco</OPTION><OPTION
value=MZ>Mozambique</OPTION><OPTION
value=MM>Myanmar</OPTION><OPTION
value=NA>Namibia</OPTION><OPTION
value=NR>Nauru</OPTION><OPTION
value=NP>Nepal</OPTION><OPTION
value=NL>Netherlands</OPTION><OPTION
value=AN>Netherlands
Antilles</OPTION><OPTION value=NC>New
Caledonia</OPTION><OPTION value=NZ>New
Zealand</OPTION><OPTION
value=NI>Nicaragua</OPTION><OPTION
value=NE>Niger</OPTION><OPTION
value=NG>Nigeria</OPTION><OPTION
value=NU>Niue</OPTION><OPTION value=NF>Norfolk
Island</OPTION><OPTION value=MP>Northern Mariana
Islands</OPTION><OPTION
value=NO>Norway</OPTION><OPTION
value=ZR>Obsolete see CD territory</OPTION><OPTION
value=FX>Obsolete see FR territory</OPTION><OPTION
value=LX>Obsolete see LT territory</OPTION><OPTION
value=OM>Oman</OPTION><OPTION
value=PK>Pakistan</OPTION><OPTION
value=PW>Palau</OPTION><OPTION
value=PS>Palestinian
Territory,Occupied</OPTION><OPTION
value=PA>Panama</OPTION><OPTION value=PG>Papua New
Guinea</OPTION><OPTION
value=PY>Paraguay</OPTION><OPTION
value=PE>Peru</OPTION><OPTION
value=PH>Philippines</OPTION><OPTION
value=PN>Pitcairn</OPTION><OPTION
value=PL>Poland</OPTION><OPTION
value=PT>Portugal</OPTION><OPTION value=PR>Puerto
Rico</OPTION><OPTION
value=QA>Qatar</OPTION><OPTION
value=RE>Reunion</OPTION><OPTION
value=RO>Romania</OPTION><OPTION value=RU>Russian
Federation</OPTION><OPTION
value=RW>Rwanda</OPTION><OPTION
value=SH>Saint Helena</OPTION><OPTION
value=KN>Saint Kitts
and Nevis</OPTION><OPTION value=LC>Saint
Lucia</OPTION><OPTION value=PM>Saint Pierre and
Miquelon</OPTION><OPTION value=VC>Saint Vincent
and the
Grenadines</OPTION><OPTION
value=WS>Samoa</OPTION><OPTION
value=SM>San Marino</OPTION><OPTION value=ST>Sao
Tome and
Principe</OPTION><OPTION value=SA>Saudi
Arabia</OPTION><OPTION
value=SN>Senegal</OPTION><OPTION
value=SC>Seychelles</OPTION><OPTION
value=SL>Sierra
Leone</OPTION><OPTION
value=SG>Singapore</OPTION><OPTION
value=SK>Slovakia</OPTION><OPTION
value=SI>Slovenia</OPTION><OPTION value=SB>Solomon
Islands</OPTION><OPTION
value=SO>Somalia</OPTION><OPTION
value=ZA>South Africa</OPTION><OPTION
value=GS>South Georgia
and the South Sandwich Island</OPTION><OPTION
value=ES>Spain</OPTION><OPTION value=LK>Sri
Lanka</OPTION><OPTION
value=SD>Sudan</OPTION><OPTION
value=SR>Suriname</OPTION><OPTION
value=SJ>Svalbard and Jan
Mayen Islands</OPTION><OPTION
value=SZ>Swaziland</OPTION><OPTION
value=SE>Sweden</OPTION><OPTION
value=CH>Switzerland</OPTION><OPTION
value=SY>Syrian Arab
Republic</OPTION><OPTION
value=TW>Taiwan</OPTION><OPTION
value=TJ>Tajikistan</OPTION><OPTION
value=TZ>Tanzania,
United Republic of</OPTION><OPTION
value=TH>Thailand</OPTION><OPTION
value=TG>Togo</OPTION><OPTION
value=TK>Tokelau</OPTION><OPTION
value=TO>Tonga</OPTION><OPTION value=TT>Trinidad
and
Tobago</OPTION><OPTION
value=TN>Tunisia</OPTION><OPTION
value=TR>Turkey</OPTION><OPTION
value=TM>Turkmenistan</OPTION><OPTION
value=TC>Turks and
Caicos Islands</OPTION><OPTION
value=TV>Tuvalu</OPTION><OPTION
value=UG>Uganda</OPTION><OPTION
value=UA>Ukraine</OPTION><OPTION value=AE>United
Arab
Emirates</OPTION><OPTION value=GB>United
Kingdom</OPTION><OPTION value=US>United
States</OPTION><OPTION value=UM>United States
Minor Outlying
Islands</OPTION><OPTION
value=UY>Uruguay</OPTION><OPTION
value=UZ>Uzbekistan</OPTION><OPTION
value=VU>Vanuatu</OPTION><OPTION
value=VE>Venezuela</OPTION><OPTION value=VN>Viet
Nam</OPTION><OPTION value=VG>Virgin Islands,
British</OPTION><OPTION value=VI>Virgin Islands,
U.S.</OPTION><OPTION value=WF>Wallis and
Futuna</OPTION><OPTION value=EH>Western
Sahara</OPTION><OPTION
value=YE>Yemen</OPTION><OPTION
value=YU>Yugoslavia</OPTION><OPTION
value=ZM>Zambia</OPTION><OPTION
value=ZW>Zimbabwe</OPTION></SELECT>
</td>
</tr>
</table>
</form>
</body></html>

************
 
Reply With Quote
 
 
 
 
Richard Cornford
Guest
Posts: n/a
 
      02-13-2004
"Martin" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed) om...
<snip>
> <script>function Goodbye()


Where is your type attribute?

> {
> for (var i = 0; i <
> document.DefaultFormName.IgsPePersonAddrCountry.le ngth; i++)
> {
> if

(document.DefaultFormName.IgsPePersonAddrCountry.o ptions[i].value.match(
document.InputForm.countrycode.value))
> {
> document.DefaultFormName.IgsPePersonAddrCountry.se lectedIndex =
> i;
> break;
> }
> }
> }

<snip>

Resolving absolute property accessors for forms repeatedly will be
relatively time consuming. You should create local variables that refer
to the form object, possibly the select element and certainly the select
element's - options - collection and then make future references to the
properties of those objets relative to the local variable.

var frm = document.forms.DefaultFormName;
var selectEl = frm.elements.IgsPePersonAddrCountry;
var selOptions = selectEl.options;

var cntryCode = frm.elements.countrycode.value;
/* no need to repeatedly look up that string as it
should be constant while the function runs.
*/


Then the number of options is - selOptions.length - the option element
at index - c - is - selOptions[c] - and its value is -
selOptions[c].value - and assigning a selected index is -
selectEl.selectedIndex = n - . Generally, if you reference the same
object repeatedly with a property accessor in a function you will get
better performance by assigning a reference to that object to a local
variable so that each identifier does not need to be repeatedly
resolved.

After you have done that question the use of the - match - method.
(should it be a comparison? Where failure to equate can be determined
quite quickly. But I have never directly speed tested those two so match
might be quicker, though I doubt it.)

It won't make much difference but you could also loop through the
options collection backwards with:-

for(var c = selOptions.length;c--{
 
Reply With Quote
 
 
 
 
Bas Cost Budde
Guest
Posts: n/a
 
      02-13-2004
Richard Cornford wrote:

> for(var c = selOptions.length;c--{


Ah, the old assembler trick. Thanks for showing me, I like that.

> Incidentally, I use - c - in newsgroup posts because - i - is less easy
> to identify and my word processor likes to capitalise it.


Food for thought. For non-native english people (like me) the danger of
identification is not so present. You have a word processor with a
strong feeling for personality?
--
Bas Cost Budde
http://www.heuveltop.org/BasCB
but the domain is nl

 
Reply With Quote
 
DU
Guest
Posts: n/a
 
      02-14-2004
Bas Cost Budde wrote:

> Richard Cornford wrote:
>
>> for(var c = selOptions.length;c--{

>
>
> Ah, the old assembler trick. Thanks for showing me, I like that.
>
>> Incidentally, I use - c - in newsgroup posts because - i - is less easy
>> to identify and my word processor likes to capitalise it.

>
>
> Food for thought. For non-native english people (like me) the danger of
> identification is not so present. You have a word processor with a
> strong feeling for personality?


Another policy is to give fully intuitive, meaningful identifier to such
variable so that the code is much more understandable and, as a side
effect, avoid this readability issue.
E.g.:
for(var CountryIterator = 0; CountryIterator < objSelect.length;
CountryIterator++)
{...}

DU
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Performance Tutorials Services - Boosting Performance by DisablingUnnecessary Services on Windows XP Home Edition Software Engineer Javascript 0 06-10-2011 02:18 AM
GDI+ performance issue **ham ASP .Net 10 12-14-2004 06:36 PM
ASP.NET Session Management Performance issue Akshay Kumar ASP .Net 1 07-02-2004 05:40 PM
ASP.NET performance issue Paul King ASP .Net 17 07-02-2004 04:27 AM
Web Form Performance Versus Single File Performance jm ASP .Net 1 12-12-2003 11:14 PM



Advertisments