前言
事情的起因是之前有不少网友反馈，我的网站加载比较慢。这太正常了，毕竟是传统的多页面网站，每次点击都会触发整个页面及其相关依赖资源的加载，网速不好，或者人多的时候，肯定快不起来。
通过Vue或React等框架进行单页面开发，倒是一定程度上能解决这个问题，但是SEO优化起来比较麻烦，权衡之下，我宁愿忍受慢一点，卡一点带来的后果。不过，很明显我遇到的问题别人一定也遇到过，因此，通过搜索发现了pjax，它完美解决了我的问题。
1. PJAX 是什么
pjax 其实很简单，其核心原理是将 HTML5 的 pushState 方法与 AJAX 技术相结合，以实现页面内容的局部刷新且地址栏实时更新的目的。
pjax 虽不能像单页面应用那样只加载局部业务数据，但也只需要加载一个页面，而其依赖的各种公共资源，则不需要每次页面跳转都重复加载，可以极大的减少网络流量，而实时更新地址栏则可以让网站看起来跟普通网站一样。
可以看出，第一次加载是通过URL的普通HTTP请求，返回了大量资源，而第二次是点击后触发的PJAX请求，只返回了一个单独的HTML页面。
最主要的是，pjax 对 SEO 没有任何影响，并且对新旧网站几乎都可以无侵入或只少量调整代码结构就可以方便地接入，是我必须强推的一门技术。
2. 相关项目介绍
pjax.js 起初是一个基于 jQuery 的插件，后续也有了不依赖 jQuery 的版本。其中，
依赖 jQuery 版的项目地址是：https://github.com/defunkt/jquery-pjax，github评星为16.8K；
不依赖 jQuery 版的项目地址是：https://github.com/MoOx/pjax，github评星为1.4K。
我的主题都是使用的不依赖 jQuery 的版本，主要是因为现在ES6语法已经相当优雅，且浏览器兼容已不成问题，因此我不想在项目中依赖 jQuery，但不可否认，jQuery 依然是一款强大且方便的 JS 库。
pjax 本身是一门很简单的技术，在不考虑兼容性的情况下，自己写代码实现相同的功能也要不了多少行代码，完全不用担心只有1.4K颗星是否会有更多的bug，选哪一个主要取决于你的项目中是否引用了jQuery。
3. 注意事项
唯一需要注意，也是很多人可能会忽略的是，一旦使用了 pjax 技术，你的网站（或者局部功能）就变成了单页面应用，很多基于页面访问的统计可能就不生效了，这时你就需要针对不同的统计工具进行配置，甚至修改统计代码，以百度统计为例，需要启用单页应用数据统计，如下图所示：
也就是说，你如果使用的是我开发的主题，又想统计网站流量，就需要启用单页应用数据统计，各种平台处理方式略有不同，我相信你只要没有忽略这一点，解决起来还是很简单的。结语
我在开发过程中用到了很多开源项目，但大多都是锦上添花的，而 pjax 我认为在性能和用户体验优化上面却有着立竿见影的效果，且接入也非常简单，因此，单独拿出来推荐给大家，希望对大家有用！
相关推荐
- HTML5语义化标签 2024-02-15
评论3
老孙
关键是看了俺也不会
老朱
谦虚了，这个比较简单，几行代码就可以搞定，比你移植主题简单多了😁
老孙
🤣 我这个就是CTRL+C 加上 CTRL+V一套组合技就能搞定