Webboard

Pełna wersja: Mini-optymalizacja - buforowanie styli CSS
Aktualnie przeglądasz uproszczoną wersję forum. Kliknij tutaj, by zobaczyć wersję z pełnym formatowaniem.
Ostatnio obserwując żądania do serwera przy ładowaniu kilku forów na MyBB zauważyłem, że style CSS są ładowane za każdym razem. Oczywiście, to nic złego, a przy zmianach przez administrację nawet zaleta, bo nie trzeba pisać użytkownikom rzeczy typu "zróbcie CTRL+R/CTRL+F5", no ale czy zawsze to jest potrzebne? Nie wydaje mi się, dlatego chciałbym przedstawić mini-zabieg, który pozwala te dane buforować w przeglądarce użytkownika.

W ogóle pytanie brzmi: po co to robić? Na przykładzie MyBBoard mogę powiedzieć, że ładowane są tu 3 pliki zawierające style. Pobranie każdego z nich wymaga oddzielnego połączenia z bazą, wstępnej inicjalizacji całego MyBB itd. To zawsze nieco pracy, którą można by zaoszczędzić. Można łączyć style w jeden plik, ale nie zawsze jest to pożądane, stąd wybór buforowania.

1 Edycja css.php


Edytujemy plik css.php, znajdujemy:
Kod PHP:
header("Content-type: text/css"); 

przed tym dodajemy:
Kod PHP:
$expires 3600;
header("Pragma: public");
header("Cache-Control: maxage=".$expires);
header('Expires: ' gmdate('D, d M Y H:i:s'time()+$expires) . ' GMT'); 

I to wszystko.
W zmiennej expires mamy czas w sekundach, na jaki przeglądarka powinna to buforować. Godzina to niewiele, ale przy przeglądaniu forum przez wielu stałych użytkowników, już powinno dać pewną różnicę, a zarazem na tyle krótki, że jeżeli administracja zmieni coś w stylach, względnie szybko będzie i u użytkowników. Oczywiście jeżeli na swoich forach nie zmieniacie styli zbyt często, można tam ustawić również czas równoważny tygodniowi czy miesiącowi, to już wasza decyzja.

Dlaczego nie plugin? Chciałem, ale w pliku init niestety nie ma dla nich żadnego wpięcia (pomimo, że nawet w wypadku styli css wszystkie ich pliki są załączane).
Plik css.php nie ma prawa bytu w kodzie..

Twoja poprawka - jest dobra, ale w małej części.

Szablony zapisywane w PA powinny być:
- zapisane w bazie ( jak to jest w chwili obecnej - by móc edytować z poziomu PA),
- zapisywanie stylu do pliku tymczasowego typu: cache_style.css ( gdzie plik będzie nadpisywany z każdą zmianą )

W ten sposób nie łączymy się z bazą, a mamy to samo - tylko mniej obciąża serwer.

Ponadto:
Kod:
<link type="text/css" rel="stylesheet" href="https://webboard.pl/cache/themes/theme17/global.css" />
<link type="text/css" rel="stylesheet" href="https://webboard.pl/cache/themes/theme17/mybbpl.css" />
<link type="text/css" rel="stylesheet" href="https://webboard.pl/css.php?stylesheet=146" />
<link type="text/css" rel="stylesheet" href="https://webboard.pl/css.php?stylesheet=94" />
<link type="text/css" rel="stylesheet" href="https://webboard.pl/css.php?stylesheet=130" />
<link type="text/css" rel="stylesheet" href="https://webboard.pl/css.php?stylesheet=162" />
<link type="text/css" rel="stylesheet" href="https://webboard.pl/cache/themes/theme15/star_ratings.css" />
<link type="text/css" rel="stylesheet" href="https://webboard.pl/css.php?stylesheet=167" />

Można zastąpić jednym wywołaniem takiego pliku:
Kod:
<link type="text/css" rel="stylesheet" href="https://webboard.pl/css2.php?css=cache/themes/theme17/global.css,cache/themes/theme17/mybbpl.css,css.php?stylesheet=146,css.php?stylesheet=94,css.php?stylesheet=130,css.php?stylesheet=162,cache/themes/theme15/star_ratings.css,css.php?stylesheet=167" />

Gdzie plik css2.php będzie ładował php'em całą grupę plików - dodatkowo ustawi cache ( expire time ) + z 7 requestów do serwera byłby tylko jeden a ponadto można usunąć z takich plików białe znaki co zoptymalizowało wagę tych plików przynajmniej o 20-30%.

Optymalizowałem sporo stron średnio każda ( 8 js'ów + 4 css`y ) z 12 requestów do serwera robiło się tylko 2, expire time ustawiało się na bardzo mocnego, a waga spadała o 400-1200kb ( a jest to bardzo dużo jak dla strony, a tym bardziej dla gier online czy for ).
To nieprawda ze css.php nie ma prawa występować na witrynie. MyBB używa go automatycznie w wypadku styli które są dziedziczone.
Head - decyduje który plik, powinien być tak?

Z tego co tam widzę, jest jakiś prosty query do bazy - stąd nawet pliki mogłyby się nazywać automatycznie:
css_162.css zamiast css.php?stylesheet=162


Dziwne, że nikt z MyBB na to nie wpadł.. Szukają nie wiadomo czego by zoptymalizować silnik a tutaj taka wpada..

Tutaj byłoby przynajmniej 5 głupich requestów do php i bazy mniej. Po co inicjalizować cały silnik do wczytania głupiego css z 15 regułkami ? A jeżeli faktycznie chcą to mieć, to niech zrobią to już w arrayu - ale w jednym pliku:

css.php?id=12,16,160,250
gynio, zawsze możesz sforkować MyBB na githubie i wprowadzić swoją poprawkę. Chętnie skorzystam.
(12.07.2013, 00:07)Victor napisał(a): [ -> ]gynio, zawsze możesz sforkować MyBB na githubie i wprowadzić swoją poprawkę. Chętnie skorzystam.

Dodatkowo zapraszam do rekrutacji do teamu MyBB PL jako Dev :) Przydałaby się pomocna i doświadczona dłoń.
A ja powiem tak. Przeanalizowałem CodeOut na GH i mają rację Ci którzy twierdzą że umieszczanie css'ów w dystrybucji jest zbędne. Bez CSSa forum przyjmie domyślny wygląd i tyle.

Pomijam to iż plik CSS zajmuje 0,001 MB.