V-if vs Lazy loading component

I'm starting to learn Vue.js and I can not understand the difference between v-if and lazy loading in terms of performance and speed for the whole application.

so let's say I have this:

<template>
  <div class="popup" v-if="popUp">
    <pop-up :msg="hello" />
  </div>
</template>

so my question is, the popup component won't be rendered/downloaded by the browser(?) until the condition is met. if so what's the point of using the lazy loading technique?