[js] Snelheid javascript in verschillende browsers *

Pagina: 1
Acties:
  • 109 views sinds 30-01-2008
  • Reageer

Acties:
  • 0 Henk 'm!

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

Wolfboy schreef op 29 oktober 2004 @ 21:20:
[...]
Dat opera bekend staat als een snelle browser heeft overigens hier niet veel mee te maken, pagina's met veel plaatjes gaan niet zo snel met opera. Maar met gewoon renderen van html en javascript is hij wel de kampioen.
ik doe regelmatig benchmarks met javascript, maar daarin zijn toch meestal IE of Mozilla/FireFox (ligt een beetje aan de soort bewerkingen) het snelste, en hobbelt Opera er achteraan ;)

[ Voor 6% gewijzigd door crisp op 30-10-2004 00:01 ]

Intentionally left blank


Acties:
  • 0 Henk 'm!

  • Wolfboy
  • Registratie: Januari 2001
  • Niet online

Wolfboy

ubi dubium ibi libertas

crisp schreef op 29 oktober 2004 @ 22:19:
[...]

ik doe regelmatig benchmarks met javascript, maar daarin zijn toch meestal IE of Mozilla/FireFox (ligt een beetje aan de soort bewerkingen) het snelste, en hobbelt Opera er achteraan ;)
Het zal dan wel aan de bewerkingen liggen ja, de benchmark die ik deze week heb gemaakt gaf opera namelijk wel duidelijk als winnaar aan (was niet echt als benchmark bedoeld maar door de lange duur was het wel een ongeveer benchmark ;))

Opera deed er zo'n 34sec over, firefox (moox versie) deed er zo'n 48sec over, IE had 2:45 nodig en de normale firefox 2:20.
Dat was overigens een verzameling van for-loops met document.write :P
(later createElement gebruikt en dat ging wel een stukje sneller ;))

[ Voor 4% gewijzigd door Wolfboy op 29-10-2004 23:59 . Reden: [ot] tags weggewerkt ]

Blog [Stackoverflow] [LinkedIn]


Acties:
  • 0 Henk 'm!

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

Wolfboy schreef op 29 oktober 2004 @ 22:24:
[...]
Het zal dan wel aan de bewerkingen liggen ja, de benchmark die ik deze week heb gemaakt gaf opera namelijk wel duidelijk als winnaar aan (was niet echt als benchmark bedoeld maar door de lange duur was het wel een ongeveer benchmark ;))

Opera deed er zo'n 34sec over, firefox (moox versie) deed er zo'n 48sec over, IE had 2:45 nodig en de normale firefox 2:20.
Dat was overigens een verzameling van for-loops met document.write :P
(later createElement gebruikt en dat ging wel een stukje sneller ;))
met document.write heeft Opera natuurlijk weer voordeel van zijn snelle HTML parser. Daarbij is IE geen held als het gaat om stringbewerkingen - maar daar zijn optimalisaties voor te verzinnen ;)

Nou ja, ben nu toch offtopic bezig, dus maar meteen wat voorbeelden :)

JavaScript:
1
2
3
4
5
6
7
8
9
10
11
  var s = new Date().valueOf();

  var i = 0;
  do {

    document.write('abracadabra');

  } while (i++ < 10000);

  var e = new Date().valueOf();
  alert (e-s);


IE6: 290ms
FF 0.9.3: 741ms
Opera 7.6 preview: 871ms

geoptimaliseerd:
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
  var s = new Date().valueOf();

  var i = 0;
  var a=[];
  do {

    a[i] = 'abracadabra';

  } while (i++ < 10000);

  document.write(a.join());

  var e = new Date().valueOf();
  alert (e-s);


IE6: 60ms
FF 0.9.3: 30ms
Opera 7.6 preview: 20ms

heel wisselend dus ;)

[ Voor 32% gewijzigd door crisp op 30-10-2004 00:02 ]

Intentionally left blank


Acties:
  • 0 Henk 'm!

  • Wolfboy
  • Registratie: Januari 2001
  • Niet online

