Vorheriges Thema: Nächstes Thema: |
Autor |
Nachricht |
frankpilath Häufiger Poster
Anmeldungsdatum: 22.03.2005 Beiträge: 21 Wohnort: Düsseldorf
|
Verfasst am: 22.03.2005 08:03:42 Titel: java script - code beschleunigen - speed up code |
|
|
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 |
|
Nach oben |
|
|
admin Site Admin
Anmeldungsdatum: 16.01.2005 Beiträge: 323 Wohnort: Berlin
|
Verfasst am: 22.03.2005 09:42:59 Titel: Re: java script - code beschleunigen - speed up code |
|
|
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 |
|
|
frankpilath Häufiger Poster
Anmeldungsdatum: 22.03.2005 Beiträge: 21 Wohnort: Düsseldorf
|
Verfasst am: 23.03.2005 08:57:21 Titel: |
|
|
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 |
|
|
admin Site Admin
Anmeldungsdatum: 16.01.2005 Beiträge: 323 Wohnort: Berlin
|
Verfasst am: 23.03.2005 09:33:23 Titel: |
|
|
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 |
|
|
frankpilath Häufiger Poster
Anmeldungsdatum: 22.03.2005 Beiträge: 21 Wohnort: Düsseldorf
|
Verfasst am: 23.03.2005 10:57:23 Titel: |
|
|
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 |
|
|
|
|
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.
|
|
|