Optymalizacja wydajności otwartych CMS-ów

Gotowe frameworki, w tym CMS-y, zazwyczaj nie są zoptymalizowane pod kątem wydajności. Aby je poprawić, czasami trzeba znaleźć sensowne obejście.

Do podstawowych wad gotowych rozwiązań (również otwartych) należą:
– zbyt duża ilość zapytań HTTP
– umieszczenie kodu JavaScript w treści strony
– brak optymalizacji dla wielkości obrazków
– itp.

Należy więc zastanowić się nad możliwymi rozwiązaniami:
1) pisanie własnych stron „z palca” – co oznacza również większe nakłady na utrzymanie takiego rozwiązania
2) modyfikowanie istniejących rozwiązań – co niestety uniemożliwia szybką aktualizację do najnowszej wersji danego frameworku
3) rozwiązania typu workaround.

Ponieważ wiele stron bazuje na rozwiązaniach opartych na frameworku Joomla boryka się z problemem wydajności, zdecydowaliśmy się na przedstawienie rozwiązania „dookoła”. Zarządzanie optymalizacją ilości zapytań oraz cache-owania treści rozwiązaliśmy poprzez plik .htaccess.

Poniżej prezentujemy grafikę dla rozwiązania bez optymalizacji. Na audycie uzyskanym w narzędziu YSlow widoczna jest duża waga strony, gdzie większość stanowią obrazki, w drugiej kolejności JavaScript oraz CSS-y. Jest to narzut na atrakcyjność wizualną strony oraz na responsive design.

bufor-przed-optymalizacja-testerzy

Po optymalizacji udało się znacząco zminimalizować ilość danych do pobrania po buforowaniu.

bufor-po-optymalizacji-testerzy

Widoczne jest, że udało się zredukować ilość zapytań z 65 do 4 oraz wagę strony do pobrania z 140K do 15,2K.

Optymalizację uzyskano poprzez ustawienie reguł w nagłówkach. Jest to optymalizacja buforowania (cache’owania) informacji ze strony w oparciu o trwałość/wygaśnięcie ważności dla poszczególnych elementów.
W praktyce wygląda to następująco:
– wszystkie elementy strony pobierane są przy pierwszy pobraniu
– część elementów jest przechowywanych lokalnie na komputerze dla szybszego „ładowania” się strony przy kolejnych odwiedzinach
– dla części spośród elementów definiuje się czas ich trwałości
– jeśli przeglądarka ponownie zapyta serwer o daną stronę, to pobierze tylko nowe elementy plus te, dla których czas ważności upłynął.
W naszym przypadku uzyskano to dzięki wpisom w pliku .htaccess:


<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault                          "access plus 1 month"
# cache.appcache
ExpiresByType text/cache-manifest       "access plus 0 seconds"
# html
ExpiresByType text/html                 "access plus 0 seconds"
# data
ExpiresByType text/xml                  "access plus 0 seconds"
ExpiresByType application/xml           "access plus 0 seconds"
ExpiresByType application/json          "access plus 0 seconds"
# rss feed
ExpiresByType application/rss+xml       "access plus 1 hour"
# favicon (cannot be renamed)
ExpiresByType image/x-icon              "access plus 1 week"
# media: images, video, audio
ExpiresByType image/gif                 "access plus 1 month"
ExpiresByType image/png                 "access plus 1 month"
ExpiresByType image/jpg                 "access plus 1 month"
ExpiresByType image/jpeg                "access plus 1 month"
ExpiresByType video/ogg                 "access plus 1 month"
ExpiresByType audio/ogg                 "access plus 1 month"
ExpiresByType video/mp4                 "access plus 1 month"
ExpiresByType video/webm                "access plus 1 month"
# htc files  (css3pie)
ExpiresByType text/x-component          "access plus 1 month"
# webfonts
ExpiresByType font/truetype             "access plus 1 month"
ExpiresByType font/opentype             "access plus 1 month"
ExpiresByType font/woff                 "access plus 1 month"
ExpiresByType image/svg+xml             "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
# css and javascript
ExpiresByType text/css                  "access plus 2 months"
ExpiresByType application/javascript    "access plus 2 months"
ExpiresByType text/javascript           "access plus 2 months"
<IfModule mod_headers.c>
Header append Cache-Control "public"
</IfModule>
</IfModule>

Testerzy.pl (http://testerzy.pl/artykuly/optymalizacja-wydajnosci-otwartych-cms-ow)