What is the difference between global and local component registration?

• Global registration: Registers a component on the app instance so it's usable in any template in the app, without importing it each time. Downside: it's always included in the final bundle even if unused, hurting tree-shaking.

app.component('BaseButton', BaseButton)

• Local registration: Import and use the component only within the components that need it (the default and recommended approach with <script setup>, since importing a component makes it automatically available in the template).

<script setup>
import BaseButton from './BaseButton.vue'
</script>

Local registration is generally preferred for better tree-shaking and explicit dependencies.