Joomla! oldalunk sebessége fontos tényező, hiszen értékes látogatókat veszíthetünk, ha oldalunk betöltése túl sok időt vesz igénybe. A megfelelő sebesség eléréséhez, célszerű csökkentenünk oldalunk méretét valamint a betöltésre kerülő scriptjeink számát.

Oldalunk aktuális betöltési sebességét legegyszerűbben a GTmetrix weboldal segítségével mérhetjük le. Itt különböző tesztelési eszközök (Google PageSpeed, Yahoo Yslow) használatával térképezik fel a weboldalunk, amely végeztével egy besorolást kapunk, az elért edeményeinknek megfelelően. Hiányosság esetén további javaslatok nyújt az oldal, a jobb optimalizáció eléréséhez.

Ez előzőek alapján mielőtt elvégezzük a szükséges alapbeállításokat érdemes lemérnünk az oldalunk jelenlegi sebességét, hogy legyen egy kiindulási alapunk.

1.  Gyorsítótárazás bekapcsolása

Lépjünk be a Globális konfiguráció -> Rendszer -> Gyorsítótárazás beállításaiba, majd a válasszuk ki a BE – Konzervatív gyorsítótárazás értéket.

Hogyan gyorsíthatjuk meg Joomla! oldalunk betöltését? - 01 - Joomla Magarország

2. Gzip tömörítés bekapcsolása

Lépjünk be a Globális konfiguráció -> Kiszolgáló -> Kiszolgáló beállításaiba, majd itt kapcsoljuk be a Gzip oldaltömörítést az Igen érték kiválasztásával.

Hogyan gyorsíthatjuk meg Joomla! oldalunk betöltését? - 02 - Joomla Magarország

3. Oldalgyorsító tár bekapcsolása

Lépjünk be a Bővítmények -> Beépülőmodulok -> Rendszer - Oldal gyorsítótár beépülőmodulba, majd bal oldalon A böngésző gyorsítótárának használatát kapcsoljuk ki a Nem érték kiválasztásával, jobb oldalon pdig az Állapot beállításaiban válasszuk az Engedélyezett értéket.

Hogyan gyorsíthatjuk meg Joomla! oldalunk betöltését? - 03 - Joomla Magarország

4. JCH Optimize bővítmény letöltése és telepítése

Joomla! oldalaink gyorsításához manapság már viszonylag sok automatizált bővítmény létezik. Ezek közül az egyik legjobb a JCH Optimize. Maga a beépülőmodul automatikus optimalizációval gyorsítja fel a weboldalad betöltési sebességét, a forrás méretének, valamint a http kérések számának csökkentésével.

A bővítmény beszerzéséhez először is látogassunk el a JCH Optimize oldalára és töltsük le a beépülőmodul ingyenes verzióját (Free), vagy vásároljuk meg a bővített verziót (Pro), végül telepítsük fel az oldalunkra. Megjegyzés: a bővített verzióban további finombeállítások alkalmazhatunk, amelyek az ingyenes verzióban tiltásra kerültek.

5. JCH Optimize – Gyorsítótár lejárati idő beállítása

Lépjünk be a Bővítmények -> Beépülőmodulok -> System - JCH Optimize beépülőmodulba, majd az Alapbeállítások (Basic Options) fülben található Egyéb beállításokban (Utility Settings) találhatjuk meg a Gyorsítótár lejárati idő beállítását (Leverage browser caching).

A Gyorsítótár lejárati idő beállításával csökkenthető a betöltési sebesség avval, hogy meghatározzuk az oldalunkon található egyes oldalelemek (képek, videók, audiók, css, js stb.) betöltési gyakoriságát. Ez a funkció kifejezetten hasznos a visszatérő látogatók esetén, akiknek nem kell állandóan betölteniük azokat az oldalelemket - mint például az oldal logóját - amelyek csak nagyon ritkán változnak.

Bővebb leírás a GTmetrix PageSpeed: Leverage browser caching oldalán.

