[Dyskusja] Jak skutecznie przyśpieszyć witrynę

[Krzysztof Sziwa]

Czasem buszując w internecie w poszukiwaniu ważnych informacji, trafiamy na strony długo ładujące się, niezgodne ze standartami, czy zwyczajnie ze złą nawigacją i organizacją działów. Dzięki czemu, dotarcie do pożądanej informacji wydłuża się. Denerwujemy się, zazwyczaj rezygnujemy i zamykamy takową stronę.

Jakie błędy zauważacie w takich serwisach/forach?
Co robicie by uchronić swoich userów od takich sytuacji?
Z jakich sposobów/rozwiązań, czy technologii korzystacie by polepszyć ładowanie/korzystanie z serwisu?
Jakie jest wasze zdanie na temat programów wspomagających optymalzację kodu?
Co dają nam w tym temacie nowe technologie, warto je łączyć?
Na co trzeba uważać dodając skrypty do strony, które z nich są zbędne?
A może ustaliliście swoje standardy dotyczące np.: wielkości strony głównej, wielkości bannerów/buttonów, długości tekstu, czy wielkości zdjęć w gallerii?
Czy można powiedzieć że "przyśpieszanie witryn" jest jednym z elementów emarketingu?

Liczę na burzliwą dyskusję, na wasze opinie, spostrzeżenia, rozwiązania
Piszcie generalnie o wszystkim co związane z ładowaniem serwisu, jego aktualizacją, jak również łatwą dla usera obsługą...
Możnaby np. ustalić jakiś standard, schemat, łączący to w całość.
Myślę iż ta wiedza powinna się przydać początkującym, choć nie tylko...

[misz]

nie wiem czy powinienem brac udzial w dyskusji moja strona wejsciowa wazy zawsze ponad 400kb ale ... jedna metoda jest. na serwerze mozna ustawic kompresje stron - wszystkie przegladarki to akceptuja i w przypadku kodu (u mnie 100-200kb) daje to za***ste efekty - oszczednasc 90-95% (z tych 200kb wysylanych jest kilkanascie kilo kodu).

powinno sie też bardzo starannie przygotowywac grafike - sprawdzic maxymalny akceptowalny poziom kompresji w gifie i w jpg, ciac tak grafike aby pozornie (z tym cieciem tez nie jest tak do konca - wieksza ilosc plikow o podobnej wielkosci sciaga sie zdziebko szybciej) ladowala sie szybciej. przemyslany musi byc tez kod pod wzgledem wlasnie ladowania sie strony.

dobrym pomyslem jest tez wymuszanie pewnych zachowan na przegladarkach (ciastka, cache) pozwalajaca na ladowanie czesci plikow z dysku.

[Mikołaj Barczentewicz]

Skuteczne przyspiesznie ładowania strony można osiągnąć poprzez konsekwentne używanie HTML 4.01, względnie XHTML. Wymusza to oczywiście użwanie arkuszy stylów, ale naprawdę działa.

Polecam http://www.alistapart.com/. Po pierwsze ta strona sama w sobie jest przykładem świetnego wykorzystania CSS, no a po drugie jest tam dostępnych wiele gotowych rozwiązań ułatwiających życie.

