Zastanawiam się, czy lepiej jest zrobić jeden lub kilka plików dla plików CSS?Aby uzyskać więcej informacji, użyj jednego lub kilku plików CSS?
Zawsze widzę strony internetowe z dużą ilością plików css, ale to seems better, aby używać tylko jednego dużego pliku.
Jaka jest twoja rada?
Wydajność jest lepsza dzięki jednemu plikowi, ponieważ skutkuje jednym połączeniem i żądaniem na serwer (są to zazwyczaj kosztowne operacje, czasochłonne).
Z tego powodu istnieją struktury, które łączą ze sobą wszystkie pliki CSS (i JavaScript) dla każdej strony i udostępniają je w jednym żądaniu.
Cóż, tak samo jak w przypadku Yahoo !: Użyj jednego, aby zmniejszyć liczbę żądań HTTP.
Różne żądania HTTP nie są tutaj wąskim gardłem, ostatecznie rozmiar pliku. Powodem, dla którego najlepiej jest dzielić sprawy tak często, jak to możliwe, jest to, że jeśli chcesz zmienić pewną rzecz w odczuciu witryny, powiedzmy, czcionkę wszystkich nagłówków, chcesz zmienić jeden plik/ustawienie tylko dla tego i chcesz ten plik jest tak mały, jak to tylko możliwe.
W przypadku dużych i obejmujących arkuszy stylów CSS utworzyłbym różne dokumenty CSS dla różnych rzeczy, takich jak układ, traktowanie klas itd. Kolejną zaletą jest to, że jeśli masz wiele stron, które wymagają nieco innego wyglądu niż strony głównej, muszą tylko połączyć się z jednym innym plikiem CSS, a nie z zupełnie innym, większością, którą stanowią część.
Tak, gdy wszystkie pliki css zostaną załadowane i zapisane w pamięci podręcznej w przeglądarce, wystarczy załadować mały, który rzeczywiście się zmienił zamiast ładować wszystko. –
Rzeczywiście, coś, co jeszcze przeoczyłem, nie trzeba też wiele przeładowywać po aktualizacji lub jeśli niektóre części witryny używają nieco innego CSS. Robię to tylko dla organizacji, ale zazwyczaj mój CSS dzieli się między frame.css (umieszczenie) colours.css, fonts.css et cetera. – Zorf
Nie zgodziłbym się z tym. Obciążenie połączeń HTTP w większości przypadków * znacznie * przewyższa ilość pobieranych CSS. Nawet 30-tysięczny plik css widziałby do 50% całkowitego czasu pobierania jako obciążenie na żądanie, a rozdzielenie go tylko zwiększyłoby to. – womp
Wiele plików jest dobre dla organizacji, ale jedno żądanie do serwera jest zdecydowanie najlepsze. Jeśli oglądasz filmy o skuteczności od Google, sugerują one najmniejszą możliwą liczbę żądań HTTP. Każde żądanie HTTP ma narzut w uścisku dłoni, którego nie chcesz ponosić, jeśli chcesz, aby Twoja strona była szybka.
Sprawdź to świetny scenariusz, który będzie przyjmować wielu CSS/pliki JS i przekształcić je w jednym pliku:
Dla najszybszych pobierania i renderowania strony, zasady skuteczności Yahoo są prawidłowe . Chcesz jak najmniej żądań http.
Jednak na wielu stronach po prostu nie jest wygodnie mieć pojedyncze duże pliki CSS. Najlepiej jest zorganizować swój CSS na dowolną liczbę plików, a następnie użyć skryptu po stronie serwera do połączenia plików. GZIP'ing ten plik też ma długą drogę.
Jedna rzecz do zapamiętania, aby zminimalizować pliki, zanim użytkownik kiedykolwiek dotrze. Zminimalizowanie podczas ładowania strony często może trwać dłużej niż ładowanie kilku plików. – GSto
Absolutnie używam http://groups.google.com/group/minify, aby zajmować się minifikacją, i tworzy pamięć podręczną połączonych, zminimalizowanych plików i obsługuje je, więc nigdy nie jest wykonywane w locie. –
powinieneś użyć więcej niż jednego pliku css zamiast używać jednego dużego pliku. Pomaga w utrzymaniu witryny w różnych punktach w różnych definicjach (classe lub id), inaczej zajmie się tym, który zadeklarował później.
Ale dla reasone wydajności można użyć jednego dużego pliku, ponieważ, Jeden duży plik CSS prowadzi do mniejszej liczby żądań HTTP, co może poprawić wydajność.
Kilka mniejszych plików ułatwia organizację, co sprawia, że projektowanie i konserwacja są tańsze i łatwiejsze.
Nie używaj zbyt wielu różnych plików CSS lub przynajmniej próbuj umieścić je w innych domenach, aby przyspieszyć pobieranie ich przez przeglądarkę. Proponuję również użyć minification tool.
Grz, Kris.
Mając jeden plik CSS nie tylko pomóc z żądań HTTP, będzie to również daje lepszą kompresję (ściskającej jeden duży plik powinien dać lepsze rezultaty niż kompresji wielu mniejszych plików).
Jeśli wydajność ma spraw do ciebie
Następnie
Jeśli witryna jest mały, ale dostaje ogromny ruch a następnie przejść do jednego pliku css
jeśli strona jest małe osobistych lub biznesowych witryn, ale potem przy mniejszym natężeniu ruchu, przejdź do wielu css
Jeśli CSS Pliki konserwacji robi sprawy do ciebie
Następnie
Jeśli witryna jest mały z mniej różnych stronach a następnie przejść do jednego pliku css.
jeśli strona jest duża a następnie przejść do wielokrotnego css http://www.killersites.com/blog/2008/how-to-organize-css/
żądania HTTP plików CSS nie będzie duża różnica w wydajności małym miejscu.
Moja strategia jest prosta. oddzielić od rozwoju produkcji, zarówno w plikach CSS i JS w plikach. w rozwoju, mogę mieć maksymalnie 20 plików JS i 10 pliki CSS, organizacja jest bardzo śliski i łatwe, zawsze wiem, gdzie co jest.
W produkcji wszystkie pliki są zamieniane na pliki 1js i 1css, zmiany są zawsze wprowadzane w fazie rozwoju, a następnie "etapowe" do produkcji, więc zyskuję możliwość konserwacji aplikacji i wydajności w produkcji.
używam Yahoo minifier do minify moje pliki, ale można użyć, co jest wygodne dla Ciebie.
Powodzenia
+1. Takie podejście podjąłem i jest to najlepsze z obu światów, świetna łatwość konserwacji/organizacji i świetna wydajność. Jedyny wyjątek, jaki robię, to ściąganie jQuery z serwera Google, ponieważ jest to często buforowane na komputerach użytkowników. – GSto
Zważcie to.
Zalety jeden plik CSS
Zalety wielokrotności
Naprawiłem literówkę i niektóre obudowy. Mam nadzieję, że nie masz nic przeciwko. Jeśli chodzi o odpowiedź ... absolutnie poprawne. :) –
@Gert - Zawsze mile widziane są takie poprawki. Jest to jedna z rzeczy, które sprawiają, że TAK jest świetny :) – Oded