Угловой 7, как рассчитать время, необходимое компоненту для полной загрузки DOM

Question

Я пытаюсь получить время, необходимое компоненту для полной загрузки в dom, используя следующий ngOninit() из этот ответ в стеке :

ngOnInit()
{
    var time = window.performance.timing.domContentLoadedEventEnd-window.performance.timing.navigationStart
    console.log(time)
}

Результатбыло похоже:

-1544706869570

Я использовал ngAfterViewInit():

ngAfterViewInit(){
    var time = window.performance.timing.domContentLoadedEventEnd-window.performance.timing.navigationStart
    console.log(time)
  }

И это был тот же результат.

Как превратить его в секунды, и есть ли лучшее решение, чтобы проверить нагрузку на компонент в угловых 7?

Answer 1

Вы можете измерить его с помощью window.performance.now в миллисекундах, например:

startTime! : number
initTime! : number
contentInitTime! : number
viewInitTime! : number

printTime(time : number) {
  console.log(`Global loading ${ time }ms`)
  console.log(`Global loading ${ time / 1000 }s`)
  console.log(`Component loading ${ time - this.startTime }ms`)
  console.log(`Component loading ${ (time - this.startTime) / 1000 }s`)
}
// Created
constructor() {
  this.startTime = window.performance.now()
  this.printTime(this.startTime)
}
// Initialized by angular
ngOnInit() {
  this.initTime = window.performance.now()
  this.printTime(this.initTime)
}
// Rendered without children
ngAfterContentInit() {
  this.contentInitTime = window.performance.now()
  this.printTime(this.contentInitTime)
}
// Rendered with children
ngAfterViewInit() {
  this.viewInitTime = window.performance.now()
  this.printTime(this.viewInitTime)
}