Ja sam (http://www.mb.aplus.pl) staram się wykorzystać w pełni dobrodziejstwa najnowszych standardów (W3C). Na przykład kwestia menu. Gdyby ktoś chciał po staremu zrobić taki hover z białą belką pod linkiem jak u mnie to po prostu użyłby skryptu JS i obrazków. A przy użyciu CSS to nie jest potrzebne. Do optymalizacji strony wykorzystuje też PHP, dzięki temu nie muszę kopiować strony głównej (ze zmienioną treścią) jak to się zwykle robi, tylko przez funkcję include wklejam żądaną treść do index.php i po kłopocie. Oczywiście jeszcze używam funkcji switch do wyboru jaki element ma być wklejony.

[barthek]

no coz... rzeczywiscie najwiecej sie zyskuje poprzez uzywanie glebokie kompresji obrazkow... bardzo dobrym zwyczajem jest rowniez unikanie duzych obrazkow w tle i zamiast powtarzanie jakiegos malego. daje swietne efekty a zajmuje czesto tylko kilka bajtow!

co do arkuszy stylow... nie zdaje to egzaminu przy malych witrynach, jednak przy srednich i wiekszych oszczednosc transferu ogromna... (i tylez samo pracy )

moglbym napisac wiecej ale mysleze nie ma sensu powtarzac sie po miszu, z ktorym calkowicie sie w tym wypadku zgadzam...

[Gość]

Kompresja jpeg, gif to podstawa ale czasami spotyka sie sajty gdzie z kompresją trochę przedobrzono , a ogólnie na przyspieszenie strony działa też mała liczba spacji oraz używanie katalogów o jak najkrótszych nazwach (chociaz z reguły w takim przypadku kod strony staje się bardzo uciążliwy do edycji)

[burek]

Jako, że tworzę strony niemal jedynie w technologi flash wypowiem się jak to można zrobić we flashu. Po pierwsze robi się strony modułowo czyt. jest preloader główny który ładuje menu itd. Następnie każda podstrona to osobny swf i do niego również jest preloader. Nie przyspiesza to działania strony ale rozładowuje jej rozmiar na parę części a ponadto jeśli preloader jest ładnie zrobiony użytkownik nie denerwuje się. Drugą rzeczą jest pobieranie tekstu i zdjęć z folderu za pomocą odpowiednich komend. Zdjęcia nie są już w stronie ale są do niej doładowywane. Z kolei trzecią rzeczą jest jak największe "zautomatyzowanie" strony czyt. jak największa ilość czynności wykonywana jest za pomocą skryptów.

[Paweł Mączka]

Można zamiast pisać przy każdym elemencie text-align: center; definiować id, kod przez to jest krótszy. Myślę, że nie ma metody idealnej (no może taka kompresja), trzeba po prostu pisać wszystko w jak najlepszym porządku, nie używać graficznych edytorów html, nie robić wodotrysków typu animowane gify, powinno się także zamieniać często obrazki na jednolisty kolor i tekst. Co do flasha to raczej stron robionych 100% we flashu nie uznaję, może jestem tradycjonalistą, ale chodźby zajmowały dużo mniej to nigdy nie zrobię strony 100% flash.
Gdzieś widziałem też skrypt (php) który tworzy, nie każdy jest wyposarzony w taką funkcję na serwerze jak misz Ale rzeczywiście dva ładuje mi się szybko a źródło jest bardzo długie

[porneL]

Do grafik:
Używać:
JpegOptim
PNGQuant + PNGCrush + OptiPNG

Nie używać:
Photoshop

Do kodu:
Używać:
XHTML i CSS

Nie używać:
pseudoHTML, tabel i spacer.gifow

Ponadto radzę powściągliwie z Cookies, bo one upośledzają cache w przeglądarkach (plik ściągany raz jest 10x "mniejszy" od pliku ściąganego 10 razy :)

Kompresja (gzip/deflate) na serwerze to dobry pomysł, ale kod odsyfić z <font> i spółki i tak trzeba.

Mamy 2004 rok, nie trzeba już robić rolloverów za pomocą 2ch grafik. W css tło dla <a> się ustawia. Jedno i to nawet dla wszystkich razem. Detali szukaj na alistapart.com

[Piotr Bandyk]

Ja proponuje także używać XHTML oraz CSS2. Co do kodu PHP - używać jak najmniej zmiennych. jeżeli nie potrzeba tworzyć nowej to nie twórz jej.

jestem zwolennikiem stron z małą ilością grafiki, więc powiem że mało grafiki dawajcie.

Równiez zero Javy Script - jestem jej zagorzałym anty fanem.

Pozdrawiam

[porneL]

Co do kodu PHP - używać jak najmniej zmiennych. jeżeli nie potrzeba tworzyć nowej to nie twórz jej.

ROTFL. Co za bzdura

To jest tak bez sensu, że nawet nie wiem jak tą informację naprostować. Ogólnie: nawet jak stworzysz 5000 zmiennych w jednym skrypcie, to nie będzie to miało odczuwalnego wpływu na cokolwiek...
Skąd taka mitologia powstaje?

Równiez zero Javy Script - jestem jej zagorzałym anty fanem.

Javascript jest tylko narzędziem. Można użyć dobrze, przyśpieszając i ułatwiaąc obsługę strony (wstępne sprawdzenie formularzy, szybka pomoc w popup), a można zrobić padający śnieg i latające zegarki.

[Paweł Mączka]

Heh.. przecież zmienne są po to żeby przyspieszyć...

[Piotr Bandyk]

ROTFL. Co za bzdura
Javascript jest tylko narzędziem. Można użyć dobrze, przyśpieszając i ułatwiaąc obsługę strony (wstępne sprawdzenie formularzy, szybka pomoc w popup), a można zrobić padający śnieg i latające zegarki.

Ten niby mit zaczerpnełem z forum webhelpu. Nie wiem może sie myle, mam do tego prawo. Zawsze stosuje jak najmniej zmiennych i pętli. tylko to co jest potrzebne.

Co do javy script to uważam że to niepotrzebne. Po co śnieg na stronie jak można go zobaczyć na dworze?

[porneL]

Optymalizacja nie polega na tym, zeby robić mało kodu. Czasem 3 pętle będą szybsze niż jedna.
Używanie jednej zmiennej do kilku rzeczy i w kilku miejscach z pewnością skomplikuje kod i przyśpieszenie z tego żadne.

PHP jest dość wydajny i nie ma co się umartwiać nad byle zmienną. np. mam projekt, który musi załadować ok. 200kb kodu klas do wygenerowania jednej strony i nadal chodzi żwawo. Oczywiście jak ktoś ma talent to napisze i 10 linijek, które ubiją serwer

Podobnie przy SQL dużo większe znaczenie ma dobranie typów kolumn (stała szerokość danych) i strategiczne rozmieszczenie kluczy (patrz instrukcja explain) niż ilość zapytań do bazy.
Można zrobić kod wykonujący kilkadziesiąt zapytań i będzie ok, a można zbudować marną tablicę, na której jedno zapytanie będzie trwało 10 sekund...

[ableorg]

Heh panowie, czy wy oby na pewno mówicie o tym samym?? Proste rozwiązanie to sprawić aby podstrony i strona główna mało zajmowały, max 65-80bk ale te 80 to max nad max'ami!! Do tego za każdym razem zastanawiać się jak można skutecznie odchudzić www!! Do tego trzeba zrezygnować z Flash'owych www jeśli już mowa o szybkim ładowaniu. Nie można też zrobić tego co ostatnio się dzieje w Polskim necie czyli przerost formy nad treścią. Nie stosować grafiki gdzie nie trzeba... Ach no i należy się jeszcze zastanowić nad funkcjonalnością i przydatnością dla osób niepełnosprawnych. Czy oby Wasze strony spełniały wszystkie wymogi ?? hihi... moja też nie spełnia ;P

[porneL]

masz na myśli 65kb na HTML, czy całość?