浏览器通过导航栏按钮后退前进时页面js不执行（浏览器的back-forward cache）

问题描述：若存在一个页面包含超链接，点击跳转之后，此时点击浏览器的后退按钮的话，页面是不会重新渲染的（js什么的是不会再执行的，页面也不会重新挂载，通过观察
window.addEventListener(‘load’,handler) 这里的handler不执行可以得出），这是因为浏览器的“往返缓存(back-forward cache - bfcache)”特性。

问题根源：back-forward cache 保存了DOM 和 JavaScript的状态，实际上是将整个页面保存在了内存里 - JS高程（红宝书）3 第 13 章 13.4事件类型 - 393 （chrome已取消bfcache，但是ios的微信浏览器内核是webkit的，依然存在bfcache）

问题场景：若在跳转后的页面里修改了当前页面的某个状态，而最新的页面是没有返回主页面按钮的（移动端，微信开发，通过底部导航回退按钮作为返回键），那么通过底部回退按钮回到一开始页面的时候，即使已经修改了状态了，但是由于js不执行，那么它在页面上展示的依然是过期的信息。

真实场景：个人主页存在一个未读信息，点击了这个未读信息进入查看未读信息的页面，然后再点击具体某个信息，此时未读信息应该减1，而实际回退到页面时未读信息数量依然不变。

解决方法：浏览器在加载页面时，无论加载的页面是否来自bfcache，都会触发pageshow事件，所以在window上监听即可。

具体实现：点击了具体某个信息之后，往sessionStorage里添加上一个标志位来说明未读信息发生改变（点击了未读信息的条数），然后比对badge与已点击的信息，判断是否仍有未读信息来决定是否需要继续展示badge。

所以要在个人主页里监听pageshow事件来处理未读badge。

扩展：相应的也有一个pagehide事件。但不知此事件与beforeunload有何区别。