其实和 github 的 repos 页面很类似啊,都加了个 progress,只不过一个提前将地址栏推送过去了.
https://github.com/ant-designgithub 是在 body 上面加了个 turbo-progress-bar ,然后通过 html 标签的数据属性 aria-busy ,从 width=10%开始递增
antd 是在 html 加了个类,body 末尾加了个 progress,不过这个过程很短你不一定看得见,你把网络断开,再点一个没点过的,就能看的很明白了.
不过,这些可能你都懂吧..我的意思是,地址只是表象,毕竟在客户端导航中没有发生跳转,都是 js 在操作
除了这两种类似的方案,还有一些别的有意思的方案,比如说,astro 为了配合 viewtransition,在 document 上,实现了一套生命周期,,astro:before-preparation,在准备阶段开始时触发的事件,导航开始后(例如,用户点击链接后),但在加载内容之前。这样也能解决 loading 的问题.
https://docs.astro.build/zh-cn/guides/view-transitions/#astrobefore-preparation