Menu
In Nuxt, we can use router-link as well as nuxt-link. What is the advantage of using nuxt-link over router-link?
<nuxt-link to="/about">About</nuxt-link>
instead of
<router-link to="/about">About</router-link>
978
This component ( <nuxt-link> ) is used to provide navigations between page components and enhance performances with smart prefetching.
It simplifies the development of universal or single page Vue apps. Nuxt. js abstracts away the details of server and client code distribution so you can focus on application development. The goal with Nuxt is for it to be flexible enough for you to use as a main project base.
Nuxt ships with Vue and many popular Vue libraries such as vue-router for routing, vuex for global state management, and vue-meta for meta tags handling. Also, Nuxt is very versatile. We can use Nuxt for building single-page apps (SPAs), dynamic SSR, and static site generation (SSG).
According to Nuxt Docs, two important points:
This component (
<nuxt-link>) is used to provide navigations between page components and enhance performances with smart prefetching.
In fact,
<nuxt-link>extends<router-link>. That means it takes the same properties and can be used in the same manner.
After that we can read about smart prefetching:
Nuxt.js will automagically prefetch the code-splitted pages linked with when visible in the viewport by default. This hugely improves the end user performances.
Based on that I think you are simply looking at better performance with <nuxt-link>.
143
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
