Typescript 我的angular 2应用程序需要很长时间才能为首次用户加载,我需要帮助来加快加载速度

Typescript 我的angular 2应用程序需要很长时间才能为首次用户加载,我需要帮助来加快加载速度,typescript,angular,Typescript,Angular,下面我已粘贴到我的app.ts文件中 我正在使用angular2,firebase和typescript 它之所以慢是因为我有很多路径,而且我正在注入很多文件 此外,我的应用程序运行良好,这是用户第一次访问我的主页 我不确定是否可以在底部改进引导,或者我是否做错了什么 这是我的app.ts文件: import {Component, bind, provide, Injectable} from 'angular2/core'; import {bootstrap} from 'angular2

下面我已粘贴到我的app.ts文件中

我正在使用angular2,firebase和typescript

它之所以慢是因为我有很多路径,而且我正在注入很多文件

此外,我的应用程序运行良好,这是用户第一次访问我的主页

我不确定是否可以在底部改进引导,或者我是否做错了什么

这是我的app.ts文件:

import {Component, bind, provide, Injectable} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser'
import {NgIf} from 'angular2/common';
import {Router, Location, ROUTER_BINDINGS, RouterOutlet, RouteConfig, RouterLink, ROUTER_PROVIDERS, APP_BASE_HREF, CanActivate, OnActivate,
    ComponentInstruction} from 'angular2/router';
import {HTTP_PROVIDERS, Http, Headers} from 'angular2/http';
import {ANGULAR2_GOOGLE_MAPS_PROVIDERS} from 'angular2-google-maps/core';
import {enableProdMode} from 'angular2/core';
enableProdMode();

import {LoggedInRouterOutlet} from './interceptor';

import {AuthService} from './services/authService/authService';
import {SocialService} from './services/socialService/socialService';
import {UserService} from './services/userService/userService';
import {OrganisationService} from './services/organisationService/organisationService';
import {NotificationService} from './services/notificationService/notificationService';
import {EmailService} from './services/emailService/emailService';

import {UserProfile} from './models/profile/profile';
import {Organisation} from './models/organisation/organisation';

import {HeaderNavigation} from './components/header/header';
import {HeaderNavigationLoggedIn} from './components/header/headerNavigationLoggedIn';
import {HeaderNavigationLoggedInCompany} from './components/header/headerNavigationLoggedInCompany';
import {Footer} from './components/footer/footer';
import {SideMenuCompany} from './components/header/sideMenuCompany';
import {SideMenuUser} from './components/header/sideMenuUser';
import {Splash} from './components/splash/splash';

import {CreateJob} from './components/createJob/createJob';
import {SearchJobs} from './components/searchJobs/searchJobs';
import {Login} from './components/login/login';
import {Applications} from './components/applications/applications';
import {Register} from './components/register/register';
import {ForgotPassword} from './components/forgotpassword/forgotpassword';
import {ChangePassword} from './components/changepassword/changepassword';
import {ChangeEmail} from './components/changeemail/changeemail';
import {SocialRegister} from './components/socialregister/socialregister';
import {Admin} from './components/admin/admin';
import {Contact} from './components/contact/contact';
import {SearchUsers} from './components/searchusers/searchusers';

import {Jobs} from './components/job/jobs';
import {CompanyProfile} from './components/company/company';
import {Home} from './components/home/home';
import {Dashboard} from './components/dashboard/dashboard';
import {Profile} from './components/profile/profile';
import {UserApplications} from './components/userApplications/userApplications';

@Component({
    selector: 'app',
    providers: [UserService, UserProfile, OrganisationService, Organisation],
    template: `

        <Splash *ngIf="isLoggedIn"></Splash>    

        <HeaderNavigation *ngIf="!isLoggedIn"></HeaderNavigation>       

        <HeaderNavigationLoggedIn *ngIf="isLoggedIn && isUserLogin"></HeaderNavigationLoggedIn>
        <HeaderNavigationLoggedInCompany *ngIf="isLoggedIn && isCompanyLogin"></HeaderNavigationLoggedInCompany>

        <SideMenuCompany *ngIf="isLoggedIn && isCompanyLogin"></SideMenuCompany>
        <SideMenuUser *ngIf="isLoggedIn && isUserLogin"></SideMenuUser>

        <div class="content">
            <router-outlet></router-outlet> 
        </div>     
    `,
    directives: [RouterOutlet, RouterLink, Splash, HeaderNavigation, HeaderNavigationLoggedIn, NgIf, HeaderNavigationLoggedInCompany, SideMenuCompany, SideMenuUser, Footer, LoggedInRouterOutlet]
})