Wolfboy

ubi dubium ibi libertas

crisp schreef op 29 oktober 2004 @ 22:29:
[...]
[knip.....]
heel wisselend dus ;)
Dat is nog best wel een duidelijk verschil ja, bij de eerste test had ik ongeveer dezelfde resultaten als jij maar bij de tweede test kwamen alledrie de browsers hier op ~31 uit.
Dat is dan:
Opera: 7.60 Build 7141
Firefox/0.10.1 (MOOX M2)
IE 6.0

En wat die optimalisaties betreft, daar ken ik er maar een paar van. Dat het sneller is om alles in 1x eruit te gooien doormiddel van een lange string of array dat weet ik wel maar verder zou ik eigenlijk niet zoveel optimalisaties weten.
Over het algemeen is het toch niet nodig maarja :P
Daar moet je natuurlijk javascript god Crisp voor zijn ;)

Blog [Stackoverflow] [LinkedIn]


Acties:
  • 0 Henk 'm!

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

Wolfboy schreef op 29 oktober 2004 @ 23:11:
[...]
Dat is nog best wel een duidelijk verschil ja, bij de eerste test had ik ongeveer dezelfde resultaten als jij maar bij de tweede test kwamen alledrie de browsers hier op ~31 uit.
Dat is dan:
Opera: 7.60 Build 7141
Firefox/0.10.1 (MOOX M2)
IE 6.0

En wat die optimalisaties betreft, daar ken ik er maar een paar van. Dat het sneller is om alles in 1x eruit te gooien doormiddel van een lange string of array dat weet ik wel maar verder zou ik eigenlijk niet zoveel optimalisaties weten.
Over het algemeen is het toch niet nodig maarja :P
Daar moet je natuurlijk javascript god Crisp voor zijn ;)
IE is heel slecht met lange strings:
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
  var s = new Date().valueOf();

  var i = 0;
  var a='';
  do {

    a += 'abcracadabra';

  } while (i++ < 10000);

  document.write(a);

  var e = new Date().valueOf();
  alert (e-s);

IE6: 2804ms
FF 0.9.3: 30ms
Opera 7.6 build 7141: 20ms

meteen dramatisch dus in IE, en dat terwijl IE met de meeste andere soort bewerkingen weer vele malen sneller is dan FF en Opera. Met name als het gaat om dynamische effecten in het document (bewegende layers e.d.) - daar is Opera weer zwak in, en FF ook in mindere mate.

wmb mag dit uitstapje wel afgesplitst worden naar een W&G topic ;)

Intentionally left blank


Acties:
  • 0 Henk 'm!

  • F_J_K
  • Registratie: Juni 2001
  • Niet online

F_J_K

Moderator CSA/PB

Front verplichte underscores

Topicstarter
offtopic:
Even afgesplist van Kwaliteits resize optie in browsers? O-)

De Offtopic tags van bovenstaande staan dus verkeerd om :P

'Multiple exclamation marks,' he went on, shaking his head, 'are a sure sign of a diseased mind' (Terry Pratchett, Eric)


Acties:
  • 0 Henk 'm!

  • Wolfboy
  • Registratie: Januari 2001
  • Niet online

Wolfboy

ubi dubium ibi libertas

F_J_K schreef op 29 oktober 2004 @ 23:56:
De Offtopic tags van bovenstaande staan dus verkeerd om :P
offtopic:
Aangepast :)

Btw het is niet alleen opera imho, misschien is een iets algemenere titel beter?

[ Voor 22% gewijzigd door Wolfboy op 30-10-2004 00:00 ]

Blog [Stackoverflow] [LinkedIn]


Acties:
  • 0 Henk 'm!

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

offtopic:
zo beter? ;)

Intentionally left blank


Acties:
  • 0 Henk 'm!

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

ontopic: als je een een grote hoeveelheid HTML wilt toevoegen is innerHTML nog altijd te prefereren, in alle browsers. In het geval van IE kan je dan dus het beste nog de boel in stukjes in een array zetten en die later met join() samenvoegen.

Wat betreft optimalisaties, daar kan ik een boek over volschrijven. Soms gebruik ik wel heel erg ranzige truuken puur omdat het sneller is; als ik bv iets in een 2-dimensionale array wil opzoeken, maar niet zeker weet of x en/of y binnen de bounderies liggen doe ik gewoon zo:

JavaScript:
1
2
3
4
5
6
7
8
9
10
function getArrayElement(ar,x,y)
{
  try {
    return ar[x][y];
  }
  catch(e)
  {
    return null;
  }
}

Intentionally left blank


Acties:
  • 0 Henk 'm!

  • Johnny
  • Registratie: December 2001
  • Laatst online: 16:40

Johnny

ondergewaardeerde internetguru

Over de snelheid van Opera; de GUI gebruikt ook een paar truukjes om hem sneller te laten lijken door bijvoorbeeld een tab te sluiten zodra je de middelste muisknop naar beneden doet, terwijl andere browsers het pas doen als je hem weer omhoog doet, op die manier lijkt het of het programma veel sneller reageert.

Verder is de statusbalk in Opera veel "drukker" je ziet precies wat er wordt geladen en de balkjes en nummers vliegen heen en weer, waardoor je dus steeds ziet dat de browser bezig is met het laden van een item, klaar is en meteen met het volgende begint.

Maar dat heeft natuurlijk niets met renderen van pagina's te maken, maar meer met hoe je men de snelheid ervaart.

edit:

Fuck, nu heet het topic niet meer "Snelheid van Opera", en aangezien dit niet over JavaScript gaat is het helemaal offtopic.

[ Voor 11% gewijzigd door Johnny op 30-10-2004 00:12 ]

Aan de inhoud van de bovenstaande tekst kunnen geen rechten worden ontleend, tenzij dit expliciet in dit bericht is verwoord.


Acties:
  • 0 Henk 'm!

  • Wolfboy
  • Registratie: Januari 2001
  • Niet online

Wolfboy

ubi dubium ibi libertas

offtopic:
Veel beter O-) _/-\o_


Voor mensen die geinteresseerd zijn, voor een klein overzichtje over welke methoden het snelst zijn moet je eventjes naar Quirksmode gaan :)
Kan je ook direct je browsertje benchen ;)

Btw heb jij misschien nog wat tips Crisp?
Toen ik begon met typen stonden die posts er nog niet
Johnny schreef op 30 oktober 2004 @ 00:10:
edit:

Fuck, nu heet het topic niet meer "Snelheid van Opera", en aangezien dit niet over JavaScript gaat is het helemaal offtopic.
Het is je vergeven

[ Voor 29% gewijzigd door Wolfboy op 30-10-2004 00:18 ]

Blog [Stackoverflow] [LinkedIn]


Acties:
  • 0 Henk 'm!

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

tips? ja plenty :)

rule number 1; vermijd afvragingen van properties in condities binnen loops, dus niet:
JavaScript:
1
for (var i = 0; i < el.length; i++) { }

maar
JavaScript:
1
for (var i = 0, j = el.length; i < j; i++) { }


rule number 2: als volgorde niet uitmaakt, ga dan van x naar 0 en gebruik een while of een do-while:
JavaScript:
1
2
var i = el.length;
while (i--) { }


rule number 3: cache referenties naar elementen in je document in een global var of array

to be continued... :)

[ Voor 3% gewijzigd door crisp op 30-10-2004 00:26 ]

Intentionally left blank


Acties:
  • 0 Henk 'm!

  • Wolfboy
  • Registratie: Januari 2001
  • Niet online

Wolfboy

ubi dubium ibi libertas

crisp schreef op 30 oktober 2004 @ 00:25:
tips? ja plenty :)

rule number 1; vermijd afvragingen van properties in condities binnen loops, dus niet:
JavaScript:
1
for (var i = 0; i < el.length; i++) { }

