juntar arquivos - qual a melhor forma

Boa tarde, Vi no curso que para diminuir o nro de arquivos baixados pode-se utilizar o gulp-concat e o gulp-usemin para alterar o html. Isso eu consigo fazer, a minha dúvida é mais conceitual mesmo ou de melhores práticas de como utilizar esses 2 plugins.

No meu index.html eu tenho várias libs (angular, jquery e outros) e vários arquivos js meus e acho que juntar tudo o arquivo acabaria ficando muito grande. Juntar todas as libs de terceiros não sei se é a melhor opção porque utilizo várias tbem. A minha dúvida é justamente essa. Como dividir a concatenação dessas libs e arquivos de forma mais correta? Abaixo coloco os CSS e os JS que tenho no meu index.html

CSS

        <!-- COMPONENTES -->
        <link rel="stylesheet" href="assets/lib/normalize-css/normalize.css">

        <link rel="stylesheet" href="assets/lib/bootstrap/dist/css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="assets/lib/AngularJS-Toaster/toaster.min.css" />

        <link rel="stylesheet" href="assets/lib/animate.css/animate.min.css">       

        <!-- CSS SiteNL -->
        <link rel="stylesheet" href="app/assets/css/menu-cel.css">
        <link rel="stylesheet" href="app/assets/css/style.css">
        <link rel="stylesheet" href="app/assets/css/nl-icon-style.css">
        <link rel="stylesheet" href="app/assets/css/login.css">    

        <!-- TESTIMONIALS-STYLE-->
        <link rel="stylesheet" href="app/assets/components/testimonials/css/testimonials-style.min.css">

        <!-- Owl Carousel Assets -->        
        <link rel="stylesheet" href="assets/lib/owl.carousel/dist/assets/owl.theme.default.min.css">
        <link rel="stylesheet" href="assets/lib/owl.carousel/dist/assets/owl.carousel.min.css">

JS

        <!-- Assets  / libs -->
        <script type="text/javascript" src="assets/lib/jquery/dist/jquery.min.js"></script>
        <script type="text/javascript" src="assets/lib/bootstrap/dist/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="assets/lib/angular/angular.min.js"></script>
        <script type="text/javascript" src="assets/lib/AngularJS-Toaster/toaster.min.js"></script>
        <script type="text/javascript" src="assets/lib/angular-scroll/angular-scroll.min.js"></script>
        <script type="text/javascript" src="assets/lib/angular-animate/angular-animate.min.js"></script>
        <script type="text/javascript" src="assets/lib/angular-ui-router/release/angular-ui-router.min.js"></script>
        <script type="text/javascript" src="assets/lib/owl.carousel/dist/owl.carousel.min.js"></script>
        <script type="text/javascript" src="app/assets/components/vertical-timeline/js/modernizr.js"></script> <!-- Modernizr -->
        <script type="text/javascript" src="assets/lib/angular-promise-buttons/dist/angular-promise-buttons.min.js"></script>

        <!-- dev -->

        <!-- modulos -->
        <script type="text/javascript" src="app/app.module.js"></script>
        <script type="text/javascript" src="app/website/home/home.module.js"></script>
        <script type="text/javascript" src="app/website/history/history.module.js"></script>
        <script type="text/javascript" src="app/website/menu/menu.module.js"></script>
        <script type="text/javascript" src="app/website/prices/prices.module.js"></script>
        <script type="text/javascript" src="app/website/ourteam/ourteam.module.js"></script>
        <script type="text/javascript" src="app/cpanel/login/login.module.js"></script>
        <script type="text/javascript" src="app/cpanel/adm/adm-website.module.js"></script>
        <script type="text/javascript" src="app/cpanel/admviews/banner/banner.module.js"></script>
        <script type="text/javascript" src="app/cpanel/admviews/planos/planos.module.js"></script>
        <script type="text/javascript" src="app/cpanel/admviews/vantagens/vantagens.module.js"></script>
        <script type="text/javascript" src="app/cpanel/admviews/depoimentos/depoimentos.module.js"></script>

        <!-- Rotas -->
        <script type="text/javascript" src="app/app.route.js"></script>        

        <!-- Factories -->
        <script type="text/javascript" src="app/cpanel/admviews/planos/planos.factory.js"></script>

        <!-- directives -->        
        <script type="text/javascript" src="app/js/directives/website-directives.js"></script>

        <!-- controllers -->
        <script type="text/javascript" src="app/website/home/home-view.controller.js"></script>
        <script type="text/javascript" src="app/website/history/history-view.controller.js"></script>
        <script type="text/javascript" src="app/website/menu/menu-view.controller.js"></script>
        <script type="text/javascript" src="app/website/prices/prices-view.controller.js"></script>
        <script type="text/javascript" src="app/website/ourteam/ourteam-view.controller.js"></script>
        <script type="text/javascript" src="app/cpanel/login/login-view.controller.js"></script>
        <script type="text/javascript" src="app/cpanel/adm/adm-website.controller.js"></script>
        <script type="text/javascript" src="app/cpanel/admviews/banner/banner-list.controller.js"></script>
        <script type="text/javascript" src="app/cpanel/admviews/planos/planos-list.controller.js"></script>
        <script type="text/javascript" src="app/cpanel/admviews/planos/planos-form.controller.js"></script>
        <script type="text/javascript" src="app/cpanel/admviews/depoimentos/depoimentos-view.controller.js"></script>
        <script type="text/javascript" src="app/cpanel/admviews/vantagens/vantagens-view.controller.js"></script>

        <!-- Javascript functions -->
        <script type="text/javascript" src="app/functions.js"></script>

Obrigado.