At present, the routes mentioned are basically front-end routes. Front-end routing refers to updating part of the rendered page without refreshing by matching the path with certain rules.

Front-end routes can be implemented in two ways: hash routes and history routes.

hash

Before the advent of HTML5’s History feature, front-end routing was mostly implemented using listening hash values.

Hash value update features

  • Changing the hash value does not trigger a web page reload
  • Changing the hash value changes the browser history
  • Changing the hash value triggers the window.onHashchange () event

There are three ways to change the hash value:

  • A label changes the value of the anchor point, for example:
  • By setting the value of window.location.hash
  • Browser forward (history.forword()), back(history.back())

The current history route was implemented only after the pushState, replaceState, and onpopState features of history were added.