nicht angemeldet
Hallo,
bei Browsern die DOM2 unterstützen führt das mehrfache Ausführen von
Layerverschiebungen (DIV-Tags) zu starken Verzögerungen.
Ein Problem war oder ist, dass viele Browser document.all und document.layers auch unterstützen,
die if-Abfragen mit z.B. if(document.all) .. if (docuemnt.getElementById)..
die Verschiebungen doppelt ausführen oder das häufige if-Abfragen bremst.
Die Verzögerungen bei Opera und konqueror sind meist hier zu finden.
Daher sollten externe js-Dateien für verschiedene Browsertypen angelegt werden, z.B.:
[CODE]
if (document.getElementById) {
document.write("<scri+"pt type='text/javascript' src='DOM2.JS'>"+"</scri"+'pt>'");}
else if(document.all&&!document.getElementById){
document.write("<scri+"pt type='text/javascript' src='IE4.JS'>"+"</scri"+'pt>'");
else if(document.layers){
document.write("<scri+"pt type='text/javascript' language='JavaScript1.3' src='NC4.JS'>"+"</scri"+'pt>'");}
[/CODE]
Nun wird aber auch bei reiner DOM2-Programmierung das verschieben von dutzend Layern zum Problem,
daher habe ich dieses Testscript mit 4 Layern geschrieben und bitte Euch,das mal mit
ICab (MAC),IE(MAC),Opera,Amaya,HotJava,konqueror und Netscape6.x oder andere DOM2-fähige Browser zu testen.
Eine bessere Formel für den Landeanflug wäre auch nett.. Formel:
Vielen Dank schonmal für Euer Mitmachen ;-)
Bei mir machte das unter Netscape 6.21 schon 5 Sekunden aus,
bei 12 Layern wären das dann schon 15 Sekunden Verzögerung.
Es geht also um jede Mikrosekunde, die eingespart werden kann,
denn bei Onlinespielen sind bis zu 100 Layers in Bewegung:
[CODE]
<!doctype html public "-//W3C//DTD HTML 4.0 //EN">
<html>
<head>
<meta name="author" content="MichelM">
<meta name="copyright" content="http://www.michelm.com"
<meta name="generator" content="Quanta">
<title></title>
<script type="text/javascript" language="JavaScript1.4"> <!--
if(!document.getElementById){document.open();document.write("kein DOM2-Browser");document.close();}
var mmx=6;var mmy=24;xx=1;kk=0;mmywert=new Array();mmxwert=new Array();
var test1=new String();var test1e=new String();var test2=new String();var test2e=new String();
var ausgabe=new String();
starttime=new Date();myLayer=new Array();
/* Für Testausgabe Kommentare entfernen
info=window.open("","","width=400,height=400,scrollbars=1");
info.moveTo(400,10);
*/
function fly(){
starttime=new Date();
lande();
}
function lande(){
if(mmx<400){mmx+=3}
mmy+=(xx<=51)?Math.round(mmy*0.045):5;xx++;
if(document.getElementById){
document.getElementById("airplane").style.top=mmx+"px";
document.getElementById("airplane").style.left=mmy+"px";
document.getElementById("airplane1").style.top=mmx+"px";
document.getElementById("airplane1").style.left=mmy+"px";
testpI1=parseInt(document.getElementById("airplane1").style.left);
document.getElementById("airplane2").style.top=mmx+"px";
document.getElementById("airplane2").style.left=mmy+"px";
testPI2=parseInt(document.getElementById("airplane2").style.left)
document.getElementById("airplane3").style.top=mmx+"px";
document.getElementById("airplane3").style.left=mmy+"px";
testPI2=parseInt(document.getElementById("airplane3").style.left)
}
if(parseInt(document.getElementById("airplane").style.left)<=952){
starte=setTimeout("lande()",29);}
else{
clearTimeout("lande()");
endtime=new Date();
test1=navigator.platform+"<BR>"+navigator.userAgent+"<BR>"+starttime+" Millisekunden: "+starttime.getMilliseconds()+" Schritte:"+(xx-1)/2+"<BR>";test1e=endtime+" Millisekunden: "+endtime.getMilliseconds();fly2();}
}
function fly2(){
mmx=6;mmy=24;xx=0;
myLayer=document.getElementsByTagName("DIV");
for (vv=1;vv<=200;vv++) {
if(mmx<400){mmxwert[vv]=mmx+=3;}else{mmxwert[vv]=mmx;}
mmywert[vv]=mmy+=(xx<=50)?Math.round(mmy*0.045):5;
/*info.document.write(vv+" vv :"+mmywert[vv]+"<BR>"+mmxwert[vv]+"<BR>");*/
xx++;
}
starttime=new Date();
/*Quicklande() bei setTimeout in Quicklande */
setInterval("Quicklande()",29);
}
function Quicklande(){
kk++;
/* info.document.write(kk+" : "+mmywert[kk]+"<BR>"+mmxwert[kk]); */
myLayer[0].style.top=mmxwert[kk]+"px";
myLayer[0].style.left=mmywert[kk]+"px";
myLayer[1].style.top=mmxwert[kk]+"px";
myLayer[1].style.left=mmywert[kk]+"px";
myLayer[2].style.top=mmxwert[kk]+"px";
myLayer[2].style.left=mmywert[kk]+"px";
myLayer[3].style.top=mmxwert[kk]+"px";
myLayer[3].style.left=mmywert[kk]+"px";
if(kk<=199)
tuenichts=0;
/*{starte=setTimeout("Quicklande()",10);}*/
else{
clearInterval("Quicklande()");endtime=new Date();test2=navigator.platform+"<BR>"+navigator.userAgent+"<BR>"+starttime+" Millisekunden: "+starttime.getMilliseconds()+" Schritte:"+kk/2+"<BR>";test2e=endtime+" Millisekunden: "+endtime.getMilliseconds();
ausgabe="<span style='font-family:Verdana,Tahoma,Arail,Helvetica,sns-serif;font-size:14px;color:black'><P>Bitte kopieren und per Mail an <a href='mailto:iaweb@iaweb.org'>mich</A> oder im forum als Antwort eintragen</P><BR><BR> Ergebnis Test 1 ohne Vorausberechung und parseInt-Abfrage<BR>"+test1+test1e+"<BR><BR> Ergebnis Test 2 mit Vorausberechung<BR>"+test2+test2e;
document.write(ausgabe+"<P>Bitte ergänzen (sehr wichtig!):<LI>CPU:</LI><LI>Takt(MHZ):</LI><LI>RAM (MB):</LI><LI>Bustakt (MHZ):</LI><LI>Grafikkarte:</LI></SPAN>");
}
}
//--> :
</script>
</head>
<body onLoad="fly();">
<DIV id="airplane" name="airplane" style="position:absolute;top:-30px;left:-40px;" ><img src="./airplane.gif" width="80px" height="46px" alt="Bild fehlt!"></DIV>
<DIV id="airplane1" name="airplane1" style="position:absolute;top:-30px;left:-40px;" ><img src="./airplane.gif" width="80px" height="46px" alt="Bild fehlt!"></DIV>
<DIV id="airplane2" name="airplane2" style="position:absolute;top:-30px;left:-40px;" ><img src="./airplane.gif" width="80px" height="46px" alt="Bild fehlt!"></DIV>
<DIV id="airplane3" name="airplane3" style="position:absolute;top:-30px;left:-40px;" ><img src="./airplane.gif" width="80px" height="46px" alt="Bild fehlt!"></DIV>
<DIV style="position:absolute;top:429px;left:0px;"><HR></HR></DIV>
</body>
</html>
[/CODE]