Skip to content

Latest commit

 

History

History
139 lines (77 loc) · 5.08 KB

README.md

File metadata and controls

139 lines (77 loc) · 5.08 KB
Raw

Rangerz_Quicklink

A Magento 2 module integrates GoogleChromeLabs/quicklink, ⚡️Faster subsequent page-loads by prefetching in-viewport links during idle time.

Supported Magento Versions Latest Stable Version Composer Downloads Maintained - Yes

How it works

Quicklink attempts to make navigations to subsequent pages load faster. It:

  • Detects links within the viewport (using Intersection Observer)
  • Waits until the browser is idle (using requestIdleCallback)
  • Checks if the user isn't on a slow connection (using navigator.connection.effectiveType) or has data-saver enabled (using navigator.connection.saveData)
  • Prefetches (using <link rel=prefetch> or XHR) or prerenders (using Speculation Rules API) URLs to the links. Provides some control over the request priority (can switch to fetch() if supported).

Installation

composer require rangerz/magento2-module-quicklink
bin/magento module:enable Rangerz_Quicklink
bin/magento setup:upgrade

Usage

After installation, it will be enabled by default. You can find the configuration into Stores > Configuration > Rangerz Extensions > Google Quicklink.

Google Quicklink

  • Enable Google Quicklink

  • Enable in Backend

  • Enable in Developer Mode

Quicklink Listen Options

  • Prerender Mode

    • Default: No (Boolean)

    Whether to switch from the default prefetching mode to the prerendering mode for the links inside the viewport.Prerender and Prefetch

    Note: The prerendering mode (when this option is set to true) will fallback to the prefetching mode if the browser does not support prerender.

  • Prerender and Prefetch

    • Default: No (Boolean)

    Whether to activate both the prefetching and prerendering mode at the same time.

  • Delay (MS)

    • Default: 0 (Number)

    The amount of time each link needs to stay inside the viewport before being prefetched, in milliseconds.

  • Element

    • Default: document.body (HTMLElement|NodeList)

    The DOM element to observe for in-viewport links to prefetch or the NodeList of Anchor Elements.

  • Request Limit

    • Default: Infinity (Number)

    The total requests that can be prefetched or prerendered while observing the Element container.

  • Threshold

    • Default: 0 (Number)

    The area percentage of each link that must have entered the viewport to be fetched, in its decimal form (e.g. 0.25 = 25%).

  • Concurrency Limit

    • Default: Infinity (Number)

    The* concurrency limit *for simultaneous requests while observing the Element container.

  • Timeout (MS)

    • Default: 2000 (Number)

    The requestIdleCallback timeout, in milliseconds.

    Note: The browser must be idle for the configured duration before prefetching.

  • Priority

    • Default: No (Boolean)

    Whether or not the URLs within the Element container should be treated as high priority.

    When Yes, quicklink will attempt to use the fetch() API if supported (rather than link[rel=prefetch]).

  • Origins

    • Default: [location.hostname] (Array)

    A static array of URL hostnames that are allowed to be prefetched.

    Defaults to the same domain origin, which prevents any cross-origin requests.

    Important: An empty array ([]) allows all origins to be prefetched.

  • Ignore List

    • Default: [] (RegExp or Function or Array)

    Determine if a URL should be prefetched.

    When a RegExp tests positive, a Function returns true, or an Array contains the string, then the URL is not prefetched.

    Note: An Array may contain String, RegExp, or Function values.

    Important: This logic is executed after origin matching!

Option not supported for setting

  • timeoutFn

  • onError

  • hrefFn

Credits

Inspired by rafaelstz/magento2-quicklink

License

MIT