How to find page load time in angular?

Question

Is this the right way to find page load time in angular2+?? I don't think so, It's just the time difference between the route change.How can we add the page DOM content load time to it.??

this.router.events.subscribe((val) => {
    const navigationComplete = val instanceof NavigationEnd;
    const navigationStart = val instanceof NavigationStart;
    if(navigationStart){
        this.navigationStartTime = (new Date).getTime();
    }
    if (navigationComplete) {
        this.currentPage = this.router.url; // Current page route
        this.currentLocation = (this.platformLocation as any).location.href; // Current page url
        let endTime = (new Date).getTime();
        this.pageLoadTime = Number(endTime) - Number(this.navigationStartTime); // Page load time
    }
});

Answer 1

you can definitely use chrome dev tools to analyse perfomance as mentioned by @AurA
separately in the above all scripts you can initialise

<script type="text/javascript">
    var timerStart = Date.now();
</script>

and in the main component

ngAfterViewInit(){
   console.log("Time until reaching run phase: ", Date.now() - $window.timerStart);
}

Havent tested. But should run.

Answer 2

You can use simple javascript code inside ng-init function

var loadTime = window.performance.timing.domContentLoadedEventEnd-window.performance.timing.navigationStart; 
    console.log('Page load time is '+ loadTime);

Answer 3

You can use NavigationStart and ngAfterViewInit to track exact load time.