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.

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

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)