Flying Pages

外掛說明

Flying Pages 會在使用者點擊頁面連結前便預先載入頁面,這會讓使用者點擊後產生立即載入頁面的效果。

外掛運作方式

Flying Pages會為網站插入一段經過 GZIP 演算法壓縮、約莫 1KB 大小的 JavaScript 程式碼,在瀏覽器發生閒置狀況時便會開始執行。接下來外掛會偵測檢視區中的頁面,游標暫留於連結上時,便會進行預先載入。

Flying Pages 會自動進行偵測,確保預先載入行為不會造成網站停擺或執行速度大幅降低。

  • 預先載入檢視區中連結的頁面:使用 Intersection Observer 技術偵測檢視區 (使用者當下檢視的區域) 中的連結,並通知瀏覽器使用 prefetch 技術預先載入這些內容,並在連結有問題時,切換至 XHR 模式 (類似 Quicklink)。

  • 游標暫留便預先載入頁面:當游標暫留於連結上時,如果檢視區的連結內容尚未預先載入,則 Flying Pages 便會立即自動預先載入 (類似 Instant.page)。

  • 限制每秒預先載入數量:當頁面中包含太多連結時,同時預先載入全部連結會造成伺服器停擺或速度大幅降低,產生對網站使用者的不良影響。Flying Pages 使用內建的佇列方式,限制了每秒預先載入的數量 (預設每秒 3 個要求)。舉例來說,如果在檢視區中有 10 個連結,外掛會需要約莫 4 秒的預先載入時間。

  • 伺服器負載過重便停止預先載入:當伺服器回應速度變慢或傳回錯誤時,便會停止預先載入以降低伺服器負載。

  • 偵測使用者連線及偏好:檢查使用者是否處於如 2G 等慢速連線或啟用精簡模式。偵測到這些狀況時,Flying Pages 不會預先載入任何資源。

Support

Our premium products

Our free plugins

螢幕擷圖

  • Flying Pages 設定

安裝方式

自動安裝

  1. 前往 [外掛] 頁面,並點擊 [安裝外掛]。
  2. 搜尋「Flying Pages」。
  3. 在 WordPress 的 [外掛] 頁面啟用 Flying Pages 外掛。
  4. 前往 [設定]→[Flying Pages] 進行設定。

手動安裝

  1. 將完整的 flying-pages 資料夾上傳至網站的 wp-content/plugins/ 目錄中。
  2. 在 WordPress 的 [外掛] 頁面啟用 Flying Pages 外掛。
  3. 前往 [設定]→[Flying Pages] 進行設定。

常見問題集

安裝 Flying Pages 後,網站的 GTmetrix 完整載入時間有所增加,這個狀況該如何處理?

當其他資源完全下載且瀏覽器處於閒置時,Flying Pages 便會開始進行預先載入。它不會對瀏覽器開始接收資料時間、優先內容轉譯或可開始互動時間產生影響。如果網站管理員對 GTmetrix/Pingdom 的完整載入時間有疑義,請將 [Delay to start preloading] 設定為較高的數值,或設定為游標暫留於連結上時才進行預先載入。

如何檢查 Flying Pages 是否產生預期的效果?

請觀看這支影片,便會發現 [prefetch cache] 狀態的載入項目。請注意,如果啟用了 [Disable for logged in admins] 功能,請務必在無痕模式中進行測試。

這個外掛是否無法改善網站在 GTmetrix、Pingdom、Google PageSpeed Insights 的評測表現?

網站載入後,Flying Pages 會預先載入連結,並僅改善有點擊的連結的載入速度,這代表這個外掛無法提升初始載入速度。

使用這個外掛後,網站還需要快取外掛嗎?

Every time a page/link is preloaded, it executes some PHP code and MySQL queries which is resource-intensive. So it’s highly recommended to use a cache plugin like FlyingPress.

Flying Pages 會影響 Google Analytics 或其他類似服務的追蹤指令碼嗎?

Flying Pages 僅會下載 HTML 內容,並不會在外掛中執行任何程式碼,因此不會影響 Google Analytics 或類似指令碼。

Flying Pages 會增加網站主機的頻寬使用量嗎?

根據統計,網站上的視訊及圖片會使用 80% 的頻寬。Flying Pages 僅會預先載入 HTML 頁面 (通常小於 30KB),並且不會下載外掛所需的任何資源 (例如圖片、CSS、JS)。安裝 Flying Pages 後,使用的頻寬不會超過 5%。

Flying Pages 是否會增加伺服器負載?

In short, yes. But you can configure Flying Pages to limit the number of preloads per second or preload only on mouse hover which reduces the server load. Also, make sure to use a good cache plugin like FlyingPress. This will reduce server load dramatically.

如何取得技術支援?