maar
JavaScript:
1
for (var i = 0, j = el.length; i < j; i++) { }
Dat is opzich nog wel best vreemd eigenlijk, is dat met andere talen ook zo is alleen bij javascript?
(ik ga het wel even testen hier)

Blog [Stackoverflow] [LinkedIn]


Acties:
  • 0 Henk 'm!

Verwijderd

De verschillen liggen vooral op totaal willekeurige vlakken. Renderen van de canvas is in Mozilla trager als in IE, vooral als je values toekend met een val + 'px'; Maar als je classNames gaat toekennen met veel elementen in een pagina zie je dat IE hier het heel slecht in doet, vertragingen zijn dan goed merkbaar.

Dan hebben we nog de GC van IE die volgens mark and sweep werkt en daardoor in de huidige situatie zwaar onvoldoende is voor zijn taak. Geheugenlekken zijn bijna onontkoombaar. Memorymanagement voor IE is daardoor nodig, en dat was nu net een van de sterke punten van Javascript.

De verschillen ga je pas goed merken bij grote operaties in Javascript zoals games, visuele widgets, of werken met grote datasets. De mensen die dit soort richtingen opgaan met Javascript weten gemiddeld gezien wel redelijk wat af van optimalisaties, daar Javascript vanwege de combinatie browsers, regels, en browser eigen zaken niet de meest makkelijke taal is om goed onder de knie te krijgen.

Acties:
  • 0 Henk 'm!

  • Wolfboy
  • Registratie: Januari 2001
  • Niet online

Wolfboy

ubi dubium ibi libertas

Wolfboy schreef op 30 oktober 2004 @ 00:29:
[...]
Dat is opzich nog wel best vreemd eigenlijk, is dat met andere talen ook zo is alleen bij javascript?
(ik ga het wel even testen hier)
PHP: ~13% sneller
JS IE: ~25% sneller
JS Opera: ~14% sneller
JS Firefox: ~10% sneller
Java: ~14% sneller

Aangezien ik hier eventjes geen compiler bij de hand heb zullen andere taaltjes moeten wachten, misschien dat ik morgen eventjes C++, Perl en Java kan testen :)

Blog [Stackoverflow] [LinkedIn]


Acties:
  • 0 Henk 'm!

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

interessant:

naar boven tellen:
JavaScript:
1
for (var i = 0; i < 1000000; i++);

IE6 : 230ms
FF 0.9.3 : 200ms
Opera 7.6 : 600mx

naar beneden tellen:
JavaScript:
1
for (var i = 1000000; i; i--);

IE6 : 190ms
FF 0.9.3 : 160ms
Opera 7.6: 320ms

geoptimaliseerd:
JavaScript:
1
2
var i = 1000000;
while (i--);

IE6 : 160ms
FF 0.9.3 : 110ms
Opera 7.6 : 180ms

hele simpele voorbeelden...

Intentionally left blank


Acties:
  • 0 Henk 'm!

  • sjhgvr
  • Registratie: Januari 2004
  • Laatst online: 04-08 14:27
@Wolfboy

PHP snelheidsverschil in browsers ?
dat kan natuurlijk nooit, PHP wordt immers niet door browsers gelezen.

edit:
@Wolfboy hieronder

ok ik snappm nu :*)

[ Voor 21% gewijzigd door sjhgvr op 30-10-2004 02:51 ]

oisd.nl


Acties:
  • 0 Henk 'm!

  • Wolfboy
  • Registratie: Januari 2001
  • Niet online

Wolfboy

ubi dubium ibi libertas

DapinododiadeaL schreef op 30 oktober 2004 @ 02:44:
@Wolfboy

PHP snelheidsverschil in browsers ?
dat kan natuurlijk nooit, PHP word immers niet door de browsers gelezen.
Dat was eventjes een testje hoe verschillende talen reageren op de code
Die php test is natuurlijk gewoon op een webservertje en die testen daaronder zijn op mijn werkstation met javascript.

Het lijkt erop dat dit snelheidsverschil niet alleen voor javascript opgaat maar ook voor andere talen.

