How I made WordPress Faster with 1KB JavaScript

WordPress Faster with 1KB JavaScript

What is Flying Pages?

Flying Pages detects all the links in the viewport and add it to a queue. Links in the queue are processed by a limit of 3 requests per second (by default). This will prevent sending a large number of requests in an instant. It will also preload links instantly on mouse hover, if not preloaded yet in the queue.

Flying Pages is also smart enough to detect slow responses and crashed servers. Whenever it detects like that, all preloading will be stopped.

Features of Flying Pages

  • Preload pages in the viewport (similar to Quicklink)
  • Preload pages on mouse hover (similar to Instant.page)
  • Limits the number of preloads per second
  • Stops preloading if the server is busy
  • Understands the user’s connection and preferences
  • 1KB gzipped

How it works?

Flying Pages injects a tiny JavaScript code (1KB gzipped) that waits until the browser becomes idle, detect links in the viewport (also on mouse hover), and prefetch them so that browser doesn't have to wait while navigating through pages.
  • Prefetch pages in the viewport – Detect links within the viewport (current viewing area) using ‘Intersection Observer’ and tells the browser to prefetch them using ‘prefetch’
  • Prefetch pages on mouse hover – On hovering links, if it’s not prefetched yet using above ‘viewport’, then Flying Pages will prefetch them instantly (similar to Instant.page).
  • Limits the number of prefetches per second – If your page has too many links, prefetching all at the same time will cause the server to crash or slow down the website to visitors. Flying Pages limits the number of prefetches per second (3 req/sec by default) using an in-built queue.
  • Stops prefetching if the server is busy – In case the server starts to respond slowly or return errors, prefetching will be stopped to reduce the server load.
  • Understands user’s connection and preferences – Checks if the user is on a slow connection like 2G or has enabled data-saver. Flying Pages won’t prefetch anything in this case.

WordPress Faster with 1KB JavaScript

WordPress Plugin

Prefetching links to logout, cart page, etc can cause issues. So we need to exclude such links as well as few other options like:
  • Set maximum requests per second
  • Delay to start prefetching
  • Mouse hover delay
  • Disable for logged in admins
The Flying Pages WordPress plugin comes with a settings panel to configure all these:

WordPress Faster with 1KB JavaScript

Demo?

Check out the demo at WP Speed Matters.

Documentation

Check out the documentation at GitHub.

Contributors & Developers

“Flying Pages by WP Speed Matters” is an open-source software. The following people have contributed to this plugin.

Hope this article helps you 😄

Post a Comment

0 Comments