請在官方技術支援論壇中提中技術支援要求,也可以在 WP Speed Matters 的 Facebook 社團中獲得協助。

使用者評論

2022 年 8 月 27 日
my website was immediately faster after installing this plugin, love it!
2022 年 8 月 13 日
I have been creating websites for myself and various people for a while now. As the websites kept growing the internal pages started taking longer to open. I have been thinking of moving my shared hosting to a company that is hosting only on Solid state drives, but it comes with a expensive price tag. Today I've been searching for what I would like a plugin to do and bam, Flying pages matches my search result. I immediately installed it on my 2nd website to test and instantly did what I needed for so long. Its now an hour or so later and installed on all my websites and its just great and works brilliantly with all the different cache plugins on the various sites. A big thank you to the creator/s of this. I don't often see great plugins like this without a price tag. Respect to you.
2022 年 7 月 10 日
I switched from instant.page to this plugin and couldn't believe my eyes. Thanks to this plugin, our website's page loading times are now nearly zero. It's easy to use, it's highly customizable, and gets the job done as advertised. To those who have installed this plugin and don't see immediate results, don't forget to: 1. Delete plugins that perform the same function (e.g., instant.page, quicklinks, etc.). 2. Do not delay nor defer the JS file added by this plugin (flying-pages.min.js). 3. Clear your website's cache in this order: Theme > Cache Plugin > CDN > Browser. 4. Wait 24 hours for your website's cache to build. Voilà. Your website is now equipped with an afterburner!
2022 年 5 月 13 日
This is a great plugin. Its functionality should probably just be built into the WordPress core. It's that good.
閱讀全部 73 則使用者評論

參與者及開發者

以下人員參與了開源軟體〈Flying Pages〉的開發相關工作。

參與者

Flying Pages 外掛目前已有 12 個本地化語言版本。 感謝全部譯者為這個外掛做出的貢獻。

將〈Flying Pages〉外掛本地化為台灣繁體中文版

對開發相關資訊感興趣?

任何人均可瀏覽程式碼、查看 SVN 存放庫,或透過 RSS 訂閱開發記錄

變更記錄

2.4.6

  • Updated FAQ

2.4.5

  • Fix: Missing Compatibility error

2.4.4

  • Updated shortcuts link

2.4.3

  • Updated “Optimize More” tab

2.4.2

  • [UPDATE] Added ‘/checkout’ and ‘.webp” to ignore keywords
  • [UPDATE] Minor update in JS file
  • [FIX] Cross-Site Scripting in admin settings form

2.4.1

  • [BUGFIX] Warnings and errors in Compatibility tab

2.4.0

  • [NEW] Compatibility tab

2.3.0

  • [BUGFIX] Stopped preloading when ignore list is empty
  • [NEW] FAQ
  • [NEW] Optimize more

2.2.2

  • Bug fix for Fast Velocity Minify plugin

2.2.1

  • Addtional options to mouse hover delay (0ms) and max rps (2s)
  • Disable for logged in admins by default

2.2.0

  • Moved option’s config object to window
  • Separate option for ‘preload only on mouse hover’
  • Start flyingPages() without waiting for DOMContentLoaded
  • Improved babel setup
  • Removed arrow functions for IE compatibility

2.1.2

  • Removed XMLHttpRequest and improved minification of JS file (reduce size by ~300bytes)
  • Added option ‘2 secs’ to delay to start preloading

2.1.1

  • Changing JavaScript scope to prevent conflicts with other plugins using same variables

2.1.0

  • Option to disable preloading when logged in as administrator

2.0.9

  • Disable on Internet Explorer
  • Renamed observer object to prevent conflicts with other plugins

2.0.8

  • Ignore query strings by default

2.0.7

  • Allow 1 second in delay

2.0.6

  • Better compatibility for WooCommerce
  • Prefetching on mobile using ‘touchstart’

2.0.5

  • Bug fix – Start queue only after calling main function, causing errors in browser console

2.0.4

  • Bug fix – Issues with Swift Performance cache plugin when ‘Merge Scripts’ is enabled

2.0.3

  • Bug fix – Prevent max rps from resetting to default value on plugin update

2.0.2

  • Support WordPress 4.5+
  • Copy fixes

2.0.1

  • Bug fix – Set default config on plugin update/activation

2.0.0

MAJOR UPDATE!
* Configure ignore keywords
* Configure delay for prefetching from viewport
* Configure to prefetch on mouse hover only
* Configure maximum requests per second
* Configure mouse hover delay

1.0.5

  • Bug fix – Prevent wp-admin links from preloading

1.0.4

  • Bug fix for Safari/iOS Safari

1.0.3

  • Prevent logout links from preloading

1.0.2

  • Prevent external links from preloading on hover

1.0.1

  • Support for Microsoft Edge browser
  • Prevents current page from preloading

1.0.0

  • Initial release