Question

我正在调查为什么我的Angular 2.0 TypeScript项目的编译时间在相对较短的时间内从大约4秒到大约15秒。

我遇到了非常有用但看似无证的--diagnostics开关。

例如，这是我现在在项目上运行tsc --noEmit --diagnostics时得到的结果：

Files:             231
Lines:           50872
Nodes:          170067
Identifiers:     65994
Symbols:       7712123
Types:          407677
Memory used:   600554K
I/O read:        0.43s
I/O write:       0.00s
Parse time:      1.13s
Bind time:       0.34s
Check time:     10.17s
Emit time:       0.00s
Total time:     11.64s

这是我在早期版本的项目上运行相同命令时得到的结果。

Files:             197
Lines:           30882
Nodes:          124208
Identifiers:     46201
Symbols:       5856945
Types:           10989
Memory used:    80412K
I/O read:        0.03s
I/O write:       0.00s
Parse time:      0.60s
Bind time:       0.27s
Check time:      0.93s
Emit time:       0.00s
Total time:      1.79s

Types的数量已经增加，Check time也是如此。

是否可以从--diagnostics获得更详细/详细的输出？

NodeJS v4.4.3，TypeScript v1.8.10。这是我的tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "system",
    "moduleResolution": "node",

    "noImplicitAny": false,
    "noEmitOnError": false,

    "experimentalDecorators": true,

    "emitDecoratorMetadata": true,
    "removeComments": false
  },
  "exclude": [
    "node_modules",
    "wwwroot",
    "typings/main.d.ts",
    "typings/main"
  ]
}

Answer 1

似乎我在我的案子中找到了罪魁祸首。我这么做的很难;我的过程：

找到使编译变慢的提交。完成历史提交提交并检查编译时间。
注释更改的代码，直到找到有问题的行。

在违规提交之前，我总是在提交后持续大约2-4秒的编译时间--13-17秒。

就我而言，我有一个带有accessTokenGetter字段的类，它在构造函数中初始化：

export class JwtConfig {
    //...
    accessTokenGetter: () => Observable<string>;
    //...
      constructor(private config?: IJwtConfig) {
          // ...
          this.accessTokenGetter = this.config.accessTokenGetter || (() => Observable.of(null));
      }
}

初始化|| (() => Observable.of(null));的第二部分导致缓慢。将其注释掉或添加类型注释会使编译时间缩短。由于Observable是通用的，因此TypeScript编译器似乎需要一个提示来缩小它需要做的某些类型检查。我的初始化现在读作：

//...
this.accessTokenGetter = this.config.accessTokenGetter || (() => Observable.of(<string>null));
//...

Observable.of(null as string))似乎也在做这项工作。还有其他几个地方添加了类型注释加速编译。

希望这有助于某人。

但是，如果编译器中有一个设施可以更快地找到答案 - 我很乐意听到它。

Answer 2

我可以从15秒加快编译过程。到6-7秒。通过更改这一行代码：

// slow:
// ...
.flatMap((receivedObj: MyType) => {
    let nextObservable: Observable<MySecondType> = this.dependingPut(receivedObj);
    return nextObservable || new Observable((observer) => {
            observer.next(undefined);
        });
});


// fast:
.flatMap((receivedObj: MyType) => {
    let nextObservable: Observable<MySecondType> = this.dependingPut(receivedObj);  
    return nextObservable || new Observable<MySecondType>((observer) => { // <--- use the generics!
            observer.next(undefined);
        });
});

从Typescript手册（https://www.typescriptlang.org/docs/handbook/generics.html）：

function identity<T>(arg: T): T {
    return arg;
}

// ...

let output = identity("myString");  // type of output will be 'string'

“请注意，我们不必在角度中明确传递类型括号（＆lt;＆gt;），编译器只看了值“myString”，并且将T设置为其类型。虽然类型参数推断可以是一个有用的工具为了保持代码更短，更易读，您可能需要明确传递类型参数，就像我们在上一个例子中所做的那样编译器无法推断出类型，因为更复杂的情况可能会发生实例“。

就我而言，它没有失败;类型推断只花了很长时间（顺便说一下，它也消耗了大量的内存）。在开始构建变通方法之前，请返回修订历史记录并尝试识别错误的修订版。要确保编译器是罪魁祸首，请使用--diagnostics选项。如果返回的统计信息返回高“检查时间”值，则检查代码是否缺少类型。

Answer 3

对我而言，减速是由import "./file.ts";之类的进口引起的。删除.ts扩展程序会使速度提高90％：import "./file";

Answer 4

编译器已知速度慢，您可以在监视模式tsc -w中使用编译器，或切换到webpack和ts-loader，这会显示transpileOnly选项（无需耗时的检查）

Answer 5

在我的情况下，编译时间大约是15-30秒。在tsc --noEmit --diagnostics命令后，我注意到我正在构建2k文件。解决方案是从node_modules文件夹中排除所有文件：

{
  "compilerOptions": {...},
   "exclude": [
     "node_modules"
   ]
}

最好也排除typings文件夹。

研究长TypeScript编译时间

5 个答案: