HTMLWorld - HTML, CSS, JavaScript, PHP, Java, Flash und vieles mehrHTMLWorld:   Home | Impressum
 

 
 

Anzeige 
 
HTMLWorld » Forum

Thema anzeigen - java script - code beschleunigen - speed up code

 FAQFAQ   SuchenSuchen   MitgliederlisteMitgliederliste   BenutzergruppenBenutzergruppen   RegistrierenRegistrieren 
 ProfilProfil   Einloggen, um private Nachrichten zu lesenEinloggen, um private Nachrichten zu lesen   LoginLogin 

java script - code beschleunigen - speed up code

 

Neues Thema eröffnen   Neue Antwort erstellen    HTMLWorld Foren-Übersicht
   JavaScript
Vorheriges Thema:
Nächstes Thema:  
Autor Nachricht
frankpilath
Häufiger Poster


Anmeldungsdatum: 22.03.2005
Beiträge: 21
Wohnort: Düsseldorf

BeitragVerfasst am: 22.03.2005 08:03:42    Titel: java script - code beschleunigen - speed up code Antworten mit Zitat

hi !!

ich programmiere zur zeit gerade eine umfangreiche seite mit sehr vielen objekten (<iframe>,<div>,<img>, etc.). leider wird bei unkompilierten sprachen wie java script der code mit zunehmender länge immer weniger performant.

ich wäre dankbar für ein paar tips, wie man seinen code deutlich beschleunigen kann. mal abgesehen von banalitäten, wie html tags zu schließen oder unnötige aufrufe des dom´s zu vermeiden, etc. - ich verwende wenn immer möglich "with(){ }" oder "switch(){ }", um den code zu verkürzen.

konkrete frage:
was ist performanter?

with(document){
getElementById('tfd001').value = '';
getElementById('tfd002').value = '<!-- ';
getElementById('tfd003').value = ' -->';
getElementById('tfd004').value = '/* ';
getElementById('tfd005').value = '';
getElementById('tfd006').value = ' */';
...
}

oder?

var oTfd = document.getElementById;
oTfd('tfd001').value = '';
oTfd('tfd002').value = '<!-- ';
oTfd('tfd003').value = ' -->';
oTfd('tfd004').value = '/* ';
oTfd('tfd005').value = '';
oTfd('tfd006').value = ' */';
...

(die objekte liegen alle in iframes, so dass die vollständige notation unvermeidlich ist, auch loops machen meiner meinung nach hier keinen wirklichen sinn)

noch etwas lob:
ich kenne die html-world seit jahren und finde immer wieder schnell die benötigte info - eine eigene rubrik "java script code optimieren" wäre doch vielleicht lohnend?!

vielen dank im vorraus,

frank aus düsseldorf
p.s.: falls ihr euch wundert: ich bin ein freund der klein-scheibung Smile
Nach oben
Benutzer-Profile anzeigen Private Nachricht senden Website dieses Benutzers besuchen
admin
Site Admin


Anmeldungsdatum: 16.01.2005
Beiträge: 323
Wohnort: Berlin

BeitragVerfasst am: 22.03.2005 09:42:59    Titel: Re: java script - code beschleunigen - speed up code Antworten mit Zitat

frankpilath hat folgendes geschrieben:
was ist performanter?[...]

ich glaube keins von beiden ist wirklich schneller. pro durchlauf werden da nur ein paar millisek differenz sein. ansonsten: probier's aus! mach eine schleife, lass 10.000 mal variante A durchlaufen und 10.000 variante B - und deine ergebnisse teilst du uns hier im forum mit.


frankpilath hat folgendes geschrieben:
eine eigene rubrik "java script code optimieren" wäre doch vielleicht lohnend?!

ich glaube da besteht nicht wirklich bedarf. den meisten ist's egal wie schnell der code ausgeführt wird weil es sich sowieso im millisek-bereich bewegt. und alles was darüber hinaus geht ist sowieso meist besser in flash oder java umgesetzt ...

gruss,
jan.
Nach oben
Benutzer-Profile anzeigen Private Nachricht senden Website dieses Benutzers besuchen MSN Messenger
frankpilath
Häufiger Poster


Anmeldungsdatum: 22.03.2005
Beiträge: 21
Wohnort: Düsseldorf

BeitragVerfasst am: 23.03.2005 08:57:21    Titel: Antworten mit Zitat

hallo jan,

vielen dank für die promte antwort. ich habe einen kleinen test durchgeführt, der ihre aussage (natürlich) auch bestätigt hat - vorrausgesetzt, der test macht in dieser form sinn (?):


<html>
<head>
<script>

// get time for execution
var execSta = new Date();

function getExecTime(testObj){
var execEnd = new Date();
var execTime = Date.parse(execEnd) - Date.parse(execSta);

alert(testObj + ' executed in : ' + execTime + ' msec');
execSta = null;
}

// the functions to get execution time
function testFunction1(){
for(var i = 1; i <= 500; i++){
window.document.getElementById('img001').src = 'test.gif';
window.document.getElementById('img002').src = 'test.gif';
window.document.getElementById('img003').src = 'test.gif';
window.document.getElementById('img004').src = 'test.gif';
window.document.getElementById('img005').src = 'test.gif';
window.document.getElementById('img006').src = 'test.gif';
window.document.getElementById('img007').src = 'test.gif';
window.document.getElementById('img008').src = 'test.gif';
window.document.getElementById('img009').src = 'test.gif';
window.document.getElementById('img010').src = 'test.gif';
}
getExecTime('function 1');
}

function testFunction2(){
for(var i = 1; i <= 500; i++){
with(window.document){
getElementById('img001').src = 'test.gif';
getElementById('img002').src = 'test.gif';
getElementById('img003').src = 'test.gif';
getElementById('img004').src = 'test.gif';
getElementById('img005').src = 'test.gif';
getElementById('img006').src = 'test.gif';
getElementById('img007').src = 'test.gif';
getElementById('img008').src = 'test.gif';
getElementById('img009').src = 'test.gif';
getElementById('img010').src = 'test.gif';
}
}
getExecTime('function 2');
}

function testFunction3(){
for(var i = 1; i <= 500; i++){
var elmObj = window.document.getElementById;

elmObj('img001').src = 'test.gif';
elmObj('img002').src = 'test.gif';
elmObj('img003').src = 'test.gif';
elmObj('img004').src = 'test.gif';
elmObj('img005').src = 'test.gif';
elmObj('img006').src = 'test.gif';
elmObj('img007').src = 'test.gif';
elmObj('img008').src = 'test.gif';
elmObj('img009').src = 'test.gif';
elmObj('img010').src = 'test.gif';
}
getExecTime('function 3');
}

</script>
</head>

<body onLoad="testFunction1();">
...testFunction2();
...testFunction3();

<img id="img001">
<img id="img002">
<img id="img003">
<img id="img004">
<img id="img005">
<img id="img006">
<img id="img007">
<img id="img008">
<img id="img009">
<img id="img010">

</body>
</html>


somit werde ich mich wohl eher darauf konzentrieren, an anderer stelle meinen code zu optimieren - für ihre tips in dieser sache wäre ich dennoch sehr dankbar.

ich habe natürlich darüber nachgedacht, statt java script besser direkt eine .NET-anwendung zu schreiben. da meine seite auch eher eine anwendung in form einer sammlung von tools (farb-tabellen, ascii-codes, text- und datei-operationen) werden soll. ich konnte mich allerdings noch nicht dazu aufraffen. ebenso wenig möchte ich die seite als applet aufbauen. somit bleibt java script für mich wohl die praktikabelste lösung !?

vielen dank für das schöne forum !

gruß, frank
Nach oben
Benutzer-Profile anzeigen Private Nachricht senden Website dieses Benutzers besuchen
admin
Site Admin


Anmeldungsdatum: 16.01.2005
Beiträge: 323
Wohnort: Berlin

BeitragVerfasst am: 23.03.2005 09:33:23    Titel: Antworten mit Zitat

naja, aber was stört dich an der geschwindigkeit? also bei mir wird dein test in 5 sek ausgeführt. d.h. es werden 5000 anweisungen in 5 Sek durchgeführt - das ist doch mehr als schnell und eigentlich völlig ausreichend ...
und ich sag mal so: wenn du mehr als 5000 zeilen code hast ist's schon wieder so umfangreich dass du entweder zu komplex programmiert hast (dass es sich also weit vereinfachen liesse) oder dass du wirklich langsam an eine "richtige" programmiersprache denken solltest ...

gruss,
jan.
Nach oben
Benutzer-Profile anzeigen Private Nachricht senden Website dieses Benutzers besuchen MSN Messenger
frankpilath
Häufiger Poster


Anmeldungsdatum: 22.03.2005
Beiträge: 21
Wohnort: Düsseldorf

BeitragVerfasst am: 23.03.2005 10:57:23    Titel: Antworten mit Zitat

sind weitaus mehr zeilen !!!
sum_of_all_iframeObjecs.window.document.documentElement.outerHTML.length = ca. 1.200.000 character - sind wie gesagt so einige tabellen und etwa 40 seiten, die gleichzeitig in ebenso vielen iframes geladen sein müssen...

die oben genannte routine ist aber rein als beispiel gedacht. ich verwende einige mouseover-down-out-events in verbindung mit textfields, nach deren ereignis komlexe funktionen ausgeführt werden. aus diesem grund suche ich stets nach guten tips wie man seinen code möglichst "schlank" halten kann - die komplexität ist halt das problem.
natürlich hast du recht, dass eine kompilierte sprache sinnvoll wäre, aber ich möchte meine "tools" von überall online ausführen, und zwar client-side (sonst wäre der webspace mir zu teuer).

SUCHE TIPS in der art wie:
http://www.webreference.com/js/tips/browse.html?cat=pe&start=1

oder:
http://msdn.microsoft.com/workshop/author/perf/perftips.asp?frame=true#Optimize_Your_Scripts

ideen ?

gruß, frank
Nach oben
Benutzer-Profile anzeigen Private Nachricht senden Website dieses Benutzers besuchen
Beiträge der letzten Zeit anzeigen:   
Neues Thema eröffnen   Neue Antwort erstellen    HTMLWorld Foren-Übersicht
   JavaScript
Alle Zeiten sind GMT + 1 Stunde
Seite 1 von 1

 
Gehe zu:  
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst deine Beiträge in diesem Forum nicht bearbeiten.
Du kannst deine Beiträge in diesem Forum nicht löschen.
Du kannst an Umfragen in diesem Forum nicht mitmachen.