@RouteConfig([
    { path: '/', component: Home, as: 'Home', data:{title: 'Welcome Home'}},
    { path: '/home', component: Home, as: 'Home', useAsDefault: true},
    { path: '/login', component: Login, as: 'Login' },  
    { path: '/register/:id', component: Register, as: 'Register' },
    { path: '/forgotpassword', component: ForgotPassword, as: 'ForgotPassword' },
    { path: '/dashboard', component: Dashboard, as: 'Dashboard' },
    { path: '/search', component: SearchJobs, as: 'Search' },   
    { path: '/profile', component: Profile, as: 'Profile' },
    { path: '/settings', component: CompanyProfile, as: 'Settings' },
    { path: '/jobs', component: Jobs, as: 'Jobs' },
    { path: '/password', component: ChangePassword, as: 'Password' },
    { path: '/email', component: ChangeEmail, as: 'Email' },
    { path: '/applications', component: Applications, as: 'Applications' },
    { path: '/socialRegister/:id', component: SocialRegister, as: 'SocialRegister' },
    { path: '/socialRegister', component: SocialRegister, as: 'SocialRegister' },
    { path: '/applys', component: UserApplications, as: 'Applys' },
    { path: '/contact', component: Contact, as: 'Contact' },
    { path: '/searchTeachers', component: SearchUsers, as: 'SearchUsers' },
    { path: '/createJob', component: CreateJob, as: 'CreateJob' },
    { path: '/adminmarkchris2016', component: Admin, as: 'AdminMarkChris2016' },

    { path:'/**', redirectTo: ['Home']}
])

@Injectable()

export class AppComponent {
    router: Router;
    location: Location;
    authService: AuthService;
    userService: UserService
    isLoggedIn: boolean = false;
    isCompanyLogin: boolean = false;
    isUserLogin: boolean = false;
    userProfile: UserProfile;   

    constructor(_router: Router, _location: Location, _authService: AuthService, _userService: UserService, _userProfile: UserProfile){ 
        this.router = _router;
        this.location = _location;
        this.authService = _authService;
        this.userService = _userService;
        this.userProfile = _userProfile;

        this.isUserLoggedIn(this.location.path());

        //On refresh
        this.router.subscribe((currentRoute) => {
            this.isUserLoggedIn(currentRoute);
        })  
    }

    isUserLoggedIn(currentRoute): void{ 
        this.authService.checkIfLoggedIn().then((response) => { 
            this.isLoggedIn = response

            if(this.isLoggedIn){
                this.isUserOrganisationOrTeacher();                 
            }   

            if(currentRoute.substring(0, 14) == "socialRegister" || currentRoute == "socialRegister" || currentRoute == "home" || currentRoute == "contact" || currentRoute == "" || currentRoute == "forgotpassword" || currentRoute == "login" || currentRoute.substring(0, 8) == "register"){
                this.isCompanyLogin = false;
                this.isUserLogin = false;
                this.isLoggedIn = false;
            }           
        });  
    }

    isUserOrganisationOrTeacher(): void{
        this.userService.checkIfProfileExists().then((response) => {
            this.isCompanyLogin = false;
            this.isUserLogin = false;       

            if(response){
                this.isUserLogin = true;
                this.isCompanyLogin = false;
            }else{
                this.isCompanyLogin = true; 
                this.isUserLogin = false;                   
            }
        }); 
    }       
}