Blog [Stackoverflow] [LinkedIn]


Acties:
  • 0 Henk 'm!

Verwijderd

offtopic omdat het zinloze code is, maar wel een leuke test:
code:
1
2
3
4
5
6
7
8
var s = new Date().valueOf();

var ar = new Array();
ar[10000000] = 'test';
ar = ar.reverse();

var e = new Date().valueOf();
alert (e-s);

IE: 4766ms
FF: 34716ms

Acties:
  • 0 Henk 'm!

  • Wolfboy
  • Registratie: Januari 2001
  • Niet online

Wolfboy

ubi dubium ibi libertas

Java:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
int i = 0;
int max = 1000000000;
int min = 0;

long t0 = System.currentTimeMillis();
for (i = min ;i != max; i++);

long t1 = System.currentTimeMillis();
for (i = max; i != min; i--);

long t2 = System.currentTimeMillis();
while (i != max)i++;

long t3 = System.currentTimeMillis();
while (i != min)i--;

long t4 = System.currentTimeMillis();
do{
    i++;
}while(i != max);

long t5 = System.currentTimeMillis();
do{
    i--;
}while(i != min);

long t6 = System.currentTimeMillis();

System.out.println("for optellen: " + (t1-t0)); 
System.out.println("for aftellen: " + (t2-t1));
System.out.println("while optellen: " + (t3-t2)); 
System.out.println("while aftellen: " + (t4-t3));
System.out.println("do while optellen: " + (t5-t4));
System.out.println("do while aftellen: " + (t6-t5));
quote: output
for optellen: 3203
for aftellen: 3125
while optellen: 2515
while aftellen: 2485
do while optellen: 1875
do while aftellen: 1906
Toch vreemd dat daar een verschil in zit, misschien dat ik vanavond tijd heb om nog wat meer te testen.

Btw ik heb bij mijn vorige resultaten java ook toegevoegt :)

edit:
Nieuwe resultaten, nieuwe code O-)

[ Voor 132% gewijzigd door Wolfboy op 30-10-2004 18:14 ]

Blog [Stackoverflow] [LinkedIn]


Acties:
  • 0 Henk 'm!

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

mind you dat i>0? een ander soort afvraging is dan i?

Intentionally left blank


Acties:
  • 0 Henk 'm!

  • Wolfboy
  • Registratie: Januari 2001
  • Niet online

Wolfboy

ubi dubium ibi libertas

crisp schreef op 30 oktober 2004 @ 17:52:
mind you dat i>0? een ander soort afvraging is dan i?
Dat weet ik maar anders slikt java het niet :P

Blog [Stackoverflow] [LinkedIn]


Acties:
  • 0 Henk 'm!

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

Wolfboy schreef op 30 oktober 2004 @ 18:00:
[...]

Dat weet ik maar anders slikt java het niet :P
omdat java niet loose-typed is zoals javascript en PHP ;)

Intentionally left blank


Acties:
  • 0 Henk 'm!

  • Wolfboy
  • Registratie: Januari 2001
  • Niet online

Wolfboy

ubi dubium ibi libertas

crisp schreef op 30 oktober 2004 @ 18:02:
[...]

omdat java niet loose-typed is zoals javascript en PHP ;)
True :P
Voordeel en nadeel eigenlijk, het tikt wat minder makkelijk maar het geeft wel nettere code over het algemeen.
Maarja, java begon iig te zeuren dat het geen boolean was (en hij heeft gelijk :P)

Blog [Stackoverflow] [LinkedIn]


Acties:
  • 0 Henk 'm!

Verwijderd

Toch vreemd dat daar een verschil in zit, misschien dat ik vanavond tijd heb om nog wat meer te testen.
Nee niet vreemd, intel-processoren (en andere ook) hebben speciale instructies voor vergelijken met de waarde 0. De java-jit compiler gebruikt blijkbaar deze instructie. Dus i<>0 is sneller dan b.v. i<>10.
Pagina: 1