nicht angemeldet
JürgenB
suit
Der Martin
suit
suit
Der Martin
suit
suit
Hallo Zusammen,
Ich habe für ein Projekt eine Website gezimmert (bin noch mitten dabei), u.a. mit einer Bildergalerie, bei der die Navi unter der Maus automatisch in die entgegengesetzte Richtung scrollt:
dies ist die Betroffene Seite
auf allen Rechnern wo ich's bislang testen konnte sah es in allen Browsern toll aus, außer IE (7 & 8 getestet). Liegt das am Script oder am Brauser?
Vielen Dank für euer Interesse und eure Mithilfe
Nils
Hi,
auf allen Rechnern wo ich's bislang testen konnte sah es in allen Browsern toll aus, außer IE (7 & 8 getestet). Liegt das am Script oder am Brauser?
An letzterem auf jeden Fall auch - der IE ist, was Ausführung von JavaScript und Manipulation von HTML-Elementen/CSS-Eigenschaften angeht, mit Abstand der langsamste.
MfG ChrisB
moin,
auf allen Rechnern wo ich's bislang testen konnte sah es in allen Browsern toll aus, außer IE (7 & 8 getestet). Liegt das am Script oder am Brauser?
Im neuesten FF hab ich Mühe, mit der Maus ein vorbeihuschendes Thumbnail zu treffen. Mit IE v6 sehe ich gar nichts.
Hotti
Om nah hoo pez nyeetz, hotti!
Im neuesten FF hab ich Mühe, mit der Maus ein vorbeihuschendes Thumbnail zu treffen. Mit IE v6 sehe ich gar nichts.
wenn du auch so zitterst.
SCNR Matthias
hi,
Im neuesten FF hab ich Mühe, mit der Maus ein vorbeihuschendes Thumbnail zu treffen. Mit IE v6 sehe ich gar nichts.
wenn du auch so zitterst.
Hehe, än alter Knacker is kein D-Zug ;-)
Horst Haschmisch
Hallo WolfNilson,
bei mir läuft es auch im FF recht ruckelig. Beim kurzen Blick ins Script ist mir aufgefallen, dass du immer wieder mit document.getElementById auf die Elemente zugreifst. Du solltest diese Zugriffe mal zwischenspeichern. Nach meiner Erfahrung laufen Scripte dann runder:
var element = document.getElementById("Id_des_Elements");
...
element.style = ...
Gruß, Jürgen
Hallo,
Beim kurzen Blick ins Script ist mir aufgefallen, dass du immer wieder mit document.getElementById auf die Elemente zugreifst. Du solltest diese Zugriffe mal zwischenspeichern. Nach meiner Erfahrung laufen Scripte dann runder:
Stimmt. z.B. in der Schleife
for(var i = 0; i < document.getElementsByName('thumbnail').length;i++){/*...*/}
muss der Browser bei jedem Schleifendurchlauf alle thumbnail-Elemente raussuchen und zählen. Einmal würde doch völlig reichen, also besser so:
var thumbnails = document.getElementsByName('thumbnail');
for(var i = 0; i < thumbnails.length;i++) {/*...*/}
Auch hier z.B.:
var pixelPositionImDiv = pixelPositionVonLinks + Number(document.getElementById('thumbreihendiv').style.left.substr(0,document.getElementById('thumbreihendiv').style.left.length - 2));
muss das DIV-Element unnötigerweise zweimal im DOM-Baum gesucht werden. Schneller wäre etwas wie:
var divStyleLeft = document.getElementById('thumbreihendiv').style.left;
var pixelPositionImDiv = pixelPositionVonLinks + Number(divStyleLeft.substr(0,divStyleLeft.length - 2));
Gruß, Don P
Hallo,
bei mir läuft es auch im FF recht ruckelig. Beim kurzen Blick ins Script ist mir aufgefallen, dass du immer wieder mit document.getElementById auf die Elemente zugreifst. Du solltest diese Zugriffe mal zwischenspeichern. Nach meiner Erfahrung laufen Scripte dann runder:
var element = document.getElementById("Id_des_Elements");
...
element.style = ...
Einen ähnlichen Tipp gigt es auch für php. Hier gibt es eine sehr gute "Anleitung" für Performance, zwar nur für PHP aber viele Dinge lassen sich auch auf andere Sprachen übertragen - wie z.B. JS.
Greez^^
Hallo,
du solltest das Script definitiv optimieren. Auch wenn der IE nicht der schnellste ist, beanspruchen auch Firefox und Opera einen Prozessor für sich beim "scrollen" der Bilder.
Aufgefallen ist mir zum Beispiel Folgendes:
window.setTimeout('thumbscrollGo()',10);
Es müsste doch auch Folgendes reichen oder? (Ich kann keine 100 Bilder in der Sekunde sehen)
window.setTimeout('thumbscrollGo()',40);
Außerdem scheinst du für jedes Bild die Position einzeln festzulegen. Vielleicht funktioniert es besser, wenn man alle Bilder insgesamt durch ein umschließendes Element bewegt. Also nur das umschließende Element bewegt.
Ich bin dein Code aber nur überflogen.
Viele Grüße Novi
Es müsste doch auch Folgendes reichen oder? (Ich kann keine 100 Bilder in der Sekunde sehen)
Wieviele kannst du denn (geschätzt) sehen, wenn ich fragen darf bzw. warum sollte das relevant sein?
Hallo,
Es müsste doch auch Folgendes reichen oder? (Ich kann keine 100 Bilder in der Sekunde sehen)
ich auch nicht; aber für eine Stubenfliege wären selbst 100 Bilder pro Sekunde nur eine Diashow.
Wieviele kannst du denn (geschätzt) sehen, wenn ich fragen darf bzw. warum sollte das relevant sein?
Die zweite Frage zuerst: Es könnte deshalb relevant sein, weil es unnötig ist, Bewegungen zeitlich feiner aufzulösen, als das menschliche Auge für den Eindruck einer flüssigen Bewegung braucht.
Wie "schnell" das Auge bzw. das Auge-Hirn-Gespann ist, hängt sehr von der Art der Wahrnehmung ab. Bei einer Abfolge von Bildern einer Bewegungssequenz nimmt man ab ca. 20 Bildern pro Sekunde keine einzelnen Bilder mehr wahr, sondern es entsteht der Eindruck einer kontinuierlichen Bewegung.
Konzentriert man sich aber auf einen Punkt, z.B. eine blinkende LED, kann man auch 20Hz noch als Flimmern und somit als Folge von an/aus wahrnehmen. Sieht man eine Lichtquelle gar nur im peripheren Sichtfeld, also quasi aus dem Augenwinkel, kann man sogar bei 50Hz noch ein Flimmern wahrnehmen: Sieht man eine normale, "billige" Leuchtstoffröhre[1] direkt an, erscheint das Licht stetig und konstant. Schaut man aber daran vorbei, so dass man die Röhre nur noch ganz am Rand des Blickfelds sieht, nimmt man das Flimmern wahr.
So long,
Martin
[1] die traditionelle Bauweise mit Drossel, Starter und Röhre, im Gegensatz zu denen mit EVG und NF-Ansteuerung.
Hallo,
Es müsste doch auch Folgendes reichen oder? (Ich kann keine 100 Bilder in der Sekunde sehen)
ich auch nicht;
Das glaubst du ;) Ab etwa 15 Bildern pro Sekunde baut dein Gehirn aus mehreren einzelbildern eine scheinbar flüssige Bewegung - wahrnehmen kannst du wesentlich mehr.
Mann kann idR. problemlos einen Lichtblitz oder ein Einzelbild wahrnehmen der/das nur 1/250 einer Sekunde dauert/zu sehen ist.
Wieviele kannst du denn (geschätzt) sehen, wenn ich fragen darf bzw. warum sollte das relevant sein?
Die zweite Frage zuerst: Es könnte deshalb relevant sein, weil es unnötig ist, Bewegungen zeitlich feiner aufzulösen, als das menschliche Auge für den Eindruck einer flüssigen Bewegung braucht.
Das ist richtig, aber im PC-Umfeld kommen mehrere Faktoren dazu. z.B. die Wiederhohlfrequenz des Monitors und/oder der Signalübertragungsweg (bzw. die Freqenz) zum Monitor. Oder ob man einen 3-D-Monitor verwendet - was die tatsächliche Framerate gleichmal halbiert.
Eure Antworten in allen ehren... aber ich habe mit den Verschiedensten Bildraten herumprobiert, bis runter zu 0,5 Hz (2000ms), das Problem ist immer das selbe, der IE macht einfach nur (geschätzt) Bilder/s, alle anderen Browser machen alles was man will. Also, wor an liegt DAS?
Gruß Nils
Also, wor an liegt DAS?
Vermutlich am höhren Hardlimit für den Minimalwert von setTimeout und setInterval.
Om nah hoo pez nyeetz, WolfNilson!
Eure Antworten in allen ehren... aber ich habe mit den Verschiedensten Bildraten herumprobiert, bis runter zu 0,5 Hz (2000ms), das Problem ist immer das selbe, der IE macht einfach nur (geschätzt) Bilder/s, alle anderen Browser machen alles was man will. Also, wor an liegt DAS?
Möglicherweise daran, dass du die Optimierungsvorschläge noch nicht umgesetzt hast.
Matthias
Hi,
(Ich kann keine 100 Bilder in der Sekunde sehen)
ich auch nicht;
Das glaubst du ;)
ja, und ich bleibe dabei.
Mann kann idR. problemlos einen Lichtblitz oder ein Einzelbild wahrnehmen der/das nur 1/250 einer Sekunde dauert/zu sehen ist.
Stimmt, als Einzelereignis. Die Reizung der Stäbchen hält lange genug an, dass man auch extrem kurze Lichtblitze mitbekommt. Aber wenn davon 20 oder 30 pro Sekunde kommen, sieht man sie nicht mehr einzeln, sondern sie verwischen zu einem zusammenhängenden Ereignis, bestenfalls einem leichten Flimmern.
aber im PC-Umfeld kommen mehrere Faktoren dazu. z.B. die Wiederhohlfrequenz des Monitors und/oder der Signalübertragungsweg (bzw. die Freqenz) zum Monitor.
Ähm, ja. Ich gehe hier von einer handelsüblichen Grafikkarte mit VGA- oder DVI-Schnittstelle aus, oder von einem analogen oder digitalen Fernsehsignal. Alle diese Systeme können eine Bildfrequenz von mindestens 50Hz übertragen (beim Analog-Fernsehsignal mit der Einschränkung auf 50 Halbbilder pro Sekunde), so dass dieser Einwand bedeutungslos ist.
Oder ob man einen 3-D-Monitor verwendet - was die tatsächliche Framerate gleichmal halbiert.
Wer hat denn sowas tatsächlich schon? :-)
Ciao,
Martin
Ähm, ja. Ich gehe hier von einer handelsüblichen Grafikkarte mit VGA- oder DVI-Schnittstelle aus, oder von einem analogen oder digitalen Fernsehsignal. Alle diese Systeme können eine Bildfrequenz von mindestens 50Hz übertragen (beim Analog-Fernsehsignal mit der Einschränkung auf 50 Halbbilder pro Sekunde), so dass dieser Einwand bedeutungslos ist.
Schon mal was von vertikaler Synchronisation gehört?
Wenn deine Anwendung 50 Frames liefert, dein Monitor aber hart nur mit 60 oder 72 Hz arbeitet (wie das aktuell gebräuchliche TFT-Geräte tun), muss irgendjemand "warten" - diese Pausen führen auch bei relativ hohen Frameraten zu einem empfinden von ruckeln, da manche Bilder "doppelt" dargestellt werden und länger dauern als andere - natürlich ist das in diesem Fall nicht relevant, da liegt der Hund eindeutig von anders begraben.
Wer hat denn sowas tatsächlich schon? :-)
Ich hab' eine Farbfilterbrille - das hat denselben Effekt, auch Shutter-Brillen sind mitterlweile recht verbreitet ;)
Moin Moin!
Es müsste doch auch Folgendes reichen oder? (Ich kann keine 100 Bilder in der Sekunde sehen)
ich auch nicht;
Das glaubst du ;) Ab etwa 15 Bildern pro Sekunde baut dein Gehirn aus mehreren einzelbildern eine scheinbar flüssige Bewegung - wahrnehmen kannst du wesentlich mehr.
Mann kann idR. problemlos einen Lichtblitz oder ein Einzelbild wahrnehmen der/das nur 1/250 einer Sekunde dauert/zu sehen ist.
Mal so am Rande: Es hängt auch noch davon ab, ob man das Bild / Objekt direkt ansieht oder ob es sich am Rande des Blickfeldes befindet. Am Rand ist die Empfindlichkeit für Flimmern / schnelle Bewegungen deutlich höher als in der Mitte. Das stammt wohl noch aus der Zeit, als sich Raubtiere von hinten oder von der Seite an unsere Vorfahren anschlichen. Wer eine Bewegung am Rand des Blickfelds schneller wahrnemen konnte, hatte mehr Zeit, die Lage zu beurteilen, ggf. zu flüchten, und anschließend weniger Konkurrenz bei der Vermehrung.
Alexander
Hallo,
Es müsste doch auch Folgendes reichen oder? (Ich kann keine 100 Bilder in der Sekunde sehen)
window.setTimeout('thumbscrollGo()',40);
Hab ich schon geändert, ist jetzt:
thumbschTO = window.setTimeout('thumbscrollGo()',50)
Außerdem scheinst du für jedes Bild die Position einzeln festzulegen. Vielleicht funktioniert es besser, wenn man alle Bilder insgesamt durch ein umschließendes Element bewegt. Also nur das umschließende Element bewegt.
Das Tue ich, ein div-Element:
elThumbsdiv.style.left = String(Math.round(thumbscrpos))+"px"
Ich habe überlegt, ob es Sinn machen würde alle Thumbnails mit php zu einem Bild zu verschmelzen und dieses mit einer map zu versehen...?
Gruß Nils
Vielen Dank erstmal euch allen,
Also, ich habe eure Vorschläge denke ich alle berücksichtigt und von mir aus auch noch versucht Dinge zu verbessern, DOM-Elemente in Variablen gespeichert, die Timeouts runtergesetzt... aber die Situation ist nicht wesentlich besser geworden.
Noch weitere Ideen?
Noch weitere Ideen?
Die Fehler im HTML korrigieren, der Validator bemängelt 75.
Weiters dürften die relativen Angaben den IE ziemlich fertig machen, besonders die häufige Verwendung von Dingen wie "width: 3.57142857143%" oder vergleichbarem ist sicher nicht förderlich für die Performance.
Übrigens macht das auch meinen Opera 10.53 beim Verändern der Fenstergröße ziemlich fertig.