WordPress外掛-網站加速WP Rocket

當網站完成後,我們會針對幾件事情來優化,分別是好的主機、圖片的壓縮,還有安裝快取外掛,這幾個項目都會影響到使用者開啟網站的速度。若網站開啟得太慢,使用者很容易就會跑走,另外,在Google上的排名也會被扣分。

如何挑選好的主機,可參考這篇,挑選優質的主機,絕對是會影響網站速度的重要原因,凱瑞目前的網站是Cloudway主機,在速度上絕對是享有優勢。

圖片壓縮的話,是選用ShortPixel這個外掛,可以很有效率的壓縮圖片,介面上可以輕易的設定圖片壓縮的幅度,快取外掛是選用WP Rocket,雖然這外掛沒有免費版,但這是目前最強的快取外掛,支援所有的優化功能,可以減少安裝很多其他的外掛,而且很有感的提升網站的速度。

這三項因素如果都有做好,提升網站速度大概就完成了8成左右,剩下的就不建議花太多的時間在優化其他的細節,把這些時間拿來產生優質的內容,會是比較好的選擇。

什麼是快取?

使用wordpress架站,當碰到一些問題的時候,你一定常常看到別人建議你先“清除快取”,到底什麼是快取?其實簡單來說,就是你曾經看過的頁面。

WordPress網站是動態網站,網頁上每個地方要顯示的東西都需要先進資料庫查詢,所以每一位訪客瀏覽網站的時候,若在沒有快取的情況下,就會發出數個請求訪問主機的資料庫,資料庫再吐資料呈現在網站上給訪客。

如果要查詢的東西很多,或者是說一下子有很多人來瀏覽網站,主機就會一直來回存取,花費許多的時間,甚至嚴重時主機會掛掉,為了避免這樣的情況發生,所以有網頁快取機制的產生。

快取機制可以先將你曾經看過的頁面保存起來,當下一次當你又回到這個頁面時,快取機制就會將之前的查詢記錄,產生一個靜態頁面,直接給訪客瀏覽,省去到資料庫去存取資料,這樣就可以有效率地降低訪問主機的頻率,讓主機的速度能夠更順利的運作。

所以當你在管理網站,碰到一些問題的時候,也許是有一些東西沒有清理掉,讓你還在看舊的紀錄,就可以先清一下快取,看看有沒有回復正常。

WP Rocket是什麼?

WP Rocket是市面上快取功能做得最好的外掛,提供了多種的方式去加快網頁的速度,操作介面非常容易上手,基本上都是開關就可以設定完成,而且只需要設定一次,不用常常做調整。

市面上其實有許多免費的快取外掛,但WP Rocket不只沒有提供免費的版本,付費版的費用也還蠻高的,基本方案一年要USD49,但依然是排名第一的快取外掛,可見WP Rocket功能有多強大。

許多人會嘗試安裝不同的外掛去提升網站速度,但WP Rocket就可以搞定一切,包括:預先載入連結內容、延遲載入圖片 / 影片、影片預覽縮圖、延遲載入JavaScript、資料庫清理優化…等等,功能非常的多元強大,都可以幫忙加快網站的速度,所以我們不用再另外安裝一些有的沒的其他外掛。

WP Rocket是什麼?

