BestHub
Sign in
Tag

History API

1 views collected around this technical thread.

Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Mar 17, 2025 · Frontend Development

Intercepting Browser Navigation Events (Back/Forward, Refresh/Close, and Route Changes) in Vue Applications

This article explains how to prevent loss of unsaved video data by intercepting browser back/forward actions, page refresh or close events, and Vue router navigation using the History API, beforeunload listener, and navigation guards, with complete Vue code examples.

Browser InterceptionHistory APINavigation Guard
0 likes · 11 min read
Intercepting Browser Navigation Events (Back/Forward, Refresh/Close, and Route Changes) in Vue Applications
IT Services Circle
IT Services Circle
Aug 21, 2023 · Frontend Development

Understanding the History API and How React Router Implements It

This tutorial explains the fundamentals of the browser History API—including length, back, forward, go, pushState, replaceState, and scrollRestoration—demonstrates their behavior with visual examples, and then shows step‑by‑step how React Router leverages these APIs to match routes, render components, and handle navigation events such as popstate.

History APIJavaScriptRouter
0 likes · 10 min read
Understanding the History API and How React Router Implements It
Sohu Tech Products
Sohu Tech Products
Jan 11, 2023 · Frontend Development

Route Guards and the Emerging Navigation API for SPA Routing

This article explains the limitations of using History API for SPA route guards, compares two common workarounds, and introduces the new Navigation API as a more centralized and native solution for handling navigation events, transitions, and abortable fetches in modern front‑end development.

History APIJavaScriptNavigation API
0 likes · 13 min read
Route Guards and the Emerging Navigation API for SPA Routing
Tencent Music Tech Team
Tencent Music Tech Team
Nov 6, 2021 · Frontend Development

Web Routing in Single‑Page Applications: Hash, History, and Memory Modes

The article explains client‑side routing for single‑page applications, detailing three approaches—hash mode using location.hash and onhashchange, history mode leveraging the HTML5 History API’s pushState/replaceState with popstate handling, and memory mode storing routes in JavaScript or localStorage—plus their trade‑offs regarding URL readability, SEO, server configuration, and browser support.

Frontend DevelopmentHistory APISPA
0 likes · 11 min read
Web Routing in Single‑Page Applications: Hash, History, and Memory Modes
Beike Product & Technology
Beike Product & Technology
Mar 5, 2021 · Frontend Development

Understanding the Browser History API: Properties, Methods, Events, and Practical Front‑End Applications

This article introduces the window.history object, explains its key properties, methods and the popstate event, answers common questions about its behavior, and demonstrates practical uses such as single‑page routing, navigation control, and custom front‑end router implementations with code examples.

History APIJavaScriptSingle Page Application
0 likes · 16 min read
Understanding the Browser History API: Properties, Methods, Events, and Practical Front‑End Applications
JD Retail Technology
JD Retail Technology
Dec 7, 2020 · Frontend Development

Frontend Routing: Core Principles, Implementation, and Source Code Analysis

This article provides a comprehensive overview of frontend routing in single-page applications, covering its historical evolution, core concepts of hash and history modes, implementation details in Vue and React, code examples, navigation guards, nested routes, and practical considerations for choosing routing strategies.

History APIRoutingSPA
0 likes · 24 min read
Frontend Routing: Core Principles, Implementation, and Source Code Analysis