本文作者:非李莫属

zblogPHP增加pjax功能,大写的一个“帅”字

非李莫属 3年前 ( 2016-06-21 ) 3176 3条评论
摘要: zblogPHP增加pjax功能,大写的一个“帅”字。现在现在很多网站都有这样的一种浏览方式, 当你点击一个站内的链接的时候,页面没有跳转,只是本页内面刷新一下。这样的用户体验,比...

哈哈,紧跟时代潮流,李洋博客增加最新最炫的pjax功能。大写加粗的一个字,呵呵!

很久没写博客文章了,最近移植博客主题,弄上隐了,哈哈。言归正传,说说新功能pjax:

zblogPHP增加pjax功能.png

什么是pjax?

现在现在很多网站都有这样的一种浏览方式, 当你点击一个站内的链接的时候,页面没有跳转,只是本页内面刷新一下。这样的用户体验,比起整个页面都闪一下来说,好很多。其中有一个很重要的组成部分,这些网站的ajax刷新是支持浏览器历史的,刷新页面的同时,浏览器地址栏位上面的地址也是会更改,用浏览器的回退功能也能够回退到上一个页面。那么如果我们想要实现这样的功能,我们如何做呢?

为什么要用pjax,有好几个好处:

(1)用户体验提升。

页面跳转的时候人眼需要对整个页面作重新识别,刷新部分页面的时候,只需要重新识别其中一块区域。自从我在自己的网站上采用了pjax技术后,不由觉得访问其他只有页面跳转的网站难受了许多。同时,由于刷新部分页面的时候提供了一个loading的提示,以及在刷新的时候旧页面还是显示在浏览器中,用户能够容忍更长的页面加载时间。

(2)极大地减少带宽消耗和服务器消耗。

由于只是刷新部分页面,大部分的请求(css/js)都不会重新获取,网站带有用户登录信息的外框部分都不需要重新生成了。虽然我没有具体统计这部分的消耗,我估计至少有40%以上的请求,30%以上的服务器消耗被节省了。

坏处我觉得也有:

首先是IE6等历史浏览器的支持,虽然我没有实际测试,但是由于pjax利用到了新的标准,旧的浏览器兼容会有问题。不过pjax本身支持fallback,当发现浏览器不支持该功能的时候,会回到原始的页面跳转上面去。

其次是复杂的服务器端支持,服务器端需要根据过来的请求,判断是作全页面渲染还是部分页面渲染,相对来说系统复杂度增大了。不过对于设计良好的服务器代码,支持这样的功能不会有太大的问题。

综合起来, 由于用户体验和资源利用率的提升, 坏处是可以完全得到弥补的。  我强烈推荐大家使用。这里暂时不教大家怎么操作,毕竟每个模版的标签不一致,导致功能可能失效,可以体验本站的pjax功能,当然你也喜欢的话可以找我帮你做哦,但是是有偿的啊,哈哈。

文章版权及转载声明:

作者:非李莫属本文地址:https://www.talklee.com/blog/154.html发布于 3年前 ( 2016-06-21 )
文章转载或复制请以超链接形式并注明出处李洋个人博客

分享到:
赞(0

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

发表评论

快捷回复:

评论列表 (有 3 条评论,3176人围观)参与讨论
网友昵称:访客
访客游客2016-07-13椅子 回复
试试
网友昵称:丁春华
丁春华游客2016-06-25沙发 回复
觉得挺好的啊
网友昵称:非李莫属
非李莫属管理员2016-06-27 回复
@丁春华 嗯嗯,挺好用的。