Hogyan gyorsíthatjuk meg Joomla! oldalunk betöltését? - 04 - Joomla Magarország

A gomb megnyomásával a beépülőmodul a következő sorokkal egészíti ki a .htaccess fájlunkat:

## BEGIN EXPIRES CACHING - JCH OPTIMIZE ##

<IfModule mod_expires.c>
  ExpiresActive on

# Perhaps better to whitelist expires rules? Perhaps.
  ExpiresDefault "access plus 1 month"

# cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
  ExpiresByType text/cache-manifest "access plus 0 seconds"

# Your document 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"

# Feed
  ExpiresByType application/rss+xml "access plus 1 hour"
  ExpiresByType application/atom+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 application/x-font-ttf "access plus 1 month"
  ExpiresByType font/opentype "access plus 1 month"
  ExpiresByType application/x-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 1 year"
  ExpiresByType text/javascript "access plus 1 year"
  ExpiresByType application/javascript "access plus 1 year"

  <IfModule mod_headers.c>
    Header append Cache-Control "public"
  </IfModule>

</IfModule>
## END EXPIRES CACHING - JCH OPTIMIZE ##

6. JCH Optimize – CSS és javascript fájlok egyesítése

Lépjünk be a Bővítmények -> Beépülőmodulok -> System - JCH Optimize beépülőmodulba, majd Alapbeállítások (Basic Options) fülbe, ahol a CSS és javascript fájlok egyesítése (Combine CSS and javascript files) beállítás található.

A hat ikon hat előre elkészített konfigurációt tartalmaz. Balról jobbra haladva egyre jobban nő az optimalizáció szintje, de evvel arányosan a lehetséges konfliktusok kockázata is, így célszerű lépésenként egyre nagyobb szintre állítani, majd tesztelni az oldal működését. Az első, amely a legbiztonságosabb, az-az alapértelmezett, amelyen a legtöbb weboldal működik, mivel ez a beállítás nincs hatással a fájlokra/kiterjesztésekre/bővítményekre. 

Az ingyenes verzóban az Average optimalizációs szintig, a bővített verzióban pedig az Optimum szintig tudjuk állítani az automatikus beállításokat.

Hiba esetén van lehetőség még egy-egy szint finomhangolására, ha a rákattintunk az Automatikus csoportbeállítások (Automatic Setting Group) mezőre. Itt minden esetben egy-egy szint legoptimálisabb beállítását tartalmazza, így ezeket az értékeket, csak akkor módosítsuk, ha ismerjük ezek működését.

Hogyan gyorsíthatjuk meg Joomla! oldalunk betöltését? - 05 - Joomla Magarország

7. JCH Optimize – HTML kisebbítési szint

Lépjünk be a Bővítmények -> Beépülőmodulok -> System - JCH Optimize beépülőmodulba, majd az Alapbeállítások (Basic Options) fülben található CSS és javascript fájlok egyesítése (Combine CSS and javascript files) beállításokba, ahol be tudjuk kadni a HTML kisebbetési szintjét (HTML minification level).

Itt a HTML kimenet méretének tömörítési szintjét tudjuk beállítani. Alapesetben 3 beállítás közül választhatunk (Alapvető (Basic), Haladó (Advanced), Ultra), ahol fentről lefelé a legkisebb szintről a legmagasabb szintig tudjuk beállítani a kicsinyítés méretét. Itt is érdemes legkisebb szintről haladni a legmagasabbig, folyamatos tesztelés mellett.

Hogyan gyorsíthatjuk meg Joomla! oldalunk betöltését? - 06 - Joomla Magarország

Miután végeztünk a leírásban szereplő beállítások végrehajtásával ellenőrizzük újra a GTmetrix segítségével az oldalunk értékeit, majd hasonlítsük össze a kezdeti pontjainkkal. Ha javulást tapasztalunk, akkor sikerült az oldalunk betöltésének gyorsítása.

