BrowserAnimationsModule 和 NoopAnimationsModule 有什么区别?

What's the difference between BrowserAnimationsModule and NoopAnimationsModule?

在新的 Angular-Material 版本中,您需要为 Angular-Animations 添加一个模块。您可以在两个 BrowserAnimationsModule 和 NoopAnimationsModule 之间进行选择。 official guide 状态:

Some Material components depend on the Angular animations module in order to be able to do more advanced transitions. If you want these animations to work in your app, you have to install the @angular/animations module and include the BrowserAnimationsModule in your app.

npm install --save @angular/animations
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';

@NgModule({
  ...
  imports: [BrowserAnimationsModule],
  ...
})
export class PizzaPartyAppModule { }

If you don't want to add another dependency to your project, you can use the NoopAnimationsModule.

import {NoopAnimationsModule} from '@angular/platform-browser/animations';

@NgModule({
  ...
  imports: [NoopAnimationsModule],
  ...
})
export class PizzaPartyAppModule { }

我不太明白这里有什么区别。看起来完全一样 :) 这两个模块有什么区别?

正如名称 noop(“无操作”)所说,该模块不执行任何操作。它是一个实用模块,模拟了真正的动画模块,但实际上并没有动画。

这在动画速度太慢的平台上或用于测试(单元、集成、与 Cypress 的 e2e、量角器等)的平台上很方便,如果动画不涉及您实际想要测试的内容.

@NgModule({
  imports: [
    BrowserModule,
    environment.production ? BrowserAnimationsModule : NoopAnimationsModule,
    ...
   ]
   ...
}
export class AppModule {}

BROWSER_ANIMATIONS_PROVIDERS用于实际应用

Separate providers from the actual module so that we can do a local modification in Google3 to include them in the BrowserModule.

BROWSER_NOOP_ANIMATIONS_PROVIDERS用于测试

Separate providers from the actual module so that we can do a local modification in Google3 to include them in the BrowserTestingModule.