difference between html tag "/href" and navlink or Link

Question

what is the difference between html tag "/href" and navlink provided by react-router to navigate the page? I can use both in order to navigate page to the different URL, so why there was need of introducing Navlink or Link?

Answer 1

The href attribute would trigger a page refresh which would reset the application states. However the link and navlink of react-router doesn't trigger a page refresh. Since React is used to create single page applications most of the time make sure you choose Link or Navlink when working with routing

Answer 2

If we were to create links using anchor elements such as href, clicking on them would cause the whole page to reload. React Router provides a <Link> component to prevent that from happening. When clicking a <Link>, the URL will be updated and the rendered content will change without reloading the page. So basically to sum up this navlink/ link provided by react doesnt refresh the page while href refreshes the page