Jak "ciężki" plik .css to duży plik?

0

Witam, mam takie, może niecodzienne, pytanie.
Jak "ciężki" może być plik .css aby był rozważany jako duży plik?

O co chodzi.
Jak wiadomo gdy mamy kilka plików .css na stronę mamy więcej zapytań. Jednak gdy scalimy je w jeden plik to mamy, tu niespodzianka ;), większy plik do pobrania ale mniej zapytań. Do tego dochodzą często też style od różnych pluginów. Czy je też warto łączyć?

Gdzie wg was przebiega granica?
Czy plik 100 kb to dużo? A może 200 kb? Czy warto je dzielić? Jeżeli tak to na ile plików?

Wg mnie duże pliki .css to takie które przekraczają 150 kb. Jednak w dobie dzisiejszego internetu i szybkich łącz nie przejmowałbym się rozmiarem dopóki nie przekroczy on 200 kb. Co się tyczy łączenia i dzielenia plików sprawa jest o tyle trudniejsza jeżeli wykorzysujemy różne style na różnych podstronach. Jeżeli połączymy wszystkie będziemy mieli zapewne dużo klas z których nie korzystamy, jeżeli nie to może się okazać, że kopiujemy kod i (tu koło się zamyka) mamy dużo zapytań. Natomiast sprawa .css'ów od pluginów jest dla mnie prosta: nie łączyć ze względu na to, że jak będziemy chcieli coś małego zmienić możemy się nie doszukać.

Jakie jest wasze zdanie na ten temat?

0

Dla mnie 100 kB to duzo. Jak dla mnie to nawet 50 kB to sporo. Mozesz zmniejszyc rozmiar pliku CSS stosujac np. yuicompressor (usuwanie znakow nowej linii, spacji itp). Mozesz rowniez wlaczyc kompresje gzip na serwerze oraz wlaczyc cachowanie pliku po stronie przegladarki.

Jestem rowniez zwolennikiem dzielenia plikow na mniejsze kawalki i dolaczac odpowiednie CSS tylko tam gdzie jest to potrzebne.

0

FIZYCZNIE pliki trzymaj rodzielone, ale na produkcji odwołuj się do jednego pliku, który z automatu łączy wszystkie "częściowe" - masz ład przy developerce oraz mało requestów na produkcji.

Jestem przeciwnikiem tego, co mówi @Adam Boduch pliki CSS nigdy nie są tak duże, żeby warto było na jednej podstronie załadować 30kB, na drugiej osobno 30kB i na trzeciej osobno 30kB (a potem cache tych wszystkich, ale to też jakieś zapytanie na które otrzymujemy Not Modified), zamiast raz zaserwować 90kB i mieć spokój. Ostatecznie mamy i tak sporo requestów, a czasem możemy zaoszczędzić dajmy na to 60kB bo użytkownik nie odwiedzi stosownych podstron. Ale 60kB oszczędzimy rozsądnie kompresując swoje pliki graficzne (co mało kto robi, a jakby przekompresował layout jakiejkolwiek strony - bezstratna kompresja png - to na pewno się oszczędzi ze 100kB).

0

@magooPL: raczej staraj się odpowiadać postem jak piszesz na temat (co z tego, że krótko, ale na temat), bo ciężko mi odpowiedzieć coś dłużej w komentarzu.

a potem łączyć wszystko w jeden plik za pomocą importu i używam go na każdej podstronie

czyli robisz jeden plik i w nim masę @import-ów? to robisz jeszcze jedno ekstra żądanie :p chyba, że chodzi Ci o jakąś właściwość Twojego IDE

0

@dzek69: OK, postaram się częściej używać postów :)

@import dzieje się po stronie IDE i wtedy jest tworzony jeden plik. Przeglądarka dostaje już jeden, dłuższy gotowy już plik.
Dodatkowo w sass podczas kompilacji można ustawić konkretny styl pliku końcowego (4 do wyboru, w wym właśnie skompresowany).

Może podam przykład. W pliku style.scss mam 5 @importów po 100 linijek każdy. Po kompilacji mam jeden plik style.css z 500 linkami kodu.

0

nie znam sass szczerze to nie wiedziałem co masz na myśli ;)

0

Jeżeli tworzysz sporo css'ów to polecam. www.sass-lang.com
Proste w obsłudze i nauce, a oferuje sporo możliwości. Najważniejsza cecha jak dla mnie to możliwość stosowania zmiennych :)

P.S.: Ich "konkurent" to LESS. www.lesscss.org

1 użytkowników online, w tym zalogowanych: 0, gości: 1