Homepage Performance
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
badminton
bild
browser
check
code
dank
element
episode
http
laden
performance
problem
quellcode
rechner
sagen
test
treten
tun
url
verweis
-
Hallo Leute,
über die Suchfunktion hab ich auch nur speziellere Antworten gefunden und irgendwie gehen mir so langsam die Ideen aus. Das Problem: Meine Homepage ruckt. Die Seite ist fertig geladen und dennoch ruckt sie beim runterscrollen. Im Verhältnis sind sag ich mal 10 Div-Boxen geöffnet mit jeweils einer kleinen JS ein-ausblend funktion. An der sollte es nicht liegen. Innerhalb dessen sind dann "Episoden-Listen" mit bis mehreren, bis über 100 Elementen. Sind aber keine <div>, sondern <a >-Tags und jeweils mit css formatiert. zusätzlich hat jede dieser a Tags noch eine Checkbox dabei und ein kleines icon.
Meine Frage: Was kann so stark die Performance beeinflussen das die Seite beim Scrollen ruckelt. Wenn wer Bock hat kann ich ihn auf die Seite einladen, die ist leider nicht öffentlich zugänglich. Braucht auch keine Anmeldung, ich bekommt nur ein Passwort und Gastnamen.
LG -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Am besten schickst du uns mal einen Link dann können wir selber testen und ggf. nach Problemen suchen.
PS:
h4nni.lima-city.de:
\/
Sie werden automatisch auf www.jan-kiesewetter.de weitergeleiten, einen Moment bitte!
h4nni.pyrokar.lima-city.de/jan-kiesewetter.de/index.php:
\/
Ich bin umgezogen auf einen neuen Server, bitte Favoriten Updaten! Du wirst automatisch weitergeleitet ...
web570.xps4.microserver.de/kiesewetter_testlauf:
Die Domain "web570.xps4.microserver.de" ist nicht verfügbar.
Kommt nicht so toll, oder? -
Ich kann bei Geschwindigkeitsproblemen auch nur auf den Code verweise. Entweder es ist eine sehr große Seite, dann empfehle ich den Google PageSpeed-Test. Oder es liegt an den Code der auf den Rechner ausgeführt wird. Das kann man nur händisch regeln, am Ressourcensparendsten sind die jQuery Effekte.
Vielleicht liegt es aber auch nur an deinem Rechner der zu alt und langsam ist.
mfg Stephan -
Die Bilder die du da als Icons verwendest könnten auch auf (zu) große Bilddateien verweisen und nur per width und height verkleinert worden sein, dass muss dann ja auch alles in der Originalgröße geladen werden bei so vielen Bildern. Man sieht aber dann eigentlich, dass das "Aufbauen" der Icons von oben nach unten dauert und zu einzelnen Verzögerungen beim Laden dieser kommt.
Wenn es sich um "echte" Ruckler handelt, als ob z.B. der Browser kurz einfriert, dann hat das ziemlich sicher nichts mit dem HTML/CSS zu tun, sondern viel mehr mit Gründen, die die Vorposter schon aufgezeigt haben: PC-Performance und Javascriptsachen, u.ä. -
OK, ich hab da mal etwas aus der Seite rausgeschnitten. Wenn ihr runterscrollt bei "Gossip Girl" sind mehrere Episoden noch offen, da ruckts bei mir beispielsweise. Wenn ich den JS Teil rausnehme ändert sich nichts. Das das erste Laden länger dauert ist mir bewusst, aber das ist ein anderes Problem. Wenn die Seite fertig geladen ist, selbst dann ruckt es beim Scrollen. Ich habs mit mehreren PCs getestet. U.a. mit den UNI Rechnern, und die sollten mit ihrer "Normal-USer" Performance da auch kein rucken zu sehen bekommen. Ich glaub was ich meine macht sich echt am besten verständlich wenn ihr dem Link unten folgt. Ach und danke raphael811, ich check das mal bei Gelegenheit.
http://tinyurl.com/bvryagm
Beitrag zuletzt geändert: 28.5.2012 23:41:53 von h4nni -
Ich sehe das Problem darin das ersten die Datei zugroß ist sowie die Bilder.
Diese kann man Komprimierenm, ich mache es gern mit .htaccess.
php_value output_handler ob_gzhandler
Damit bekomm ich es hin, dass meine Webseite schneller laden tut.
Unter anderem habe ich auch mit viel Include ect. gearbeitet. -
Zunächst muss ich sagen, dass ich eigentlich kein "rucken" feststellen kann.
Ansonsten kann ich mir nicht vorstellen, dass ein etwaiges Rucken einer vollständig geladenen Seite etwas mit der Ladegeschwindigkeit zu tun hat.
Ganz am Rande mal ein Tipp:
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fsve-badminton.de%2Fseries-collection%2Fseries_test.php
Weißt du, wie eine HTML-Seite aufgebaut sein muss? -
Ich muss aber auch sagen. Dein Quellcode lässt wirklich massiv zu wünschen übrig. Zu mal man ihn nach ein paar Zeilen einfach nicht mehr lesen kann, weil alle Zeilenumbrüche, Tabulatoren, etc. fehlen.
Weiterhin hab ich mal hier geschaut: http://sve-badminton.de/series-collection/
"made for firefox! other browsers won't work" Bitte was? O.o -
Welchen Browser benutzt du? Lade dir mal einen anderen Browser herunter und versuch' es nochmal.
-
"Zunächst muss ich sagen, dass ich eigentlich kein "rucken" feststellen kann."
Danke, das ist schon mal interessant.
Die Ladegeschwindigkeit hat damit NICHTS zu tun. Das sag ich ja immer wieder. Sondern einfach das was dargestellt wird. Beispiel "riesen-Hintergrundbild/foto", wenn jemand irgendein Foto direkt von der Digi auf die Seite packt, denn ruckts. Das ist bei mir nicht der Fall, aber genau dieses "Rucken" mein ich.
Browserfrage: Ich benutze FF, arbeite aber mit allen anderen. Um auch diese Frage zu beantworten. Die Seite um die es geht ist nicht öffentlich und wird nur von einem kleinen ausgewählten Kreis genutzt, daher hier der nette Firefox-Hinweis cyclobox.
Quellcode: "ich hab da mal etwas aus der Seite rausgeschnitten." Das war auch so gemeint. Das ist aus einer sonst inkludierten Codeabschnitt rausgeschnitten. Und warum da keine Zeilenumbrücke und Tagulatoren sind weiß ich nicht, im Editor sind natürlich welche. Benutze das PSPad. Ist aber auch nicht das Thema hier ;)
OK eh, zurück zum Problem. Den Abschnitt mit dem Test auf mehreren PCs bitte mal wieder vergessen. Ich hab das nämlich heute noch einmal gemacht und auf anderen läuft es weit flüssiger als auf meinem Notebook - warum auch immer! Allerdings gab es einen älteren Rechner, der auch dieses Rucken, aber auf der ganzen Seite hatte. Also nehme ich mal an die Seite hat Grundsätzlich Speed Probleme. Was es nicht sein kann:
- Vielzahl an Checkboxen
- JS, da nur minimal eingesetzt (oder doch weil schlampig? Hab von JS grundsätlzich keien Ahnung)
- Grafiken, da alle skaliert sind und die cover halt nur minimal größer sind bzw. es dafür zu wenige sind.
... -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
