solutionweb

WordPress Common Errors and Solutions

Using InstantClick preload to improve the opening speed of links in the station

Friends who often visit this site may find that the opening speed of page links in this site is much faster. In many cases, clicking a link can even achieve the effect of opening in seconds without any waiting, and the experience is very sour. Today, I will introduce you to the black technology to achieve this effect-Instant Click.

The principle of InstantClick to accelerate the opening speed of links in the station
InstantClick is a JavaScript library that can speed up the opening of pages in a website. The library uses the short time before the mouse clicks the link to preload, thus realizing the effect of opening pages quickly in the sense.

Although the network bandwidth has been greatly increased, the website has not become faster, because the maximum average when loading web pages is the network delay. Delay is an inevitable physical limitation, so InstantClick uses preloading to achieve the purpose of acceleration.

Before a visitor clicks on a link, the mouse will hover over it. There is usually an interval of 200ms~300ms between mouseover or mousedown and click. InstantClick uses this interval to preload the page. So when you open the page, in fact, the page has been loaded locally, and it will be rendered quickly.

InstantClick setting method
Download the instantclick.js file
Download the minimized js file on the InstantClick download page, which is only 1.6kb.

Download link: http://instantclick.io/v3.1.0/instantclick.min.js

Import instantclick.js file and initialize it.
Load js in the footer.php widget of the theme and initialize it.






Now, InstantClick has been activated on your website. Just click a few links to try the effect.

Disable InstantClick on some links.
Disable InstantClick on a link.
The above code enables InstantClick on all links by default, saving time and effort. In some cases, InstantClick may invalidate some functional links, such as the navigation button of the slider. At this time, we just need to use the blacklist to disable the InstantClick function on these links.

To disable InstantClick on a link, we just need to add a data-no-instant attribute to the link.

Blog
Disable InstantClick on a set of links.
Sometimes, we may want to disable InstantClick on links in a certain area of the website, which is also very convenient. We just need to add data-no-instant to the parent elements of these links.

Back to top