Angular 2中的不纯管道(纯=假)对我的表现有害吗?

Jer*_*984 13 typescript angular2-directives angular

我有一个翻译管道,它接受一个字符串作为键,并从字典中返回翻译的字符串.管道看起来像这样:

import {Pipe, PipeTransform} from 'angular2/core';
import {TranslateService} from './translate.service';

@Pipe({
    name: 'translate',
    pure: false
})
export class TranslatePipe implements PipeTransform {

    constructor(private _translateService : TranslateService) {
    }
    transform(key: string): any {
        var translatedText = this._translateService.resources[key];
        if (translatedText)
            return translatedText;
        return key;
    }
}
Run Code Online (Sandbox Code Playgroud)

我在我的模板中使用管道,如下所示:

<div>{{'login_EnterNewPassword'|translate}}</div>
Run Code Online (Sandbox Code Playgroud)

哪个将在我的HTML中呈现如下:

<div>Please enter a new password</div>
Run Code Online (Sandbox Code Playgroud)

到现在为止还挺好!

TranslatePipe依赖于TranslateService,它包含一个名为resources的字典,其中包含当前语言的翻译.TranslateService的资源加载了对服务器的ajax http调用,如果用户选择其他语言,它可以在后台重新加载.

因为我需要我的UI在发生这种情况时更新所有文本,所以我将管道的pure属性设置为false.

一切都很完美,但事实是,管道经常被执行,因为它是不纯的.如果用户输入10个字符的密码,则每次按键和键入时都会开始更改跟踪,并且对于页面上所有不同的翻译文本,管道将被执行几次.

主要问题是:这是一件坏事吗,它对整体表现有多大的负面影响???

或者是否有另一种强制角度来重新评估所有需求的方法,例如只有当语言改变时?

Gün*_*uer 6

不纯的管道对性能有很大的影响,特别是当它们执行复制,过滤和排序数组等非平凡的工作时.

无论如何,每个变化检测周期都会调用不纯的管道.如果可能的话,缓存结果是明智的,以避免在可能的情况下反复做同样的工作.

只有在输入值或参数发生变化时才会调用纯管道.

如果可能,您可以保持管道纯净,而是添加一个额外的参数.更新该参数会导致管道再次运行.