bootstrap(AppComponent, [ROUTER_PROVIDERS, provide(APP_BASE_HREF, {useValue: '/'}), HTTP_PROVIDERS, AuthService, SocialService, UserService, EmailService, OrganisationService, NotificationService, ANGULAR2_GOOGLE_MAPS_PROVIDERS]);
从'angular2/core'导入{Component,bind,provide,Injectable};
从“angular2/platform/browser”导入{bootstrap}
从“angular2/common”导入{NgIf};
导入{Router,Location,Router_绑定,RouterOutlet,RouteConfig,RouterLink,Router_提供者,APP_BASE_HREF,CanActivate,OnActivate,
来自“angular2/路由器”的组件指令};
从'angular2/HTTP'导入{HTTP_提供者,HTTP,头文件};
从“ANGULAR2谷歌地图/core”导入{ANGULAR2谷歌地图提供商};
从'angular2/core'导入{enableProdMode};
enableProdMode();
从“./interceptor”导入{LoggedInRouterOutlet};
从“./services/AuthService/AuthService”导入{AuthService};
从“./services/SocialService/SocialService”导入{SocialService};
从“./services/UserService/UserService”导入{UserService};
从“./services/organizationservice/organizationservice”导入{OrganizationService};
从“/services/NotificationService/NotificationService”导入{NotificationService};
从“./services/EmailService/EmailService”导入{EmailService};
从“./models/profile/profile”导入{UserProfile};
从“./models/organization/organization”导入{organization};
从“./components/header/header”导入{HeaderNavigation};
从“./components/header/HeaderNavigationLoggedIn”导入{HeaderNavigationLoggedIn};
从“./components/header/header/HeaderNavigationLoggedInCompany”导入{HeaderNavigationLoggedInCompany};
从“./components/Footer/Footer”导入{Footer};
从“./components/header/SideMenuCompany”导入{SideMenuCompany};
从“./components/header/SideMenuUser”导入{SideMenuUser};
从“./components/Splash/Splash”导入{Splash};
从“./components/CreateJob/CreateJob”导入{CreateJob};
从“./components/SearchJobs/SearchJobs”导入{SearchJobs};
从“./components/Login/Login”导入{Login};
从“./components/Applications/Applications”导入{Applications};
从“./components/Register/Register”导入{Register};
从“./components/ForgotPassword/ForgotPassword”导入{ForgotPassword};
从“./components/ChangePassword/ChangePassword”导入{ChangePassword};
从“./components/ChangeEmail/ChangeEmail”导入{ChangeEmail};
从“./components/SocialRegister/SocialRegister”导入{SocialRegister};
从“./components/Admin/Admin”导入{Admin};
从“./components/Contact/Contact”导入{Contact};
从“./components/SearchUsers/SearchUsers”导入{SearchUsers};
从“./components/job/Jobs”导入{Jobs};
从“./components/company/company”导入{CompanyProfile};
从“./components/Home/Home”导入{Home};
从“./components/Dashboard/Dashboard”导入{Dashboard};
从“./components/Profile/Profile”导入{Profile};
从“./components/UserApplications/UserApplications”导入{UserApplications};
@组成部分({
选择器:“应用程序”,
提供者:[用户服务,用户档案,组织服务,组织],
模板:`
`,
指令:[路由器输出、路由器链接、飞溅、主机驱动、主机驱动LoggeDin、NgIf、主机驱动LoggeDin公司、主机驱动公司、主机驱动用户、页脚、日志驱动路由器输出]
})
@线路图([
{path:'/',component:Home,as:'Home',data:{title:'Welcome Home'},
{path:'/home',component:home,as:'home',useAsDefault:true},
{path:'/login',组件:login,as:'login'},
{path:'/register/:id',component:register,as:'register'},
{路径:'/forgotpassword',组件:forgotpassword,如:'forgotpassword'},
{路径:'/dashboard',组件:dashboard,as:'dashboard'},
{path:'/search',组件:SearchJobs,as:'search'},
{path:'/profile',组件:profile,as:'profile'},
{路径:'/settings',组件:CompanyProfile,as:'settings'},
{path:'/jobs',组件:jobs,as:'jobs'},
{路径:'/password',组件:ChangePassword,as:'password'},
{路径:'/email',组件:changemail,as:'email'},
{path:'/applications',组件:applications,如:'applications'},
{path:'/socialRegister/:id',组件:socialRegister,as:'socialRegister'},
{path:'/socialRegister',组件:socialRegister,as:'socialRegister'},
{path:'/applys',component:UserApplications,as:'applys'},
{路径:'/contact',组件:contact,as:'contact'},
{path:'/searchTeachers',组件:SearchUsers,as:'SearchUsers'},
{path:'/createJob',组件:createJob,as:'createJob'},
{path:'/adminmarkchris2016',组件:Admin,as:'adminmarkchris2016'},
{路径:'/**',重定向到:['Home']}
])
@可注射()
导出类AppComponent{
路由器:路由器;
地点:地点;
authService:authService;
userService:userService
isLoggedIn:boolean=false;
isCompanyLogin:boolean=false;
isUserLogin:boolean=false;
userProfile:userProfile;
构造函数(_router:router,_location:location,_authService:authService,_userService:userService,_userProfile:userProfile){
this.router=\u路由器;
this.location=\u location;
this.authService=\u authService;
this.userService=\u userService;
this.userProfile=\u userProfile;
this.isUserLoggedIn(this.location.path());
//刷新
this.router.subscribe((currentRoute)=>{
这个.isUserLoggedIn(currentRoute);
})  
}
iUserLoggedin(cu
ng build --prod --env=<staging or prod or your env file>