內容更新於 — 2023-06-17 22:08
AVADA是主題森林裡銷售最好的一套主題？經常聽到別人這麼說，我不確定，反正它也是經常被推薦主題之一。而我，一開始接觸WordPress的時候，便不明究理地踏進了這場災難。我不得不承認，對於剛接觸WordPress的小白兔來說，有人願意一步一步帶你進入狀況，是一件多麼幸福的事。但是，天下沒有白吃的午餐，當我們這群小白兔像群智障般地在社團中討教各種無厘頭問題的背後，其實也默默地要還債！比如說，先浪費了半年～一年忍受AVADA主題所搭建的華麗又緩慢網站，用盡心力嘗試各種網站加速的技能，直到試著切換到其他的主題之後，才願意承認，一切都是白費力氣！於是再花費一個月甚至更久的時間替換主題，清理Fushion Builder所遺留的垃圾，幫所有的文章與頁面換上各自該有的新裝，才逃離了這場災難。
寫這篇文章的時候，我還在AVADA裡；不同的是，今年初為了AVADA，將主機從SiteGround GrowBig換成了Cloudways平台中的linode 1GB（Tokyo）。我試圖竭盡所知，想要提升網站速度，最後才意識到，只要沒放棄AVADA ，一切都是枉然。
以下是同一個網站，分別套用AVADA與OceanWP主題之後，在Safari與Chrome中實際開啟網頁的速度：
測試日期：2020/4/30
主機環境：Cloudways部署的Linode 1GB(Tokyo)
比較主題：AVADA v. OceanWP
測試頁面：我的網站首頁
測試工具：電腦版Chrome無痕模式/Safari私密瀏覽
網路速度：53Mbps
測試目標：直到瀏覽器上方加載旋轉圖標停止
因為測試的這個頁面，有1個Slider含有5張尺寸為1200px的照片，以及2個文章輪播(一共42篇文章)，再加上都有使用Google Fonts。
即使切換成OceanWP，整體的頁面尺寸與請求數量還是相對龐大，不過至少比AVADA要小一點，而速度也相對要快一點。
什麼叫做卡到天荒地老？就是AVADA主題＋Google字體＋Safari瀏覽！
下面影片是我錄製使用Safari私密瀏覽打開我的首頁，影片中右上方有電腦螢幕的時間秒數，直到完整的網頁加載，一共歷時23秒…
〔16:59:47〕☞輸入網址並且按下Enter鍵
〔16:59:51〕☞終於跑完網址進入網頁，但是往下滑動頁面的過程相當卡
〔17:00:03〕☞剩最後一哩路卻又卡住了（這裏還不是最後，停下來是因為整整卡了3~4秒）
〔17:00:07〕☞網頁加載完成，終於又可以往下滑到最後了
〔17:00:10〕☞瀏覽器上方的加載旋轉停止
一共歷時23秒
AVADA主題＋Google字體＋Chrome瀏覽，情況似乎就比較正常了。
以下是我錄製使用Chrome打開我的首頁的影片，影片中右上方有電腦螢幕的時間秒數可計時。
直到第一個Slider完整出現，大約需要8秒，這並不是一個理想的網頁速度。
〔21:51:17〕☞輸入網址並且按下Enter鍵
〔21:51:18〕☞不到一秒就能進入網頁
〔21:51:25〕☞第一個Slider終於出現，後面的頁面也能完全加載，往下滑動都還算順暢。
〔21:51:26〕☞瀏覽器上方的加載旋轉停止
一共歷時9秒
一樣在OceanWP中安裝相同的Google字體以及Header與Footer樣式，無論是Safari或Chrome，大約1~2秒就能加載大多數的內容；即使遇到較為笨重的Slider Revolution，也能控制在1~2秒內完成加載；因為頁面中一共有3個Slider，所以加載完整的頁面，大約需要5~6秒。
在過去一年中，我不斷在AVADA社團、AVADA文檔以及國外的文章中，嘗試各種能夠加速AVADA網站的方法。
以下是國外文章經常建議的方式：
| 建議方案 | 實際操作 |
|---|---|
| 壓縮所有圖像 | 已經壓了，900px的圖片已控制在200kb以內，不能再低了，再低的畫質實在無法接受。 |
| 減少外掛使用，或者是只使用優良的外掛 | 我試過切換到OceanWP，一樣安裝了40個外掛，網頁完整加載速度也可以控制在1~3秒內！說明了不是外掛數量的問題，是AVADA的問題！ |
| 避免使用Slider與Carousel | 和上面一樣，別的主題都可以正常使用，為什麼使用AVADA的網站就得避免？ |
| 使用緩存外掛 | 一直都有，並且經過各種調適，讓網站在GTmerix中的表現拿到等級A，但是並沒有因此改善速度！ |
| 更新所有安裝的一切 | 我的網站永遠最新 |
| 禁用不使用的功能 | 別說是腳本與Fusion Builder的功能，我曾經試過直接將Fusion Builder與Fusion Core全部停用，但是並沒有改善速度，這完全是沒有意義的！ |
| 清理數據庫 | 只能極小幅度減少頁面尺寸，無法改善速度 |
| 使用CDN | 只能減少主機負荷，無法改善速度 |
| 升級主機 | 這是唯一能加快速度的做法，從共享主機換成VPS，網頁開啟速度有改善3~4秒，但整體速度還是不夠理想！ |
我只能說，以上所做的一切都是白費力氣！真正能解決問題的方案只有捨棄AVADA，換成輕盈的主題，網站速度就能加快3~4秒；除此之外，停用Google字體，速度又能再快2~3秒；最後，使用較輕盈的Slider外掛，還能再加快1~2秒…
即使切換到OceanWP主題，首頁仍然使用了比較笨重的Slider Revolution，一共三個！每個Slider都要1~2秒，光是等待三個Slider完整出現，就得耗時5秒！
我試過將Slider Revolution改成比較輕巧的Smart Slider 3，一樣在OceanWP主題下，開啟的速度又能再提升3秒。
以下是同一個網頁的開啟速度
都是在OceanWP主題下，啟用Google字體
分別測試Slider Revolution以及Smart Slider 3的網頁開啟速度
測試日期：2020/4/30
主機環境：Cloudways部署的Linode 1GB(Tokyo)
測試主題：OceanWP＋啟用Google字體
比較外掛：Slider Revolution v. Smart Slider 3
測試工具：電腦版Chrome無痕模式/Safari私密瀏覽
網路速度：49Mbps
測試目標：直到瀏覽器上方加載旋轉圖標停止
| Slider測速 | Safari | Chrome | 頁面尺寸 | 請求數量 |
| Slider Revolution |
6(s) | 5(s) | 9.7(mb) | 156 |
| Smart Slider 3 |
3(s) | 2(s) | 9.21(mb) | 165 |
二種Slider外掛，在頁面尺寸與請求數量並沒有太大的差異；但是在實際開啟網頁的速度上，Smart Slider 3總是能夠再加快3秒。
其實我一直困惑著，為什麼我的AVADA主題在Safari開啟的速度總是要20秒？在Chrome的開啟速度卻能在5~10秒內，這樣的落差幅度太大！
我試過別人的AVADA網站，在我的Safari開啟也沒有這樣的問題，而我的網站切換到OceanWP主題也很正常…看來問題可能是我的網站內容搭配上AVADA主題。
直到某次我突然靈機一動，不如把AVADA設定裡面的字體全部改回〔內建/預設/標準字體〕吧！
Bingo！果然是Google字體的問題！全部改用〔內建/預設/標準字體〕之後，AVADA主題在Safari開啟速度加快至少10秒，和在Chrome開啟的速度差不多了！
是呀，同樣的網站，都使用Google字體，OceanWP主題卻沒有這些問題，它在Safari與Chrome的開啟速度差距都在1~2秒內。
或許透過網路存取Google字體，總是被追求網站速度的人詬病！但是所有的問題都在AVADA主題使用Google字體，並且在Safari瀏覽器開啟網頁時一併爆發！
以下是分別使用Google字體與內建字體，測試AVADA與OceanWP這二個主題的網頁開啟速度：
測試日期：2020/4/30
主機環境：Cloudways部署的Linode 1GB(Tokyo)
測試主題：AVADA vs OceanWP
測試字體：Google Webfonts(Google字體) vs Standard Fonts(內建/預設/標準字體)
測試工具：電腦版Chrome無痕模式/Safari私密瀏覽
網路速度：51Mbps
測試目標：直到瀏覽器上方加載旋轉圖標停止
| 主題與字體測速 | Safari | Chrome | 頁面尺寸 | 請求數量 |
|---|---|---|---|---|
| AVADA+ Google字體 |
23(s) | 9(s) | 11.9(mb) | 190 |
| AVADA+ 系統字體 |
7(s) | 5(s) | 8.74(mb) | 121 |
| OceanWP+ Google字體 |
6(s) | 5(s) | 9.7(mb) | 156 |
| OceanWP+ 系統字體 |
3(s) | 2(s) | 8.67(mb) | 128 |
超級不公平吧！
我想比較以下這6位混合搭配的網頁實際開啟速度：
主題：AVADA v. OceanWP
字體：Google Webfonts(Google字體) v. Standard Fonts(內建/預設/標準字體)
Slider外掛：Slider Revolution v. Smart Slider 3
| 最快與最慢 | Safari | Chrome | 頁面尺寸 | 請求數量 |
|---|---|---|---|---|
| AVADA + Google字體 + Slider Revolution |
23(s) | 9(s) | 11.9(mb) | 190 |
| OceanWP+ 系統字體+ Smart Slider 3 |
1(s) | 1(s) | 8.13(mb) | 137 |
只要換成OceanWP，捨棄Google字體（如果你有辦法，也可以將需要的幾個Google字體儲存在主機裡），Slider外掛換成較輕盈的Smart Slider 3，就能讓含有3個Slider的網頁也能擁有1秒的開啟速度。
以上測試於Cloudways部署的Linode 1GB(Tokyo)
或許有人會說，OceanWP並不是最輕盈的主題，GeneratePress、Astra、NEVE應該更輕？甚至是WordPress內建的Twenty Twenty都行，為什麼一定要OceanWP？
以下是我曾經很瘋狂地測試了幾個公認最輕盈的主題，將這些主題套用到我的網站中，Header與Footer的樣式盡可能相似。一樣用我的龐大首頁測速，並且將笨重的AVADA當作對照組。
測試日期：2020/4/5
主機環境：Cloudways平台中的Linode/1GB/Tokyo
測試主題：AVADA v. GenneratePress v. OceanWP v. NEVE v. Astra
Slider外掛：Slider Revolution
二個文章分類輪播：SliderPack
字體：Standard Fonts(內建/預設/標準字體)
測試工具：電腦版Chrome無痕模式 & Safari私密瀏覽
網路速度：48Mbps
測試目標：直到瀏覽器上方加載旋轉圖標停止
測試結果：Astra > NEVE > OceanWP > GenneratePress > AVADA
| 5個主題測速 | Safari | Chrome | 頁面尺寸 | 請求數量 |
|---|---|---|---|---|
| AVADA | 5(s) | 4(s) | 4.03(mb) | 111 |
| Gennerate Press | 3(s) | 3(s) | 3.91(mb) | 94 |
| OceanWP | 3(s) | 2(s) | 3.68(mb) | 90 |
| NEVE | 3(s) | 1.5(s) | 3.53(mb) | 88 |
| Astra | 2.5(s) | 1(s) | 3.52(mb) | 86 |
整體來說，Astra>NEVE>OceanWP>GenneratePress。
無論如何，這四個主題的效能表現都比AVADA還要更好！
會選擇OceanWP是因為免費版能夠控制的功能最多，比較容易做出和AVADA類似的樣貌；其他的主題要嘛付費購買Pro版本、要嘛就得自學CSS、JavaScript、PHP, Python, Bootstrap, Java …等等。
既不是免費、又比別人慢，它就真的這麼不可取嗎？那得從不同的面向討論！
對於懂程式碼的人來說，免費的Twenty Twenty主題、甚至不需要任何主題，都能將WordPress網站玩到淋漓盡致。
但是對於不懂程式碼的人來說，需要靠主題的多元設定才能自訂網站的樣式，主題的功能越齊全，對新手也比較友善。
★延伸閱讀☞AVADA主題的全站樣式設定與介紹
❶US$59一次付清，終身使用＋更新；而其他主題的付費版則是得年年付費，才能獲得持續的更新。
❷購買AVADA主題，再送你7個付費外掛。
是呀，AVADA是那種少見的一次付清、終身使用＋更新的付費主題。或許有人會說，像是Astra、NEVE、OceanWP與GenneratePress都有提供免費版呀～
而真實的情況是，除了OceanWP以外，其他付費主題的免費版，都需要仰賴CSS、JS以及修改php程式碼，才能自訂全站的樣式。
除非你不需要這些額外的樣式設計，否則就得購買付費版以獲得更多的樣式功能。
像Astra就是每年支付US$59、GenneratePress則是每年US$49.95元、NEVE則是每年US$51元，否則就無法獲得更新…
至於OceanWP嘛，它雖然是裡面最便宜的，只要US$31，不過也是要年年付費才能獲得更新！
我比較了一下，OceanWP的免費版功能其實已經足夠了，不需要購買付費版，也能夠滿足大多數的樣式功能。
雖然AVADA說是送7個付費外掛，但是其中3個都是它自家的，像是Fusion Core、Fusion Builder以及Fusion White Label Branding，但是，我都用不到！
要說真的是『多送』的外掛，其實只有4個，包含Convert Plus(US$24)、Advanced Custom Fields PRO(US$49)、LayerSlider(US$25)以及Slider Revolution(US$29)。
但是呢，這4個多送的外掛當中，只有2個真的有用；而另外2個不是不好用，只是它們比較笨重！
前面已經做了相當多的速度測試，雖然說我的頁面尺寸比較大，但是別的主題卻不會因此而變成慢速網站，至少平均還能控制在3秒內完整加載！所以我又新增了6個全新的空白網站做測試：
測試日期：2020/5/2
主機環境：Cloudways部署的Linode 1GB(Tokyo)
測試主題：AVADA / OceanWP / Astra / NEVE / GenneratePress / Twenty Twenty
測試頁面：WordPress預設的範例頁面
測試工具：電腦版Chrome無痕模式/Safari私密瀏覽/GTmetrix/Pingdom
網路速度：48Mbps
測試結果：NEVE ﹥ OceanWP ≋ GenneratePress ≋ Astra ≋ Twenty Twenty ﹥ AVADA
| 主題測速 | 實開速度 | Pingdom | GTmetrix | TTFB | 頁面尺寸 | Request | 主題尺寸 | 必要外掛 | 網站總尺寸 |
|---|---|---|---|---|---|---|---|---|---|
| NEVE | 不到1(s) | 123(ms) | 0.54(s) | 171.8(ms) | 33.1(KB) | 6 | 10.71(MB) | 7.51(MB) | 59.52(MB) |
| Astra | 不到1(s) | 128.6(ms) | 0.82(s) | 219.2(ms) | 39.7(KB) | 6 | 9.24(MB) | 2.96(MB) | 54.65(MB) |
| Generate Press | 不到1(s) | 158.8(ms) | 0.72(s) | 171.6(ms) | 96.1(KB) | 11 | 6.69(MB) | 806.89(KB) | 48.61(MB) |
| OceanWP | 不到1(s) | 226.4(ms) | 0.8(s) | 167.6(ms) | 170(KB) | 7 | 17.66(MB) | 33.81(MB) | 93.86(MB) |
| Twenty Twenty | 不到1(s) | 141.2(ms) | 0.84(s) | 168(ms) | 262(KB) | 7 | 4.71(MB) | 806.89(KB) | 46.63(MB) |
| AVADA | 不到1(s) | 398.8(ms) | 1.04(s) | 175(ms) | 418(KB) | 8 | 27.26(MB) | 26.90(MB) | 97.69(MB) |
經常在社團中聽前輩們說，Pingdom與GTmetrix中的速度並不重要，網頁中實際開啟的速度才是最需要關心。
所以前面的速度測試全部都是以瀏覽器實際開啟為主！但是對於空白網站來說，無論哪個主題，都能在1秒上下開啟，根本來不及人眼計算，於是還是把Pingdom與GTmetrix中測得的秒數也拉進來比較。
Fusion Builder是AVADA自己的頁面頁面編輯器，但是它能做的實在不夠多，又不能擴展，還有一堆代碼…
主題提供的設定越多，就能更輕鬆地修改整個網站的樣式，尤其是Header與Footer的設計。
除非像是免費版的OceanWP，可以搭配免費版的Elementor設計Header與Footer，否則，通常都需要修改php檔案，這對新手來說太困難了。
AVADA能設定的功能很多，但是這也意味著，它的腳本也會相當龐大，或許這也是拖慢網站速度的主因，尤其是當這些設定包含了根本用不到的功能，更是冤枉！
比如說像是Slideshows/Elastic Slider/Lightbox/Contact Form/Youtube API Scripts/Vimeo API Scripts/Google Map Scripts/Fusion Slider/Open Graph Meta Tags/Rich Snippets/Youtube API Scripts/Vimeo API Scripts/Google Map Scripts/Fusion Slider/Open Graph Meta Tags/Rich Snippets/Fusion Builder Elements…
這麼多的功能，其實都不需要靠主題來控制，反而變成主題的垃圾腳本！
AVADA主題能夠控制的設計真的很細，尤其是與顏色相關的設定，大多數的功能都有自己專屬的顏色與尺寸設定，但是我們真的需要設定這麼多的顏色以及尺寸嗎？
再說，有些真正需要去微調的功能卻沒有支援，比如說：
ToTop Button的尺寸無法自訂，位置也無法精確調整，經常和頁面上的其他物件重疊，但是這些在OceanWP的免費版就能自由控制！
AVADA的Footer欄位寬度只能按照欄位的數量均分，除非修改主題CSS！
當然，他們後來推出了〔Theme Builder〕功能，可以使用Fusion Builder設計出1/1~6/6的Footer欄位寬度，但是這個Footer設計無法應用在Elementor編輯的頁面中，二者互相衝突！
而我就是因為不滿意Fusion Builder的頁面設計，所以才使用Elementor，結果AVADA的Footer欄位寬度又要再使用Fusion Builder，對我來說一樣無解、一樣雞肋！
雖然我也不滿意OceanWP免費版的Header與Footer樣式，但是它可以透過Elementor設計出自己滿意的樣式，再插入到主題樣式中。
AVADA有一個叫做〔Performance〕的設定，作用是為了優化網站。
包含了延遲加載、字體渲染方式、將樣式延遲加載、動態加載CSS、JS…等等。
但是我可以很肯定地告訴你，根本無法加快任何速度，還經常與其他的緩存外掛衝突，甚至可能還會讓主題樣式失效… …，無論是否開啟這些功能，改變的幅度微小到無法察覺。
AVADA有一個可以控制Google字體與Font Awesome icon的存取方式。
原本以為將這些儲存在主機裡，避免開啟網頁時還要等它從CDN加載全世界的字體與Icon，這樣應該就能改善速度。
結果一切都沒有改變，只要主題中使用了Google字體，在Safari的加載速度就是20秒，當我將AVADA主題中的字體設定改成預設的標準字體之後，才真正解決網頁在Safari的加載速度！
❶使用VPS或雲端主機
除非願意放棄速度與效能，否則共享主機供不起這尊大佛！
❷放棄Google字體
除非願意放棄那些使用Safari瀏覽網站的訪客？可能嗎？
❸別無所求的簡單網站
AVADA提供的DEMO版型的速度，大多數都能夠在3秒內完整加載！如果，不再增加額外的外掛、圖片數量、追蹤碼或腳本的話。
以前使用SiteGround的共享主機GrowBig，實際開啟網頁的速度大約需要等待2秒才能顯示網站，網頁中的每個區塊都需要再等待1~3秒加載時間才能再往下瀏覽。
搬到Cloudways平台的Linode VPS 1GB(Tokyo)之後，輸入網址後，1秒就能進入網站，並且能夠順暢地往下瀏覽後面的內容。
AVADA主題對於主機的設定有基本的需求，比如說PHP Time Limit至少180s，PHP Max Input Vars至少要1632；但是大多數的共享主機預設的數值都遠低於AVADA的基本需求，而且通常都不允許用戶提出調高的需求。
雖然說未達到基本需求並不影響主題使用，但是當要使用匯入或者是Fusion Builder Live進行編輯的時候，就會因為設定值不敷使用而失敗。
而VPS與雲端主機可自訂這些主機設定，會比較適合AVADA這類型需求量較大的主題。
★猜你想看☞從SiteGround搬到Cloudways，我回不去了
前面的實測結果已經證實了，我的網站在Safari開啟速度需要20秒，就是因為在AVADA主題中使用了Google字體，即使在AVADA的設定中，我已經啟用將Google字體儲存在主機中，但是仍然無法解決問題。
我也試過在OceanWP與GeneratePress中啟用Google字體，頂多就是變慢1~3秒的差異，並不會像AVADA那樣，在Safari中變成20秒才能開啟的龜速網站。
要嘛不要AVADA，如果硬要，那就放棄Google字體吧！
如果AVADA提供的DEMO版型中的功能剛好都能滿足需求，不需要再安裝額外的功能與腳本，大概會比較適合AVADA主題。
大家可以試著在全新的空白網站中匯入AVADA的Demo，的確可以獲得1~3秒內的網頁完整加載唷～
我知道有很多被推坑AVADA的小白兔們，都會被推薦從〔CREATIVE〕這個DEMO開始第一個WordPress網站。
所以，我就測試〔CREATIVE〕這個DEMO的原始速度，以及安裝額外功能之後的速度。
一共分成四個等級，第一級是〔CREATIVE〕的原型，之後的每一種等級都增加了更多的功能與內容：
| 級 別 | Safari | Chrome | Pingdom | GTmetrix | TTFB | 頁面尺寸 | 請求數量 | 主題尺寸 | 外掛尺寸 | 數據庫尺寸 | 上傳檔案尺寸 | WordPress尺寸 | 網站總尺寸 |
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 第一級 | 2.6(s) | 2.2(s) | 693.6(ms) | 1.92(s) | 172(ms) | 1.6(MB) | 35 | 27.26(MB) | 42.12(MB) | 6.92(MB) | 9.28(MB) | 39.45(MB) | 125.02(MB) |
| 第二級 | 6(s) | 3.8(s) | 2.11(s) | 4.55(s) | 203(ms) | 3.2(MB) | 70 | 27.26(MB) | 42.22(MB) | 8.3(MB) | 35.96(MB) | 42.2(MB) | 155.94(MB) |
| 第三級 | 5.3(s) | 7.6(s) | 12.5(s) | 6.7(s) | 176(ms) | 4.3(MB) | 160 | 27.26(MB) | 62.34(MB) | 10.56(MB) | 36(MB) | 42.69(MB) | 178.84(MB) |
| 第四級 | 5(s) | 8(s) | 4.05(s) | 15.2(s) | 138(ms) | 8.8(MB) | 133 | 45.79(MB) | 270.38(MB) | 134.5(MB) | 111.42(MB) | 577.38(MB) | 905.63(MB) |
從上面的表格就可以明顯區分出高下了：
輕盈的主題，像是Astra、OceanWP… …等等，它們的DEMO加載速度快到我來不及計算的0.x秒，即使後來加了許多內容、外掛與程式碼，只要經過調適，也不至於變成慢速網站。
至於AVADA的先天肥胖體質再怎麼調適都無法變成紙片人，要嘛不要多餵食，要嘛往配置更高級的雲端主機奔去，或許還有機會吧？
AVADA的速度真面目就介紹到這裡了！如果有任何問題，歡迎在下方的留言板討論指教囉！
wpDiscuz
Copyright ©miriammibao.com all rights reserved｜Designed by MiriamMibao温唯 Since 2014.