刷新跳转 vs 无刷新跳转

本文系统梳理浏览器的导航与历史管理机制，包括**刷新跳转（页面级导航）与无刷新跳转（前端路由）**两大类，兼顾原生行为与前端框架实现原理，帮助理解 React Router、Vue Router 等框架的底层导航逻辑。

一、刷新跳转（页面级导航）

刷新跳转（也称“整页跳转”）是浏览器原生导航方式。

每次跳转都会重新向服务器请求资源、卸载当前文档、加载新文档。

1. 常见实现方式

(1) 通过 window.location 赋值

window.location.href = '/about'
window.location.assign('/about')

行为特征：

• 发起完整的 HTTP 请求；
• 页面完全重新加载；
• 当前页面被卸载；
• 会新增一条历史记录。

(2) 使用 window.location.replace

window.location.replace('/about')

区别：

• 不会新增历史记录（无法“后退”回原页面）；
• 同样触发完整刷新。