Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [css][js][PHP?] Kilka pytań związanych z dołączaniem plików .css oraz .js na stronie WWW
Forum PHP.pl > Forum > Po stronie przeglądarki
tomasz.fabiszewski
Witam serdecznie,

jest to mój pierwszy post na tym forum. Mam do Was drodzy koledzy i koleżanki kilka pytań związanych z osadzaniem deklaracji plików .css oraz .js wewnątrz dokumentu .php

Spotkałem się parę razy z sytuacją, że w źródle strony pojawiają się deklaracje typu:
  1. <link rel="stylesheet" href="http://www.strona.pl/plik.php/plik1.css,plik2.css......,plikn.css" type="text/css" />

  1. <script type="text/javascript" src="http://www.strona.pl/plik.php/plik1.js,plik2.js......,plikn.js"></script>


Gdzieś wyczytałem, że taki mechanizm wczytywania plików .css i .js jest zabiegiem związanym z dobrym cachowaniem.

Moje pytania są następujące:

1. Czy moglibyście mi napisać na czym konkretnie polega ten sposób "łączenia plików"? czy potrzebna jest do tego jakaś klasa .php bo jakiś plik .php raczej na pewno (tak wnoszę po konstrukcji osadzenia plików)
2. Czy każdy plik .css i .js mogę w ten sposób osadzić, czy może są jakieś wyjątki gdzie muszę dany plik .css lub .js zadeklarować tradycyjnie (oddzielnie) ?
3. Czy taki sposób osadzania plików .css jest lepszy niż miałbym zadeklarowany jeden plik .css a w nim resztę plików .css na zasadzie: @import url('plik1.css'); @import url('plik2.css');.....@import url('plikn.css');
4 Gdzieś doczytałem, że nie powinno się deklarować plików .js w sekcji <head> tylko na końcu dokumentu - czy to prawda i czy rozwiązanie o które pytam, można zastosować na końcu dokumentu....?

Wiem że zadałem kilka pytań, ale wszystkie się ze sobą łączą i nie ukrywam, że mnie nurtują. Będę wdzięczny za odpowiedzi osób z większym doświadczeniem. Chętnie przeczytam wszystkie odpowiedzi, za które z góry dziękuję.

Jeżeli zadałem pytanie w nieodpowiednim dziale, proszę Moderatora o przeniesienie wątku lub informację.

Jeszcze raz dziękuję za odpowiedzi.

Pozdrawiam, Tomek
croc
Witamy, witamy smile.gif

  1. Poczytaj o tym jak działa PHP i każdy inny język wykonywany po stronie serwera. PHP przy imporcie plików JS/CSS nie ma żadnego wkładu, <link> czy <script> to zwykłe znaczniki HTML jak każde inne.
  2. Nie ma takich sytuacji. Kod CSS/JS dołącza się dokładnie w taki sposób jakbyś sam dodał ręcznie
    1. <style type="text/css">kod stylów</style>
    czy
    [JAVASCRIPT] pobierz, plaintext
    1. <script type="text/javascript">//kod skryptu</script>
    [JAVASCRIPT] pobierz, plaintext
  3. Żaden nie jest lepszy/gorszy. Jeżeli masz jakieś duże arkusze, to warto połączyć je wewnątrz i zachowując tym samym porządek.
  4. Niektórzy tak robią, bo strona zdąży się wtedy załadować i masz już wtedy dostęp do elementów strony. Ja jednak wolę umieszczać w sekcji <head>, a zdarzenia, które dotyczą obiektów wywoływać z window.onload.


Mam nadzieję, że pomogłem rozwiać wątpliwości.
tomasz.fabiszewski
dziękuję za przywitanie odpowiedź winksmiley.jpg

