天天看點

Flying Pages:在單擊之前預加載頁面,打開網頁快得飛起

Flying Pages能夠實作:在使用者點選網頁的連結之前,就預加載這個網頁,當再點選這個網頁時,頁面便能飛速打開,能為網站優化加分。接下來,就由LOYSEO來講解Flying Pages的使用方法。

Flying Pages插件下載下傳位址:https://wordpress.org/plugins/flying-pages/,請安裝後啟用它。

你也可以在安裝之前,去示範站https://wpspeedmatters.com體驗一下,進入網站後随意點選任何文字連結,都能飛快的打開。

Flying Pages的工作原理

Flying Pages向頁面中注入了一個很小的JS代碼,約為1KB,并等待浏覽器變空閑才開始預加載螢幕内的頁面連結;此外,如果你在配置項中勾選了“僅當滑鼠懸停時進行預加載”,那麼當它發現滑鼠懸停于連結時,才預加載連結對應的頁面。

Flying Pages提供了如下配置項,進而能避免過多的預加載導緻伺服器崩潰或通路變慢。

  1. 設定延遲預加載開始時間:當浏覽器變空閑後,延遲指定時間再開始預加載螢幕中的連結;此項不作用于滑鼠懸停預加載功能。
  2. 設定每秒的預加載請求數量,通常建議設定為1,數量越大越增加伺服器負載。
  3. 選項“僅當滑鼠懸停時進行預加載”,若不勾選,那将會預加載螢幕内的所有連結,本項建議勾選,有助于降低伺服器負載。
  4. 設定滑鼠懸停延遲時間:當滑鼠懸停于連結時,延遲指定時間再開始預加載對應頁面。此項不要過大,避免使用者已經點選了,但還沒進行網頁預加載,那就失去功能的作用了。
  5. 忽略關鍵詞:用于設定不需要預加載的頁面,當URL中帶有對應關鍵詞時,都不會被預加載,此項保持預設即可。
  6. 對已登入使用者禁用預加載,建議勾選,有助于降低伺服器負載
Flying Pages:在單擊之前預加載頁面,打開網頁快得飛起

常見問題

安裝Flying Pages後,使用GTmetrix測試,發現Fully Loaded Time增加了,該怎麼辦?

當網頁上所有其他資源都已完成下載下傳并且浏覽器變得空閑時,Flying Pages才開始預加載。它不會影響TTFB或“First paint”或“Contentful paint”。如果您擔心GTmetrix中的Fully Loaded Time,請在設定中将“延遲預加載開始時間”設定為更大的數字,或者勾選“僅當滑鼠懸停時進行預加載”。

我在GTmetrix / Pingdom / Google PageSpeed Insights測試中沒看到任何改進

網頁加載完成後,Flying Pages才會預加載螢幕中的連結,這隻會提高單擊連結後網頁打開的速度,它并不能幫助您加快初始加載速度。

我需要緩存插件嗎?

每次頁面被預加載時,它都會執行一些PHP代碼和MySQL查詢,這會占用大量資源。是以,強烈建議使用WP Rocket這樣的緩存插件。

Flying Pages會增加我的帶寬用量嗎?

會少量增加,增幅甚至不足5%。因為占用帶寬的主要是視訊和圖像,它們占用了80%的帶寬;而Flying Pages僅預加載HTML頁面(通常小于30KB),并且不下載下傳其中的任何資源(如圖像,css,js)。

Flying Pages會增加伺服器負載嗎?

會的,但是,您可以減少每秒的預加載請求數量、僅在滑鼠懸停時預加載,以減少伺服器負載。