Angular 2 нечистая труба против производительности директивы

Я смотрю на ngx-translates два способа ввода перевода.

  1. Либо как труба {{'messageId' | translate}}
  2. ИЛИ как директива <span [translate]="'messageId'">

Канал — это нечистый канал, который может обрабатывать перевод и любую асинхронную загрузку текста. Недостатком этого подхода, который я вижу, является то, что this срабатывает каждый раз, когда запускаются циклы дайджеста.

Другой подход будет использовать директиву. В этом случае мы можем контролировать, когда методы запускаются, используя Events или Observables. Этот метод уменьшит количество ненужных обновлений.

Но поскольку директивы манипулируют DOM, мой вопрос заключается в том, сделает ли директивный подход все медленнее в целом? Кроме того, есть ли способ измерить производительность одного над другим?


angular ngx-translate angular2-directives
person nipuna777    schedule 20.03.2017    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Интерполяция в Angular — это синтаксический сахар над привязками свойств. Как поясняется в документации, эти два одинаковы

<p><span>"{{title}}" is the <i>interpolated</i> title.</span></p>
<p>"<span [innerHTML]="title"></span>" is the <i>property bound</i> title.</p>

Поэтому, если вы видите преимущества привязки свойств, сделайте это.

person Chandermani    schedule 20.03.2017
comment
Проблема в том, что директива [translate] делает больше, чем просто связывание. Он все еще должен писать в DOM. node.textContent = this.key ? node.currentValue : node.originalContent.replace(key, node.currentValue); this._ref.markForCheck(); Это используется в их исходном коде. , будет ли это медленнее, чем привязка свойств? - person nipuna777; 20.03.2017
comment
Я считаю, что интерполяция тоже должна делать то же самое, что и использовать ту же инфраструктуру привязки. - person Chandermani; 20.03.2017