Odnoszę wrażenie, że nie do końca się rozumiemy. Generalnie znam podstawy języka PHP i znam zasady klasycznego deklarowania plików .css oraz .js w strukturze dokumentu WWW. Wiem, że można dołączyć pliki zewnętrzne jak również deklarować kod bezpośrednio w dokumencie. Moje pytanie dotyczy deklaracji plików .css oraz .js w sposób jaki przedstawiłem w pierwszym poście, czyli:
  1. <link rel="stylesheet" href="http://www.strona.pl/plik.php/plik1.css,plik2.css......,plikn.css" type="text/css" />

  1. <script type="text/javascript" src="http://www.strona.pl/plik.php/plik1.js,plik2.js......,plikn.js"></script>


zwróć uwagę, że w składni powyższych linii znajduje się: "plik.php, po którym po przecinku są wypisane wszystkie pliki .css oraz adekwatnie .js, czyli zamiast mieć 10 linii z deklaracją 10 plików .css lub .js mam jedną linię w której jest wszystko (podobno jest to związane z dobrym cachowaniem). Właśnie do tego typu konstrukcji odnosiły się w dużej mierze moje pytania winksmiley.jpg

Mimo wszystko, dziękuję za odpowiedź i czekam na kolejne.

pozdrawia, Tomek.
croc
Aha rzeczywiście, nie zauważyłem tych deklaracji biggrin.gif

Wiesz co, to nie jest standardowa składnia. Myślę, że to są pliki PHP składające kilka plików CSS/JS w jeden. Pytanie tylko po co, bo bardziej czytelnie jest mieć osobne deklaracje. Możesz pokazać przykładową stronę, która zawierała taką deklarację?
karolrynio
Cytat(croc @ 15.05.2010, 22:39:30 ) *
Pytanie tylko po co, bo bardziej czytelnie jest mieć osobne deklaracje.

Np po to, żeby zamiast 5 zapytań do serwera było tylko jedno.
Zobacz jak jest na wp.pl na przykładzie pliku:
http://www.wp.pl/i/ivar/layout/200812/xngIcons.gif?2
Kilka obrazów połączone w jeden, tak samo możesz robić z plikami css i js.
thek
Jako że pierwsze 3 opisano jakoś to napisze nieco o pytaniu 4. Częściowo już na nie odpowiedział croc. Wstawianie JS poza head związane jest bowiem z optymalizacją strony. Zauważ, że wiele osób załącza skrypty, które tak naprawdę do momentu użytkowania strony nie robią nic. Można powiedzieć, że dopóki strona się nie załaduje, żadna lub prawie żadna funkcja skryptu nie bierze udziału w procesie. Na koniec dopiero eventowe w określonych sytuacjach interaktywnych z użytkownikiem. Większość więc nie musi być załączana od razu. Ładowanie skryptu niestety zatrzymuje działania przeglądarki, gdyż musi ona przetworzyć go. Skrypty i CSS bowiem mają działanie blokujące, gdyż muszą zachować kolejność wywołania, a zmiany w nich mogą następować kaskadowo. Wyjście jednego skryptu może być wejściem do innego. Dlatego też powinno się dzielić kod na kilka fragmentów: te potrzebne od razu i te ładowane później. JavaScript nie jest wielowątkowy i raczej nigdy to nie nastąpi patrząc na podejście jego twórców ( "Po moim trupie!" ), co wydaje się zrozumiałe. Można to obchodzić ( XHR Injection, Web Workers, Iframe i kilka innych technik ), ale należy się liczyć nie tylko ze zwiększeniem szybkości, lecz także możliwymi błędami ( requested object is null i inne takie ). Możesz sam problem zobaczyć używając Firebuga z wykresem kaskadowym ładowania lub po wejściu na stronę mocno JS używającą, mając czysty cache dla niej. Ładowanie skryptów będzie długo trwało zanim wyświetli się zawartość, gdy wszystko w head wepniesz. Jeśli temat Cię interesuje to są książki o tej tematyce ( http://helion.pl/ksiazki/jeszcze_wydajniej...ders,jewywi.htm ). Sam się właśnie z zalinkowaną zapoznaję smile.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.