syedsibtain
Mon Feb 13 2023
We handle navigation in Gatsby using the
This is because the
So in case of external links, we should prefer a simple
Also gatsby prefetches the linked pages by starting a low priority request over a link, when we take the mouse on it
Link
Component. So if we put both external and internal links in the Link
element, we receive the following warning in the console:External Link was detected in a link component. Use the link component only for internal links.
This is because the
Link
component is designed to interact with Gatsby's client-side navigation, which is better for single-page apps and uses the window.history
API to update the URL without reloading the entire page.So in case of external links, we should prefer a simple
a
tag and pass the href
attribute.Also gatsby prefetches the linked pages by starting a low priority request over a link, when we take the mouse on it
onMouseOver
, it makes the request high priority.