(圖片來源:WP Rocket

WP Rocket主要功能介紹

控制台介面設定

這部分有兩個地方需要注意,右半邊WP Rocket提供快速操作,可按這邊的按鈕即時清除快取,相同的功能,也有快捷鍵提供在Wordpress管理介面的上方。Rocket分析可以自由決定要不要開啟,可能會影響一些速度。

WP-Rocket控制台介面設定

快取

手機瀏覽網頁已經是常態,所以啟用行動裝置快取一定要開啟,可以增加不少讀取的速度,另外,最下方的快取生命週期,可設為12小時或是24小時也可。

WP-Rocket快取

檔案最佳化

CSS與JavaScript這兩個檔案主管網站的外觀視覺,有些外掛安裝後,一優化網頁就會跑掉,但是WP Rocket的優化效果就很好,不會造成頁面跑版。

針對CSS的優化,建議勾選”壓縮CSS”,可把檔案裡面所有的空白和註解刪除掉,來減少檔案的尺寸。
另外,可勾選”最佳CSS分派”,因為通常在頁面一開啟的時候,會載入所有的CSS,會造成時間過久,勾選後就只會先載入關鍵的 CSS 檔案,其他的再用非同步的方式載入,如此一來就能減少讀取的體積,提升網站速度。

其他項目建議就不要勾選,有可能會影響到前台的畫面,產生落差。

WP-Rocket檔案最佳化

針對JavaScript的優化,建議勾選”壓縮JavaScript”, 可把檔案裡面所有的空白和註解刪除掉,來減少檔案的尺寸。

可勾選”非同步載入JavaScript“,因為網頁開啟時,是一行一行讀取程式,勾選後,會另外同步載入JavaScript,避免檔案過大時,造成網頁開啟速度緩慢。

勾選”Delay JavaScript execution”會把一些不需要馬上讀取的 JavaScript 檔案延遲讀取,減少一開始就要下載的總檔案體積,一樣可減少網頁的讀取時間。

WP-Rocket檔案最佳化

媒體

延遲載入是將圖片 / 影片 / iframe 等 .. 相對大型的當案,當即將進入的使用者視線時,才進行載入動作,這樣一來,就能減少一開始就需發送的 HTTP 請求數量,所以這些選項建議都要勾選。

另外,如果有些圖片不想用延遲載入,就可以在下方區塊”Excluded images or iframes”裡面填寫圖片路徑,通常會像是網站 Logo,這種進入網站就一定會馬上看到的圖片,
路徑例如:/wp-content/uploads/2022/10/logo.png

Image Dimensions
建議勾選 “Add missing image dimensions”(補上缺少的圖像尺寸),會幫圖片加上缺少的 Width 寬度、Height 高度,減少系統還需自行判斷所耗費的資源。

內嵌
建議勾選”關閉 WordPress 內嵌功能”,可以防止其他網站,把你的網站內容(有用到Javascript運作的地方)嵌入到他們網站上,因為這會吃到你的主機流量並造成壓力。

WP-Rocket媒體

預先載入

Preload Cache (預先載入)
這邊都建議勾選開啟,若你是用Rank Math外掛,會預先載入XML Sitemap,另一個Yoast外掛,也同樣會偵測得到。

Preload Links(預先載入連結內容)
建議勾選”Enable link preloading”,這功能是只要使用者將滑鼠移到連結上面100 ms(毫秒)或更長的時間,WP Rocket就會預先讀取連結內的頁面內容,若這時使用者點擊連結,就可以超快速的瀏覽畫面。

WP-Rocket預先載入

資料庫

文章版本已經發佈的文章,如果再次點擊更新,就會留下文章版本,若不注意,同一篇文章,可能會有許多版本,不知不覺就會佔用到網站資源。

自動草稿-尚未發佈的文章,Wordpress會自動保存草稿。

回收桶文章-刪除的文章

垃圾迴響&回收桶迴響-刪除垃圾留言

臨時選項清理由外掛生成的臨時資料

資料庫清理優化資料表

最後建議每周可清除一次,另外,要注意的是,清除資料庫皆是不可復原的,建議要清之前,還是要先備份喔,避免意外發生。

WP-Rocket資料庫

結論:

基本上,上面幾個項目設定好後,網站速度的提升就會非常有感,大家可以去PageSpeed Insights裡,先測試一下自己原本網站的速度,調整過後,再去測試,就會發覺速度提升不少。

還有其他的項目設定,WP Rocket也有提供教學影片,建議有需要的話,可以先去看看。

WP Rocket雖然需要費用,但是的確可以取代不少免費的外掛,並且有效的提升網站速度,如果你非常在乎網站的速度以及有預算的話,一定要來試試看WP Rocket這外掛。

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

相關文章

Figma Config 2024

Figma 2024 Config 年會-改版內容解析

剛剛結束的Figma Config 2024 年度發表大會,讓人留下了許多的驚喜。

從軟體操作介面全面的更新-UI3,加入現在最火熱的AI生成,以及新的功能Figma Slide簡報,都可以更好的幫助設計師在工作流程以及協作上,達到更好的效率。

閱讀全文 »
2024年獲得UI/UX工作的6個關鍵

2024年獲得UI/UX工作的6個關鍵

現在因為大環境的關係,企業用人偏向比較保守,相對的來說UIUX設計師的職缺或是薪水也回到了一個平均值。

在這樣環境下,如果你想做一名UI/UX設計師或是產品設計師,該怎麼做才能脫穎而出,找到理想的工作呢?

以下我們將一起探討2024年你可以採取的6個關鍵方法,幫助你更有效率的順利找到工作。

閱讀全文 »