Megjegyzés: Egyes Joomla! bővítményekben hibás működést okozhat az összerendezési és tömörítési eljárások magasabb szintű alkalmazása, így célszerű minden esetben tesztelnünk a helyes működést. Ha hibát tapasztalunk, akkor érdemes a 6. pontban található a HTML kisebbetési szintjét (HTML minification level) és/vagy az 5. pontban lévő CSS és javascript fájlok egyesítését (Combine CSS and javascript files) kisebb értéket állítanunk, vagy az Automatikus csoportbeállításokban (Automatic Setting Group) finomhangulnunk az aktuális szintet.

A Joomla! Magyarország weboldala optimalizálás előtt:

Hogyan gyorsíthatjuk meg Joomla! oldalunk betöltését? - 07 - Joomla Magarország

A Joomla! Magyarország weboldala optimalizálás után:

Hogyan gyorsíthatjuk meg Joomla! oldalunk betöltését? - 08 - Joomla Magarország

A két kép összehasonlítása után jól láthatóak a változások. A PageSpeed értéke 7%-al, a YSlow értéke 8%-al nőt. Az oldal betöltési idő 0.5 másodperccel javult, az oldal mérete ugyan 4 KB-al nőtt, de a kérések számát 39-ről 14-re csökkentettük.

0
0
0
s2sdefault
Log in to comment

spag profilkép
spag válaszolt a témára: #2 2016 márc. 10 19:35
Szia, nagyon hasznos a cikk!
Sajnos a képek nem töltődnek be (nem tudom, hogy csak nálam jelentkezik-e ez a probléma).
Feltelepítettem a JCH Optimize bővítményt .. a 7-es pontban írsz a 'HTML minification szintjének' beállításairól, én azt is az ALAPBEÁLLÍTÁSOKban találtam meg.
Ja, és nekem magyar nyelven töltődött be a JCH, a leírásodban pedig minden erre a bővítményre vonatkozó adat angolul van megadva, amin azért ki lehet igazodni, csak kicsit lassabban, azoknak, akik nem ismerik ezt a szaknyelvet annyira, akár még magyarul sem.
Semmiképp nem kioktatásból írom, ezeket, csak szimpla észrevételek, egy érdekes, informatív, fontos cikk javításához.

Köszi a leírást!
spag
Balázs profilkép
Balázs válaszolt a témára: #3 2016 márc. 11 08:40
Köszi az észrevételt! A leírás óta sok minden változott, például elkészítettük a magyar nyelvi fájlokat hozzá, valamint egyes beállítások áthelyezésre kerültek, ezért aktualizáltam a leírást.
kocsislaci profilkép
kocsislaci válaszolt a témára: #4 2016 márc. 16 17:02
Köszi a leírást!

Mostanában a szerverüzemtetővel problémánk volt, úgy belassult az oldal, hogy szinte használhatatlan volt (admin felület is), de ezekkel a beállításokkal most hasít... bár a megadott oldalvizsgáló szinte semmi javulást nem lát, de hát a 20-30 másodperces betöltődés lecsökkent pár másodpercre...

Hálás vagyok!!
kocsislaci profilkép
kocsislaci válaszolt a témára: #5 2016 ápr. 05 17:31
Balázs!

Mióta beállítottam ezeket a dolgokat, azóta a cikkeim kb.5-10 perc múlva jelennek csak meg a mentést követően. Na most nekünk van online frissülő cikkünk hetente egyszer, és hát érdekes mikor frissítem de az user meg csak 10 perc múlva látja...

Te nem tapasztaltál hasonlókat?

Köszi!
Balázs profilkép
Balázs válaszolt a témára: #6 2016 ápr. 06 22:22
A 3-ik pontban lévő Oldalgyorsító tárat, akkor kapcsold ki.
hali profilkép
hali válaszolt a témára: #7 2017 febr. 01 17:15
Felraktam a bővítményt, és látszólag minden rendben van, viszont néha nem töltődik be a főoldal (az aloldalak gond nélkül). Annyi a különbség az aloldalakhoz képest, hogy a főoldalon van egy képrotáló modul.

Ezt írja ki a böngésző: Tartalomkódolási hiba

