Локальное подключение компонентов vue?
 

Здравствуйте, пытаюсь разобраться с созданием компонентов в vue. Я использую laravel в связке с vue и собираю через Laravel Mix единый файл app.js который подключаю на всех страницах. Как я понял создавать компоненты в vue глобально это плохо. Попытался создать локально и возникли такие вопросы:
1) Правильно ли я понимаю что если на странице будет только id="accordion" то ресурсы загрузятся только для accrodion, а для остальных компонентов не загрузятся?
2) Если я через components добавлю все компоненты для id="app" - то в чем будет разница если бы я их задал глобально? Хотелось бы понять именно профит
3) В чем смысл привязывать новый компонент к новому id если все можно привязать к примеру к id="app" ?

window.Vue = require('vue');

//Глобальное подключение
Vue.component('tabs', require('./components/tabs/Tabs.vue').default);
Vue.component('tab', require('./components/tabs/Tab.vue').default);
Vue.component('todoList', require('./components/todoList/TodoList.vue').default);

//Основой компонент
const app = new Vue({
    el: '#app',
});

//Локальное подключения
const accordion = new Vue({
    el: '#accordion',
    components: {
        'accordion' : require('./components/accordion/Accordion.vue').default,
    }
});