7-5 Lazy Loading Checkout Components

In this lesson, we look at how we can dynamically import components only when they’re needed.

Doing this is as easy as adding the prefix Lazy when rendering a component!

By only loading the checkout components when we click the “Buy” button, we load less code on the initial page load. We also know that not everyone will even click that button, so there’s no point in loading all of that code unless it’s needed.

Lazy Components: https://nuxt.com/docs/guide/directory-structure/components#dynamic-imports