Функция интервала RxJS кажется неточной для измерения времени

Question

В целях обучения я пытаюсь построить секундомер с помощью функции RxJS interval() в Angular, но вот что я получаю:

с использованием

import { Component, OnInit } from '@angular/core';
import { interval } from 'rxjs';

@Component({
  selector: 'app-stopwatch',
  templateUrl: './stopwatch.component.html',
  styleUrls: ['./stopwatch.component.css']
})
export class StopwatchComponent implements OnInit {
  msCounter = interval(1);
  ms = 0;
  ms1 = 0;

  secCounter = interval(1000);
  sec = 0;

  centCounter = interval(100);
  cent = 0;

  ngOnInit() {
    this.secCounter.subscribe(value => this.sec = value);
    this.msCounter.subscribe(value => this.ms = Math.floor(value / 1000));
    this.msCounter.subscribe(value => this.ms1 = value );
    this.centCounter.subscribe(value => this.cent = value );
  }


}

Как вы видите, секунды не совпадают с миллисекундами, которые также не совпадают с сантисекундами ..

Answer 1

Таким образом, таймер интервала не может быть точным с точностью до миллисекунд.

Каждое излучение интервала будет в новом «кадре» JS, поэтому Angular должен завершить полный цикл обнаружения изменений и т. Д.(поскольку вы изменяете свойство, к которому привязан ваш вид) до следующей возможной возможности для интервала сработать.Это займет гораздо больше, чем 1 мсек, чтобы завершить работу практически при любых обстоятельствах.

Стоит понимать, что во время выполнения Javascript для данной веб-страницы существует только один «поток», так что если что-то происходит(скажем, обнаружение изменений), другая вещь (скажем, излучение в наблюдаемом интервале ()) не может произойти в одно и то же время, оно должно ждать завершения текущего кадра выполнения.