We at Inspire2Rise are always on the lookout for new ways to improve our site experience. Just imagine how jumpy we became when a friend i.e. Rajesh Namase from Techlila told us about a two-line script that could make our website seem extremely fast to the end-user. From the sound of it, all of this felt too good to be true. We used to make so much content around website speed optimization at a given point of time that it almost felt like all those hours spent mastering the art of web page speed optimization was pointless. If anyone could just put in a two-line code and have a faster website wouldn’t life be so easy! But in our Instant.Page review we are going to tell you exactly about the same. It’s really that easy!
Table of Contents
Instant.Page review: What is it exactly?
So simply put the whole web works on the basis of web pages and latency. It does take some time for you to actually go through the motion of hovering over a link and clicking it. What if a site knew what you were gonna do and preload that page in the viewport in the time that it took you to hover over the said link? Exactly that’s what’s Instant.Page does.
There has been a surge in Internet bandwidth and speed in recent years. But despite that, the web, in general, seems like a slow experience. The Internet has not kept pace with the speeds of our broadband connection simply because of latency issues. Latency is the biggest roadblock when it comes to achieving really fast web performance.
As stated on their official page they found that even 100 ms of latency was responsible for a 1% drop in sales. So using something like this would easily boost your overall conversion by 1% or even more if everything else on your site was already optimized.
Instant.page review: How to install?
The installation process is pretty straightforward and simple. You just have to put this HTML code before the closing body tag i.e. </body> on your website.
<script src="//instant.page/5.1.0" type="module" integrity="sha384-by67kQnR+pyfy8yWP4kPO12fHKRLHZPfEsiSXR8u2IKcTdxD805MGUXBzVPnkLHw"></script>
If you are running a WordPress based website then it’s even easier to Install this as they have a dedicated plugin for the same.
Steps for installing Instant.page on your WordPress website:
- Go to your dashboard > Plugins > Add New
- Search for “instant.page” in the search bar at the top right
- Click on “Install Now”
- Click on “Activate”
Instant.page review: So how does it work bro?
Instant.Page employs the use of just-in-time preloading. This means that it preloads a page in that instant just before a user clicks on it.
Every time a user clicks on a link they take a microsecond or two to process that design and actually go through the whole motion of clicking. Irrespective of how advanced or well versed the user the best click speed still comes to around 150-200ms. If a user hovers on a link for more than 65ms there’s a very high probability that they are going to click on it. So Instant.page springs into action at that very instant and hence on average they have over 300 ms or more to preload the page in the background.
What this actually means for the end-user is that pages seem to load instantaneously for them.
On a smartphone users touch their display before releasing to register the action. This means that the script has an average of 90 ms for preloading the page.
Instant.Page review: Why does it feel so good?
The human brain perceives anything occurring within less than 100 ms time to be instantaneous. So the result of using Instant.page is that websites feel to be loading instantaneously even if you are on a 3G connection.
More about Instant.Page: What are the pros and cons?
In our time with this script, we have found some cons as well for this. The pros include the fact that this script only preloads the HTML of a page that it feels is going to be clicked on by the user. This ensures that your server’s bandwidth, as well as the CPUs of your users, aren’t overloaded.
The script employs the use of passive event listeners. It won’t work if the user has enabled a data saver in their web browser. The script size is only 1 kb and it loads after everything else has finished loading. The project is free and open-source under the MIT license.
The cons for this are the fact that it can’t really make your website pages faster if they are already huge in size. The script works great with server-rendered sites or large static sites. But if there’s user-generated content or huge JS or CSS files then the difference in speed isn’t that great!
In case you are really concerned about your site’s security and privacy it’s possible to self-host this script which is pretty easy.
You just have to download the latest version then add a module script tag just before </body>:
<script src="instantpage-5.1.0.js" type="module"></script>
You can also install it easily via npm:
npm i instant.page
So, guys, this was it for this review. Do let us know in the comments section below if this script really helped you out or not!
Keep visiting for more such awesome posts, internet tips, gadget reviews, and remember we cover,
“Everything under the Sun!”