排行榜 统计
  • 文章总数:649 篇
  • 评论总数:10704 条
  • 分类总数:4 个
  • 最后更新:4月4日

InstantClick预加载提升站内链接打开速度

本文阅读 3 分钟
首页 网络技巧 正文
本文最后更新于2023年01月05日,已超过850天没有更新。如果文章内容或图片资源失效,请留言反馈,我会及时处理,谢谢!

您阅读这篇文章共耗时:

  预加载让你感受到网站的提速,在用户点击页面前先开始加载页面,伴随而来的是增加服务器的压力为代价的,当然这么点压力也可以忽略。毕竟现在服务器贼便宜不是吗?

   加速站内链接打开速度的原理:

   是一个能加快网站内页面打开速度的 库,该库利用鼠标点击链接前的短暂时间进行预加载,从而在感观上实现了迅速打开页面的效果。

  尽管网络带宽已经有很大增加,网站并没有变得更快,这是因为加载网页时的最大平均是网络延时。而延时是一个不可避免的物理限制,因此 使用了预加载的方式来取巧达到加速目的。

  在访问者点击一个链接之前,鼠标会悬停在链接上面。悬停()或按下()与点击(click,按下并松开鼠标)事件之间通常有200ms~300ms 的间隔, 利用这个时间间隔预加载页面。这样当你打开页面的时候,其实页面已经加载到本地了,也就会很快能个完成渲染。

  laxhtap8.png

   设置方法

  下载 .js 文件

  在 下载页面下载最小化的 js 文件,只有 1.6kb。

  下载链接:

  引入 .js 文件并初始化

  在主题的 footer.php 中件载入 js,并初始化。

   ...

    <script src="instantclick.min.js" data-no-instant></script>
    <script data-no-instant>InstantClick.init();</script>
    </body>

  现在, 已经在你网站上激活了,随便点几个链接试试效果吧。

  要在某个链接上禁用 ,我们只需要在这个链接上添加一个data-no-属性就可以了。

  <a href="https://www.chichisvip.com/" data-no-instant>痴痴资源网</a>

  如果想在某一块区域内禁用,只需要在其父元素加上这个属性就可以了

本文来自投稿,不代表本站立场,如若转载,请注明出处:http://xuan.ddwoo.top/index.php/archives/787/
-- 展开阅读全文 --
c语言程序设计第二版苏小红-C语言教程之《C程序设计语言 第2版新版》电子教材免费下载
« 上一篇 05-10
cad索引超出了数组界限-索引超出了数组界限如何解决
下一篇 » 05-16
------本页内容已结束,喜欢请分享------

感谢您的来访,获取更多精彩文章请收藏本站。

发表评论

本站已加入互联网信息服务许可,请规范您的言行哦~

成为第一个评论的人

作者信息

热门文章

珍惜时间哦~

今日一言

- -
加载中...
换一句

标签TAG

热评文章