Mam stronkę WWW napisaną w HTML. Oprócz index.html jest jeszcze kilka innych podstron (stronaA.html, stronaB.html itd).
Do każdej strony mam osobny arkusz CSS oraz skrypt JS, które załączam w head:
<link rel = "stylesheet" href = "katalog_CSS/index.css">
<script src = "katalog_JS/index.js" defer></script>
Czy takie podejście i organizacja są "zgodne ze sztuką"?
Jeśli tylko nie masz dużych duplikacji pomiędzy stylami, HTML i JS to jest w miarę ok.
Jeśli natomiast te style, html i JS są do siebie podobne, lub wręcz mają skopiowane kawałkiem między sobą to już jest problem.
To co wspólne, zawarte jest w pliku, który do każdej strony dołączam. To co unikalne i specyficzne dla konkretnej załączam tylko na tej konkretnej stronie.
Pytanie - jeśli nie są to tysiące czy więcej linii, nie lepiej wrzucić to do jednego pliku? Za pierwszym razem się pobierze sekunde dłużej, ale potem masz to lokalnie w cache przeglądarki i przy kolejnych podstronach plik nie będzie zasysany, tylko pobierany z pamięci podręcznej.
Masz 2 plusy:
@cerrato: mi jeszcze podrzucił pomysł, że jak korzystasz z jakiejś biblioteki, to lepiej skorzystać z CDN niż ją dołączać samemu, bo wtedy jest spora szansa że user już ją ma zcachowaną.
Co powiecie o takim podejściu? Chodzi mi o dobrą praktykę, zwyczaje itd. Wydajność nie interesuje mnie.
Mam mały projekt liczący około 10 stron (1 x index.html + 9 x *.html). Każda strona ma podpięty index.css (określa on szkielet strony) oraz swój dodatkowy arkusz CSS. Ale widzę już, że deklaracje niektórych klas się powtarzają. Przykładem jest przycisk, który umieściłem na więcej niż 1 stronie.
I teraz co, wrzucać wszystko co wspólne do jednego "wora" tj. index.html? A może lepiej dołączyć do wybranych stron 3 arkusz o nazwie wspólne.css?
Na logikę łatwiej wydaje się ogarnąć i zarządzać arkuszami liczącymi te 100-200 linijek niż jednym wielkim mającym ponad 500 linijek.
Opisany powyżej problem rozwiązuje SaSS. Pytanie tylko czy tak naprawdę te 100 czy 500 linijek to problem. Chyba nie. Pliki będą na tyle małe, że poradzi sobie z tym i IDE i ich transfer do przeglądarki. Dodatkowo możesz mieć łatwiejszą obsługę wersji CSS. Tak musisz wersjonować 10 plików.
kosmonauta80 napisał(a):
Co powiecie o takim podejściu? Chodzi mi o dobrą praktykę, zwyczaje itd. Wydajność nie interesuje mnie.
Mam mały projekt liczący około 10 stron (1 x index.html + 9 x *.html). Każda strona ma podpięty index.css (określa on szkielet strony) oraz swój dodatkowy arkusz CSS. Ale widzę już, że deklaracje niektórych klas się powtarzają. Przykładem jest przycisk, który umieściłem na więcej niż 1 stronie.
I teraz co, wrzucać wszystko co wspólne do jednego "wora" tj. index.html? A może lepiej dołączyć do wybranych stron 3 arkusz o nazwie wspólne.css?
Na logikę łatwiej wydaje się ogarnąć i zarządzać arkuszami liczącymi te 100-200 linijek niż jednym wielkim mającym ponad 500 linijek.
Większość robi tak że utrzymuje małe pliki w kodzie źródłowym, bo faktycznie maintain ich jest łatwiejszy, a potem łączy je w jedno jakimś bundlerem.