A gyorsítótár törlésével, vagy egy kis várakozás után a probléma magától megoldódik.

Most minden úgy van, ahogy leírtad. Melyik beállításon lenne érdemes módosítani?

Előre is köszönöm!
Balázs profilkép
Balázs válaszolt a témára: #8 2017 febr. 02 10:09
Esetleg azt meg tudod csinálni, hogy annak a bővítménynek a fájljait kihagyod a tömörítésből.
hali profilkép
hali válaszolt a témára: #9 2017 febr. 02 10:56
Egy infó még lemaradt, a safari(mobilon) ezt írta:

"a safari nem képes az oldal megnyitására, a hiba ez volt: nyers adatok nem dekódolhatók"

Az a baj, hogy sehogy sem tudom reprodukálni a hibát, mert akkor legalább tudnék kísérletezni.

Érdemes lehet esetleg a ultrát egyel lejjebb venni, haladóra?
jemie profilkép
jemie válaszolt a témára: #10 2017 febr. 02 19:27
Nos, végig csináltam mindent gondoltam egy próbát megér, mivel olyan lassú az oldal mint a tetű. J 3.6.5- VM3.0.18

A Google PageSpeed szerint jelenleg mobilon 62 / 100
Asztalin pedig 78 / 100
Ez még mindig bitang lassú. Ja 12 termék van az áruházban. Bele se merek gondolni mi lesz ha felküldök 5600 terméket.


Gyorsítás beállítása után:
Balázs profilkép
Balázs válaszolt a témára: #11 2017 febr. 02 20:48

hali írta: Érdemes lehet esetleg a ultrát egyel lejjebb venni, haladóra?

Igen, célszerűbb lehet lejjebb venni, vagy kizárni az adott bővítményhez tartozó fájlokat:
Balázs profilkép
Balázs válaszolt a témára: #12 2017 febr. 02 20:50

jemie írta: Ez még mindig bitang lassú. Ja 12 termék van az áruházban. Bele se merek gondolni mi lesz ha felküldök 5600 terméket.]

Az oldalad továbbra is elég nagy méretű, először célszerű lenne azt csökkentened,
jemie profilkép
jemie válaszolt a témára: #13 2017 febr. 10 13:38
Egy érdekes ám de bosszantó problémába szaladtam bele. Néhány css-t megváltoztatott a bővítmény amit nem tudok módosítani. Pl menüpont aktív állapotban egyszínű lett a menüpont hátterével. A stílus módosításánál viszont olyan fájlra mutat ami nem létezik. Illetve a böngészőben meg tudom nyitni, de ftp-n még olyan mappa sincs mint amibe a fájl van.
Ezzel mit lehet kezdeni?
kovacshazi profilkép
kovacshazi válaszolt a témára: #14 2017 febr. 13 08:17
A JCH a Cache mappába generálja a fájlokat, de azt meg hiába szerkeszted. Valószínűleg neked rossz sorrendben fűzi össze a css fájlokat a JCH. A JCH-nak van egy gombja Pluginok rendezése, próbáld meg hogy erre rákattintasz és utána törlöd a cache-t.
Gyanítom nem lesz elég.
Akkor kapcsold ki a JCH-t és keresd meg így a css-ekben azt a css-t amiben eredetileg van a neked rossz szín a menühözrendelten és azt a sort töröld ki.
jemie profilkép
jemie válaszolt a témára: #15 2017 febr. 13 18:13
Eredetileg tökéletes. Sajnos a JCH írja át valamiért.
Balázs profilkép
Balázs válaszolt a témára: #16 2017 febr. 13 19:14
Ha nincs szintaktikailag helyesen lezárva egy szakasz, vagy egy adott osztály vagy azonosító többször is definiálva van, akkor a tömörítéskor előfordulhat, hogy ez "hibát" okoz.
jemie profilkép
jemie válaszolt a témára: #17 2017 febr. 13 19:28
Igen, valószínűleg ez lesz a gond, mert van néhány osztályom ami többször is lett definiálva. majd kitalálok valamit.