@angular/language-service 11.2.5 → 11.2.9

package/bundles/ivy.js

@@ -1,5 +1,5 @@
 /**
- * @license Angular v11.2.5
+ * @license Angular v11.2.9
  * Copyright Google LLC All Rights Reserved.
  * License: MIT
  */
@@ -6697,6 +6697,21 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
      * Use of this source code is governed by an MIT-style license that can be
      * found in the LICENSE file at https://angular.io/license
      */
+    /**
+     * This is an R3 `Node`-like wrapper for a raw `html.Comment` node. We do not currently
+     * require the implementation of a visitor for Comments as they are only collected at
+     * the top-level of the R3 AST, and only if `Render3ParseOptions['collectCommentNodes']`
+     * is true.
+     */
+    class Comment {
+        constructor(value, sourceSpan) {
+            this.value = value;
+            this.sourceSpan = sourceSpan;
+        }
+        visit(_visitor) {
+            throw new Error('visit() not implemented for Comment');
+        }
+    }
     class Text {
         constructor(value, sourceSpan) {
             this.value = value;
@@ -11388,6 +11403,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
      */
     function combineHostContextSelectors(contextSelectors, otherSelectors) {
         const hostMarker = _polyfillHostNoCombinator;
+        _polyfillHostRe.lastIndex = 0; // reset the regex to ensure we get an accurate test
         const otherSelectorsHasHost = _polyfillHostRe.test(otherSelectors);
         // If there are no context selectors then just output a host marker
         if (contextSelectors.length === 0) {
@@ -11517,7 +11533,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
             return visitor.visitElement(this, context);
         }
     }
-    class Comment {
+    class Comment$1 {
         constructor(value, sourceSpan) {
             this.value = value;
             this.sourceSpan = sourceSpan;
@@ -12547,7 +12563,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
             const text = this._advanceIf(TokenType.RAW_TEXT);
             this._advanceIf(TokenType.COMMENT_END);
             const value = text != null ? text.parts[0].trim() : null;
-            this._addToParent(new Comment(value, token.sourceSpan));
+            this._addToParent(new Comment$1(value, token.sourceSpan));
         }
         _consumeExpansion(token) {
             const switchValue = this._advance();
@@ -13755,7 +13771,11 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
             if (isEmptyExpression(value)) {
                 return null;
             }
-            name = normalizePropName(name);
+            // CSS custom properties are case-sensitive so we shouldn't normalize them.
+            // See: https://www.w3.org/TR/css-variables-1/#defining-variables
+            if (!isCssCustomProperty(name)) {
+                name = hyphenate(name);
+            }
             const { property, hasOverrideFlag, suffix: bindingSuffix } = parseProperty(name);
             suffix = typeof suffix === 'string' && suffix.length !== 0 ? suffix : bindingSuffix;
             const entry = { name: property, suffix: suffix, value, sourceSpan, hasOverrideFlag };
@@ -13779,9 +13799,6 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
             const { property, hasOverrideFlag } = parseProperty(name);
             const entry = { name: property, value, sourceSpan, hasOverrideFlag, suffix: null };
             if (isMapBased) {
-                if (this._classMapInput) {
-                    throw new Error('[class] and [className] bindings cannot be used on the same element simultaneously');
-                }
                 this._classMapInput = entry;
             }
             else {
@@ -14103,8 +14120,12 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
                 return Identifiers$1.stylePropInterpolateV;
         }
     }
-    function normalizePropName(prop) {
-        return hyphenate(prop);
+    /**
+     * Checks whether property name is a custom CSS property.
+     * See: https://www.w3.org/TR/css-variables-1
+     */
+    function isCssCustomProperty(name) {
+        return name.startsWith('--');
     }
 
     /**
@@ -16222,26 +16243,33 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
         EVENT: { start: '(', end: ')' },
     };
     const TEMPLATE_ATTR_PREFIX$1 = '*';
-    function htmlAstToRender3Ast(htmlNodes, bindingParser) {
-        const transformer = new HtmlAstToIvyAst(bindingParser);
+    function htmlAstToRender3Ast(htmlNodes, bindingParser, options) {
+        const transformer = new HtmlAstToIvyAst(bindingParser, options);
         const ivyNodes = visitAll$1(transformer, htmlNodes);
         // Errors might originate in either the binding parser or the html to ivy transformer
         const allErrors = bindingParser.errors.concat(transformer.errors);
-        return {
+        const result = {
             nodes: ivyNodes,
             errors: allErrors,
             styleUrls: transformer.styleUrls,
             styles: transformer.styles,
-            ngContentSelectors: transformer.ngContentSelectors,
+            ngContentSelectors: transformer.ngContentSelectors
         };
+        if (options.collectCommentNodes) {
+            result.commentNodes = transformer.commentNodes;
+        }
+        return result;
     }
     class HtmlAstToIvyAst {
-        constructor(bindingParser) {
+        constructor(bindingParser, options) {
             this.bindingParser = bindingParser;
+            this.options = options;
             this.errors = [];
             this.styles = [];
             this.styleUrls = [];
             this.ngContentSelectors = [];
+            // This array will be populated if `Render3ParseOptions['collectCommentNodes']` is true
+            this.commentNodes = [];
             this.inI18nBlock = false;
         }
         // HTML visitor
@@ -16410,6 +16438,9 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
             return null;
         }
         visitComment(comment) {
+            if (this.options.collectCommentNodes) {
+                this.commentNodes.push(new Comment(comment.value || '', comment.sourceSpan));
+            }
             return null;
         }
         // convert view engine `ParsedProperty` to a format suitable for IVY
@@ -16601,7 +16632,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
         return node instanceof Text$2 && node.value.trim().length == 0;
     }
     function isCommentNode(node) {
-        return node instanceof Comment;
+        return node instanceof Comment$1;
     }
     function textContents(node) {
         if (node.children.length !== 1 || !(node.children[0] instanceof Text$2)) {
@@ -19178,7 +19209,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
         const parseResult = htmlParser.parse(template, templateUrl, Object.assign(Object.assign({ leadingTriviaChars: LEADING_TRIVIA_CHARS }, options), { tokenizeExpansionForms: true }));
         if (!options.alwaysAttemptHtmlToR3AstConversion && parseResult.errors &&
             parseResult.errors.length > 0) {
-            return {
+            const parsedTemplate = {
                 interpolationConfig,
                 preserveWhitespaces,
                 template,
@@ -19190,6 +19221,10 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
                 styles: [],
                 ngContentSelectors: []
             };
+            if (options.collectCommentNodes) {
+                parsedTemplate.commentNodes = [];
+            }
+            return parsedTemplate;
         }
         let rootNodes = parseResult.rootNodes;
         // process i18n meta information (scan attributes, generate ids)
@@ -19200,7 +19235,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
         const i18nMetaResult = i18nMetaVisitor.visitAllWithErrors(rootNodes);
         if (!options.alwaysAttemptHtmlToR3AstConversion && i18nMetaResult.errors &&
             i18nMetaResult.errors.length > 0) {
-            return {
+            const parsedTemplate = {
                 interpolationConfig,
                 preserveWhitespaces,
                 template,
@@ -19212,6 +19247,10 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
                 styles: [],
                 ngContentSelectors: []
             };
+            if (options.collectCommentNodes) {
+                parsedTemplate.commentNodes = [];
+            }
+            return parsedTemplate;
         }
         rootNodes = i18nMetaResult.rootNodes;
         if (!preserveWhitespaces) {
@@ -19224,9 +19263,9 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
                 rootNodes = visitAll$1(new I18nMetaVisitor(interpolationConfig, /* keepI18nAttrs */ false), rootNodes);
             }
         }
-        const { nodes, errors, styleUrls, styles, ngContentSelectors } = htmlAstToRender3Ast(rootNodes, bindingParser);
+        const { nodes, errors, styleUrls, styles, ngContentSelectors, commentNodes } = htmlAstToRender3Ast(rootNodes, bindingParser, { collectCommentNodes: !!options.collectCommentNodes });
         errors.push(...parseResult.errors, ...i18nMetaResult.errors);
-        return {
+        const parsedTemplate = {
             interpolationConfig,
             preserveWhitespaces,
             errors: errors.length > 0 ? errors : null,
@@ -19238,6 +19277,10 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
             styles,
             ngContentSelectors
         };
+        if (options.collectCommentNodes) {
+            parsedTemplate.commentNodes = commentNodes;
+        }
+        return parsedTemplate;
     }
     const elementRegistry = new DomElementSchemaRegistry();
     /**
@@ -20356,7 +20399,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
      * Use of this source code is governed by an MIT-style license that can be
      * found in the LICENSE file at https://angular.io/license
      */
-    const VERSION$1 = new Version('11.2.5');
+    const VERSION$1 = new Version('11.2.9');
 
     /**
      * @license
@@ -21013,7 +21056,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
      */
     function createDirectiveDefinitionMap(meta) {
         const definitionMap = new DefinitionMap();
-        definitionMap.set('version', literal('11.2.5'));
+        definitionMap.set('version', literal('11.2.9'));
         // e.g. `type: MyDirective`
         definitionMap.set('type', meta.internalType);
         // e.g. `selector: 'some-dir'`
@@ -21234,7 +21277,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
      */
     function createPipeDefinitionMap(meta) {
         const definitionMap = new DefinitionMap();
-        definitionMap.set('version', literal('11.2.5'));
+        definitionMap.set('version', literal('11.2.9'));
         definitionMap.set('ngImport', importExpr(Identifiers$1.core));
         // e.g. `type: MyPipe`
         definitionMap.set('type', meta.internalType);
@@ -21266,7 +21309,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
      * Use of this source code is governed by an MIT-style license that can be
      * found in the LICENSE file at https://angular.io/license
      */
-    const VERSION$2 = new Version('11.2.5');
+    const VERSION$2 = new Version('11.2.9');
 
     /**
      * @license
@@ -21468,14 +21511,20 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
          * An injectable already has a `ɵprov` property.
          */
         ErrorCode[ErrorCode["INJECTABLE_DUPLICATE_PROV"] = 9001] = "INJECTABLE_DUPLICATE_PROV";
-        // 10XXX error codes are reserved for diagnostics with category
-        // `ts.DiagnosticCategory.Suggestion`. These diagnostics are generated by
-        // language service.
+        // 10XXX error codes are reserved for diagnostics with categories other than
+        // `ts.DiagnosticCategory.Error`. These diagnostics are generated by the compiler when configured
+        // to do so by a tool such as the Language Service, or by the Language Service itself.
         /**
          * Suggest users to enable `strictTemplates` to make use of full capabilities
          * provided by Angular language service.
          */
         ErrorCode[ErrorCode["SUGGEST_STRICT_TEMPLATES"] = 10001] = "SUGGEST_STRICT_TEMPLATES";
+        /**
+         * Indicates that a particular structural directive provides advanced type narrowing
+         * functionality, but the current template type-checking configuration does not allow its usage in
+         * type inference.
+         */
+        ErrorCode[ErrorCode["SUGGEST_SUBOPTIMAL_TYPE_INFERENCE"] = 10002] = "SUGGEST_SUBOPTIMAL_TYPE_INFERENCE";
     })(ErrorCode || (ErrorCode = {}));
     /**
      * @internal
@@ -25488,6 +25537,417 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
         }
     }
 
+    /**
+     * @license
+     * Copyright Google LLC All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+    /**
+     * A phase of compilation for which time is tracked in a distinct bucket.
+     */
+    var PerfPhase;
+    (function (PerfPhase) {
+        /**
+         * The "default" phase which tracks time not spent in any other phase.
+         */
+        PerfPhase[PerfPhase["Unaccounted"] = 0] = "Unaccounted";
+        /**
+         * Time spent setting up the compiler, before a TypeScript program is created.
+         *
+         * This includes operations like configuring the `ts.CompilerHost` and any wrappers.
+         */
+        PerfPhase[PerfPhase["Setup"] = 1] = "Setup";
+        /**
+         * Time spent in `ts.createProgram`, including reading and parsing `ts.SourceFile`s in the
+         * `ts.CompilerHost`.
+         *
+         * This might be an incremental program creation operation.
+         */
+        PerfPhase[PerfPhase["TypeScriptProgramCreate"] = 2] = "TypeScriptProgramCreate";
+        /**
+         * Time spent reconciling the contents of an old `ts.Program` with the new incremental one.
+         *
+         * Only present in incremental compilations.
+         */
+        PerfPhase[PerfPhase["Reconciliation"] = 3] = "Reconciliation";
+        /**
+         * Time spent updating an `NgCompiler` instance with a resource-only change.
+         *
+         * Only present in incremental compilations where the change was resource-only.
+         */
+        PerfPhase[PerfPhase["ResourceUpdate"] = 4] = "ResourceUpdate";
+        /**
+         * Time spent calculating the plain TypeScript diagnostics (structural and semantic).
+         */
+        PerfPhase[PerfPhase["TypeScriptDiagnostics"] = 5] = "TypeScriptDiagnostics";
+        /**
+         * Time spent in Angular analysis of individual classes in the program.
+         */
+        PerfPhase[PerfPhase["Analysis"] = 6] = "Analysis";
+        /**
+         * Time spent in Angular global analysis (synthesis of analysis information into a complete
+         * understanding of the program).
+         */
+        PerfPhase[PerfPhase["Resolve"] = 7] = "Resolve";
+        /**
+         * Time spent building the import graph of the program in order to perform cycle detection.
+         */
+        PerfPhase[PerfPhase["CycleDetection"] = 8] = "CycleDetection";
+        /**
+         * Time spent generating the text of Type Check Blocks in order to perform template type checking.
+         */
+        PerfPhase[PerfPhase["TcbGeneration"] = 9] = "TcbGeneration";
+        /**
+         * Time spent updating the `ts.Program` with new Type Check Block code.
+         */
+        PerfPhase[PerfPhase["TcbUpdateProgram"] = 10] = "TcbUpdateProgram";
+        /**
+         * Time spent by TypeScript performing its emit operations, including downleveling and writing
+         * output files.
+         */
+        PerfPhase[PerfPhase["TypeScriptEmit"] = 11] = "TypeScriptEmit";
+        /**
+         * Time spent by Angular performing code transformations of ASTs as they're about to be emitted.
+         *
+         * This includes the actual code generation step for templates, and occurs during the emit phase
+         * (but is tracked separately from `TypeScriptEmit` time).
+         */
+        PerfPhase[PerfPhase["Compile"] = 12] = "Compile";
+        /**
+         * Time spent performing a `TemplateTypeChecker` autocompletion operation.
+         */
+        PerfPhase[PerfPhase["TtcAutocompletion"] = 13] = "TtcAutocompletion";
+        /**
+         * Time spent computing template type-checking diagnostics.
+         */
+        PerfPhase[PerfPhase["TtcDiagnostics"] = 14] = "TtcDiagnostics";
+        /**
+         * Time spent getting a `Symbol` from the `TemplateTypeChecker`.
+         */
+        PerfPhase[PerfPhase["TtcSymbol"] = 15] = "TtcSymbol";
+        /**
+         * Time spent by the Angular Language Service calculating a "get references" or a renaming
+         * operation.
+         */
+        PerfPhase[PerfPhase["LsReferencesAndRenames"] = 16] = "LsReferencesAndRenames";
+        /**
+         * Time spent by the Angular Language Service calculating a "quick info" operation.
+         */
+        PerfPhase[PerfPhase["LsQuickInfo"] = 17] = "LsQuickInfo";
+        /**
+         * Time spent by the Angular Language Service calculating a "get type definition" or "get
+         * definition" operation.
+         */
+        PerfPhase[PerfPhase["LsDefinition"] = 18] = "LsDefinition";
+        /**
+         * Time spent by the Angular Language Service calculating a "get completions" (AKA autocomplete)
+         * operation.
+         */
+        PerfPhase[PerfPhase["LsCompletions"] = 19] = "LsCompletions";
+        /**
+         * Time spent by the Angular Language Service calculating a "view template typecheck block"
+         * operation.
+         */
+        PerfPhase[PerfPhase["LsTcb"] = 20] = "LsTcb";
+        /**
+         * Time spent by the Angular Language Service calculating diagnostics.
+         */
+        PerfPhase[PerfPhase["LsDiagnostics"] = 21] = "LsDiagnostics";
+        /**
+         * Time spent by the Angular Language Service calculating a "get component locations for template"
+         * operation.
+         */
+        PerfPhase[PerfPhase["LsComponentLocations"] = 22] = "LsComponentLocations";
+        /**
+         * Tracks the number of `PerfPhase`s, and must appear at the end of the list.
+         */
+        PerfPhase[PerfPhase["LAST"] = 23] = "LAST";
+    })(PerfPhase || (PerfPhase = {}));
+    /**
+     * Represents some occurrence during compilation, and is tracked with a counter.
+     */
+    var PerfEvent;
+    (function (PerfEvent) {
+        /**
+         * Counts the number of `.d.ts` files in the program.
+         */
+        PerfEvent[PerfEvent["InputDtsFile"] = 0] = "InputDtsFile";
+        /**
+         * Counts the number of non-`.d.ts` files in the program.
+         */
+        PerfEvent[PerfEvent["InputTsFile"] = 1] = "InputTsFile";
+        /**
+         * An `@Component` class was analyzed.
+         */
+        PerfEvent[PerfEvent["AnalyzeComponent"] = 2] = "AnalyzeComponent";
+        /**
+         * An `@Directive` class was analyzed.
+         */
+        PerfEvent[PerfEvent["AnalyzeDirective"] = 3] = "AnalyzeDirective";
+        /**
+         * An `@Injectable` class was analyzed.
+         */
+        PerfEvent[PerfEvent["AnalyzeInjectable"] = 4] = "AnalyzeInjectable";
+        /**
+         * An `@NgModule` class was analyzed.
+         */
+        PerfEvent[PerfEvent["AnalyzeNgModule"] = 5] = "AnalyzeNgModule";
+        /**
+         * An `@Pipe` class was analyzed.
+         */
+        PerfEvent[PerfEvent["AnalyzePipe"] = 6] = "AnalyzePipe";
+        /**
+         * A trait was analyzed.
+         *
+         * In theory, this should be the sum of the `Analyze` counters for each decorator type.
+         */
+        PerfEvent[PerfEvent["TraitAnalyze"] = 7] = "TraitAnalyze";
+        /**
+         * A trait had a prior analysis available from an incremental program, and did not need to be
+         * re-analyzed.
+         */
+        PerfEvent[PerfEvent["TraitReuseAnalysis"] = 8] = "TraitReuseAnalysis";
+        /**
+         * A `ts.SourceFile` directly changed between the prior program and a new incremental compilation.
+         */
+        PerfEvent[PerfEvent["SourceFilePhysicalChange"] = 9] = "SourceFilePhysicalChange";
+        /**
+         * A `ts.SourceFile` did not physically changed, but according to the file dependency graph, has
+         * logically changed between the prior program and a new incremental compilation.
+         */
+        PerfEvent[PerfEvent["SourceFileLogicalChange"] = 10] = "SourceFileLogicalChange";
+        /**
+         * A `ts.SourceFile` has not logically changed and all of its analysis results were thus available
+         * for reuse.
+         */
+        PerfEvent[PerfEvent["SourceFileReuseAnalysis"] = 11] = "SourceFileReuseAnalysis";
+        /**
+         * A Type Check Block (TCB) was generated.
+         */
+        PerfEvent[PerfEvent["GenerateTcb"] = 12] = "GenerateTcb";
+        /**
+         * A Type Check Block (TCB) could not be generated because inlining was disabled, and the block
+         * would've required inlining.
+         */
+        PerfEvent[PerfEvent["SkipGenerateTcbNoInline"] = 13] = "SkipGenerateTcbNoInline";
+        /**
+         * A `.ngtypecheck.ts` file could be reused from the previous program and did not need to be
+         * regenerated.
+         */
+        PerfEvent[PerfEvent["ReuseTypeCheckFile"] = 14] = "ReuseTypeCheckFile";
+        /**
+         * The template type-checking program required changes and had to be updated in an incremental
+         * step.
+         */
+        PerfEvent[PerfEvent["UpdateTypeCheckProgram"] = 15] = "UpdateTypeCheckProgram";
+        /**
+         * The compiler was able to prove that a `ts.SourceFile` did not need to be re-emitted.
+         */
+        PerfEvent[PerfEvent["EmitSkipSourceFile"] = 16] = "EmitSkipSourceFile";
+        /**
+         * A `ts.SourceFile` was emitted.
+         */
+        PerfEvent[PerfEvent["EmitSourceFile"] = 17] = "EmitSourceFile";
+        /**
+         * Tracks the number of `PrefEvent`s, and must appear at the end of the list.
+         */
+        PerfEvent[PerfEvent["LAST"] = 18] = "LAST";
+    })(PerfEvent || (PerfEvent = {}));
+    /**
+     * Represents a checkpoint during compilation at which the memory usage of the compiler should be
+     * recorded.
+     */
+    var PerfCheckpoint;
+    (function (PerfCheckpoint) {
+        /**
+         * The point at which the `PerfRecorder` was created, and ideally tracks memory used before any
+         * compilation structures are created.
+         */
+        PerfCheckpoint[PerfCheckpoint["Initial"] = 0] = "Initial";
+        /**
+         * The point just after the `ts.Program` has been created.
+         */
+        PerfCheckpoint[PerfCheckpoint["TypeScriptProgramCreate"] = 1] = "TypeScriptProgramCreate";
+        /**
+         * The point just before Angular analysis starts.
+         *
+         * In the main usage pattern for the compiler, TypeScript diagnostics have been calculated at this
+         * point, so the `ts.TypeChecker` has fully ingested the current program, all `ts.Type` structures
+         * and `ts.Symbol`s have been created.
+         */
+        PerfCheckpoint[PerfCheckpoint["PreAnalysis"] = 2] = "PreAnalysis";
+        /**
+         * The point just after Angular analysis completes.
+         */
+        PerfCheckpoint[PerfCheckpoint["Analysis"] = 3] = "Analysis";
+        /**
+         * The point just after Angular resolution is complete.
+         */
+        PerfCheckpoint[PerfCheckpoint["Resolve"] = 4] = "Resolve";
+        /**
+         * The point just after Type Check Blocks (TCBs) have been generated.
+         */
+        PerfCheckpoint[PerfCheckpoint["TtcGeneration"] = 5] = "TtcGeneration";
+        /**
+         * The point just after the template type-checking program has been updated with any new TCBs.
+         */
+        PerfCheckpoint[PerfCheckpoint["TtcUpdateProgram"] = 6] = "TtcUpdateProgram";
+        /**
+         * The point just before emit begins.
+         *
+         * In the main usage pattern for the compiler, all template type-checking diagnostics have been
+         * requested at this point.
+         */
+        PerfCheckpoint[PerfCheckpoint["PreEmit"] = 7] = "PreEmit";
+        /**
+         * The point just after the program has been fully emitted.
+         */
+        PerfCheckpoint[PerfCheckpoint["Emit"] = 8] = "Emit";
+        /**
+         * Tracks the number of `PerfCheckpoint`s, and must appear at the end of the list.
+         */
+        PerfCheckpoint[PerfCheckpoint["LAST"] = 9] = "LAST";
+    })(PerfCheckpoint || (PerfCheckpoint = {}));
+
+    /**
+     * @license
+     * Copyright Google LLC All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+    function mark() {
+        return process.hrtime();
+    }
+    function timeSinceInMicros(mark) {
+        const delta = process.hrtime(mark);
+        return (delta[0] * 1000000) + Math.floor(delta[1] / 1000);
+    }
+
+    /**
+     * @license
+     * Copyright Google LLC All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+    /**
+     * A `PerfRecorder` that actively tracks performance statistics.
+     */
+    class ActivePerfRecorder {
+        constructor(zeroTime) {
+            this.zeroTime = zeroTime;
+            this.currentPhase = PerfPhase.Unaccounted;
+            this.currentPhaseEntered = this.zeroTime;
+            this.counters = Array(PerfEvent.LAST).fill(0);
+            this.phaseTime = Array(PerfPhase.LAST).fill(0);
+            this.bytes = Array(PerfCheckpoint.LAST).fill(0);
+            // Take an initial memory snapshot before any other compilation work begins.
+            this.memory(PerfCheckpoint.Initial);
+        }
+        /**
+         * Creates an `ActivePerfRecoder` with its zero point set to the current time.
+         */
+        static zeroedToNow() {
+            return new ActivePerfRecorder(mark());
+        }
+        reset() {
+            this.counters = Array(PerfEvent.LAST).fill(0);
+            this.phaseTime = Array(PerfPhase.LAST).fill(0);
+            this.bytes = Array(PerfCheckpoint.LAST).fill(0);
+            this.zeroTime = mark();
+            this.currentPhase = PerfPhase.Unaccounted;
+            this.currentPhaseEntered = this.zeroTime;
+        }
+        memory(after) {
+            this.bytes[after] = process.memoryUsage().heapUsed;
+        }
+        phase(phase) {
+            const previous = this.currentPhase;
+            this.phaseTime[this.currentPhase] += timeSinceInMicros(this.currentPhaseEntered);
+            this.currentPhase = phase;
+            this.currentPhaseEntered = mark();
+            return previous;
+        }
+        inPhase(phase, fn) {
+            const previousPhase = this.phase(phase);
+            try {
+                return fn();
+            }
+            finally {
+                this.phase(previousPhase);
+            }
+        }
+        eventCount(counter, incrementBy = 1) {
+            this.counters[counter] += incrementBy;
+        }
+        /**
+         * Return the current performance metrics as a serializable object.
+         */
+        finalize() {
+            // Track the last segment of time spent in `this.currentPhase` in the time array.
+            this.phase(PerfPhase.Unaccounted);
+            const results = {
+                events: {},
+                phases: {},
+                memory: {},
+            };
+            for (let i = 0; i < this.phaseTime.length; i++) {
+                if (this.phaseTime[i] > 0) {
+                    results.phases[PerfPhase[i]] = this.phaseTime[i];
+                }
+            }
+            for (let i = 0; i < this.phaseTime.length; i++) {
+                if (this.counters[i] > 0) {
+                    results.events[PerfEvent[i]] = this.counters[i];
+                }
+            }
+            for (let i = 0; i < this.bytes.length; i++) {
+                if (this.bytes[i] > 0) {
+                    results.memory[PerfCheckpoint[i]] = this.bytes[i];
+                }
+            }
+            return results;
+        }
+    }
+    /**
+     * A `PerfRecorder` that delegates to a target `PerfRecorder` which can be updated later.
+     *
+     * `DelegatingPerfRecorder` is useful when a compiler class that needs a `PerfRecorder` can outlive
+     * the current compilation. This is true for most compiler classes as resource-only changes reuse
+     * the same `NgCompiler` for a new compilation.
+     */
+    class DelegatingPerfRecorder {
+        constructor(target) {
+            this.target = target;
+        }
+        eventCount(counter, incrementBy) {
+            this.target.eventCount(counter, incrementBy);
+        }
+        phase(phase) {
+            return this.target.phase(phase);
+        }
+        inPhase(phase, fn) {
+            // Note: this doesn't delegate to `this.target.inPhase` but instead is implemented manually here
+            // to avoid adding an additional frame of noise to the stack when debugging.
+            const previousPhase = this.target.phase(phase);
+            try {
+                return fn();
+            }
+            finally {
+                this.target.phase(previousPhase);
+            }
+        }
+        memory(after) {
+            this.target.memory(after);
+        }
+        reset() {
+            this.target.reset();
+        }
+    }
+
     /**
      * @license
      * Copyright Google LLC All Rights Reserved.
@@ -25738,6 +26198,8 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
                 for (const priorRecord of priorWork) {
                     this.adopt(priorRecord);
                 }
+                this.perf.eventCount(PerfEvent.SourceFileReuseAnalysis);
+                this.perf.eventCount(PerfEvent.TraitReuseAnalysis, priorWork.length);
                 // Skip the rest of analysis, as this file's prior traits are being reused.
                 return;
             }
@@ -25941,6 +26403,7 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
             if (trait.state !== TraitState.Pending) {
                 throw new Error(`Attempt to analyze trait of ${clazz.name.text} in state ${TraitState[trait.state]} (expected DETECTED)`);
             }
+            this.perf.eventCount(PerfEvent.TraitAnalyze);
             // Attempt analysis. This could fail with a `FatalDiagnosticError`; catch it if it does.
             let result;
             try {
@@ -26079,7 +26542,6 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
                     // Cannot compile a trait that is not resolved, or had any errors in its declaration.
                     continue;
                 }
-                const compileSpan = this.perf.start('compileClass', original);
                 // `trait.resolution` is non-null asserted here because TypeScript does not recognize that
                 // `Readonly<unknown>` is nullable (as `unknown` itself is nullable) due to the way that
                 // `Readonly` works.
@@ -26093,7 +26555,6 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
                         trait.handler.compileFull(clazz, trait.analysis, trait.resolution, constantPool);
                 }
                 const compileMatchRes = compileRes;
-                this.perf.stop(compileSpan);
                 if (Array.isArray(compileMatchRes)) {
                     for (const result of compileMatchRes) {
                         if (!res.some(r => r.name === result.name)) {
@@ -27345,11 +27806,11 @@ define(['exports', 'typescript/lib/tsserverlibrary', 'os', 'typescript', 'fs', '
      */
     const NO_DECORATORS = new Set();
     const CLOSURE_FILE_OVERVIEW_REGEXP = /\s+@fileoverview\s+/i;
-    function ivyTransformFactory(compilation, reflector, importRewriter, defaultImportRecorder, isCore, isClosureCompilerEnabled) {
+    function ivyTransformFactory(compilation, reflector, importRewriter, defaultImportRecorder, perf, isCore, isClosureCompilerEnabled) {
         const recordWrappedNodeExpr = createRecorderFn(defaultImportRecorder);
         return (context) => {
             return (file) => {
-                return transformIvySourceFile(compilation, context, reflector, importRewriter, file, isCore, isClosureCompilerEnabled, recordWrappedNodeExpr);
+                return perf.inPhase(PerfPhase.Compile, () => transformIvySourceFile(compilation, context, reflector, importRewriter, file, isCore, isClosureCompilerEnabled, recordWrappedNodeExpr));
             };
         };
     }
@@ -28596,7 +29057,7 @@ Either add the @Injectable() decorator to '${provider.node.name
         return isSymbolEqual(current, previous);
     }
     class DirectiveDecoratorHandler {
-        constructor(reflector, evaluator, metaRegistry, scopeRegistry, metaReader, defaultImportRecorder, injectableRegistry, isCore, semanticDepGraphUpdater, annotateForClosureCompiler, compileUndecoratedClassesWithAngularFeatures) {
+        constructor(reflector, evaluator, metaRegistry, scopeRegistry, metaReader, defaultImportRecorder, injectableRegistry, isCore, semanticDepGraphUpdater, annotateForClosureCompiler, compileUndecoratedClassesWithAngularFeatures, perf) {
             this.reflector = reflector;
             this.evaluator = evaluator;
             this.metaRegistry = metaRegistry;
@@ -28608,6 +29069,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             this.semanticDepGraphUpdater = semanticDepGraphUpdater;
             this.annotateForClosureCompiler = annotateForClosureCompiler;
             this.compileUndecoratedClassesWithAngularFeatures = compileUndecoratedClassesWithAngularFeatures;
+            this.perf = perf;
             this.precedence = HandlerPrecedence.PRIMARY;
             this.name = DirectiveDecoratorHandler.name;
         }
@@ -28634,6 +29096,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             if (this.compileUndecoratedClassesWithAngularFeatures === false && decorator === null) {
                 return { diagnostics: [getUndecoratedClassWithAngularFeaturesDiagnostic(node)] };
             }
+            this.perf.eventCount(PerfEvent.AnalyzeDirective);
             const directiveResult = extractDirectiveMetadata(node, decorator, this.reflector, this.evaluator, this.defaultImportRecorder, this.isCore, flags, this.annotateForClosureCompiler);
             if (directiveResult === undefined) {
                 return {};
@@ -29231,7 +29694,7 @@ Either add the @Injectable() decorator to '${provider.node.name
      * Compiles @NgModule annotations to ngModuleDef fields.
      */
     class NgModuleDecoratorHandler {
-        constructor(reflector, evaluator, metaReader, metaRegistry, scopeRegistry, referencesRegistry, isCore, routeAnalyzer, refEmitter, factoryTracker, defaultImportRecorder, annotateForClosureCompiler, injectableRegistry, localeId) {
+        constructor(reflector, evaluator, metaReader, metaRegistry, scopeRegistry, referencesRegistry, isCore, routeAnalyzer, refEmitter, factoryTracker, defaultImportRecorder, annotateForClosureCompiler, injectableRegistry, perf, localeId) {
             this.reflector = reflector;
             this.evaluator = evaluator;
             this.metaReader = metaReader;
@@ -29245,6 +29708,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             this.defaultImportRecorder = defaultImportRecorder;
             this.annotateForClosureCompiler = annotateForClosureCompiler;
             this.injectableRegistry = injectableRegistry;
+            this.perf = perf;
             this.localeId = localeId;
             this.precedence = HandlerPrecedence.PRIMARY;
             this.name = NgModuleDecoratorHandler.name;
@@ -29266,6 +29730,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             }
         }
         analyze(node, decorator) {
+            this.perf.eventCount(PerfEvent.AnalyzeNgModule);
             const name = node.name.text;
             if (decorator.args === null || decorator.args.length > 1) {
                 throw new FatalDiagnosticError(ErrorCode.DECORATOR_ARITY_WRONG, Decorator.nodeForError(decorator), `Incorrect number of arguments to @NgModule decorator`);
@@ -29758,7 +30223,7 @@ Either add the @Injectable() decorator to '${provider.node.name
      * `DecoratorHandler` which handles the `@Component` annotation.
      */
     class ComponentDecoratorHandler {
-        constructor(reflector, evaluator, metaRegistry, metaReader, scopeReader, scopeRegistry, typeCheckScopeRegistry, resourceRegistry, isCore, resourceLoader, rootDirs, defaultPreserveWhitespaces, i18nUseExternalIds, enableI18nLegacyMessageIdFormat, usePoisonedData, i18nNormalizeLineEndingsInICUs, moduleResolver, cycleAnalyzer, cycleHandlingStrategy, refEmitter, defaultImportRecorder, depTracker, injectableRegistry, semanticDepGraphUpdater, annotateForClosureCompiler) {
+        constructor(reflector, evaluator, metaRegistry, metaReader, scopeReader, scopeRegistry, typeCheckScopeRegistry, resourceRegistry, isCore, resourceLoader, rootDirs, defaultPreserveWhitespaces, i18nUseExternalIds, enableI18nLegacyMessageIdFormat, usePoisonedData, i18nNormalizeLineEndingsInICUs, moduleResolver, cycleAnalyzer, cycleHandlingStrategy, refEmitter, defaultImportRecorder, depTracker, injectableRegistry, semanticDepGraphUpdater, annotateForClosureCompiler, perf) {
             this.reflector = reflector;
             this.evaluator = evaluator;
             this.metaRegistry = metaRegistry;
@@ -29784,6 +30249,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             this.injectableRegistry = injectableRegistry;
             this.semanticDepGraphUpdater = semanticDepGraphUpdater;
             this.annotateForClosureCompiler = annotateForClosureCompiler;
+            this.perf = perf;
             this.literalCache = new Map();
             this.elementSchemaRegistry = new DomElementSchemaRegistry();
             /**
@@ -29829,9 +30295,16 @@ Either add the @Injectable() decorator to '${provider.node.name
             const meta = this._resolveLiteral(decorator);
             const component = reflectObjectLiteral(meta);
             const containingFile = node.getSourceFile().fileName;
-            const resolveStyleUrl = (styleUrl, nodeForError, resourceType) => {
-                const resourceUrl = this._resolveResourceOrThrow(styleUrl, containingFile, nodeForError, resourceType);
-                return this.resourceLoader.preload(resourceUrl);
+            const resolveStyleUrl = (styleUrl) => {
+                try {
+                    const resourceUrl = this.resourceLoader.resolve(styleUrl, containingFile);
+                    return this.resourceLoader.preload(resourceUrl);
+                }
+                catch (_a) {
+                    // Don't worry about failures to preload. We can handle this problem during analysis by
+                    // producing a diagnostic.
+                    return undefined;
+                }
             };
             // A Promise that waits for the template and all <link>ed styles within it to be preloaded.
             const templateAndTemplateStyleResources = this._preloadAndParseTemplate(node, decorator, component, containingFile)
@@ -29839,9 +30312,7 @@ Either add the @Injectable() decorator to '${provider.node.name
                 if (template === null) {
                     return undefined;
                 }
-                const nodeForError = getTemplateDeclarationNodeForError(template.declaration);
-                return Promise
-                    .all(template.styleUrls.map(styleUrl => resolveStyleUrl(styleUrl, nodeForError, 1 /* StylesheetFromTemplate */)))
+                return Promise.all(template.styleUrls.map(styleUrl => resolveStyleUrl(styleUrl)))
                     .then(() => undefined);
             });
             // Extract all the styleUrls in the decorator.
@@ -29856,15 +30327,18 @@ Either add the @Injectable() decorator to '${provider.node.name
                 return Promise
                     .all([
                     templateAndTemplateStyleResources,
-                    ...componentStyleUrls.map(styleUrl => resolveStyleUrl(styleUrl.url, styleUrl.nodeForError, 2 /* StylesheetFromDecorator */))
+                    ...componentStyleUrls.map(styleUrl => resolveStyleUrl(styleUrl.url))
                 ])
                     .then(() => undefined);
             }
         }
         analyze(node, decorator, flags = HandlerFlags.NONE) {
             var _a;
+            this.perf.eventCount(PerfEvent.AnalyzeComponent);
             const containingFile = node.getSourceFile().fileName;
             this.literalCache.delete(decorator);
+            let diagnostics;
+            let isPoisoned = false;
             // @Component inherits @Directive, so begin by extracting the @Directive metadata and building
             // on it.
             const directiveResult = extractDirectiveMetadata(node, decorator, this.reflector, this.evaluator, this.defaultImportRecorder, this.isCore, flags, this.annotateForClosureCompiler, this.elementSchemaRegistry.getDefaultComponentElementName());
@@ -29932,14 +30406,23 @@ Either add the @Injectable() decorator to '${provider.node.name
                 ...this._extractComponentStyleUrls(component), ...this._extractTemplateStyleUrls(template)
             ];
             for (const styleUrl of styleUrls) {
-                const resourceType = styleUrl.source === 2 /* StylesheetFromDecorator */ ?
-                    2 /* StylesheetFromDecorator */ :
-                    1 /* StylesheetFromTemplate */;
-                const resourceUrl = this._resolveResourceOrThrow(styleUrl.url, containingFile, styleUrl.nodeForError, resourceType);
-                const resourceStr = this.resourceLoader.load(resourceUrl);
-                styles.push(resourceStr);
-                if (this.depTracker !== null) {
-                    this.depTracker.addResourceDependency(node.getSourceFile(), absoluteFrom(resourceUrl));
+                try {
+                    const resourceUrl = this.resourceLoader.resolve(styleUrl.url, containingFile);
+                    const resourceStr = this.resourceLoader.load(resourceUrl);
+                    styles.push(resourceStr);
+                    if (this.depTracker !== null) {
+                        this.depTracker.addResourceDependency(node.getSourceFile(), absoluteFrom(resourceUrl));
+                    }
+                }
+                catch (_b) {
+                    if (diagnostics === undefined) {
+                        diagnostics = [];
+                    }
+                    const resourceType = styleUrl.source === 2 /* StylesheetFromDecorator */ ?
+                        2 /* StylesheetFromDecorator */ :
+                        1 /* StylesheetFromTemplate */;
+                    diagnostics.push(this.makeResourceNotFoundError(styleUrl.url, styleUrl.nodeForError, resourceType)
+                        .toDiagnostic());
                 }
             }
             let inlineStyles = null;
@@ -29982,8 +30465,9 @@ Either add the @Injectable() decorator to '${provider.node.name
                         styles: styleResources,
                         template: templateResource,
                     },
-                    isPoisoned: false,
+                    isPoisoned,
                 },
+                diagnostics,
             };
             if (changeDetection !== null) {
                 output.analysis.meta.changeDetection = changeDetection;
@@ -30212,12 +30696,15 @@ Either add the @Injectable() decorator to '${provider.node.name
             let styles = [];
             if (analysis.styleUrls !== null) {
                 for (const styleUrl of analysis.styleUrls) {
-                    const resourceType = styleUrl.source === 2 /* StylesheetFromDecorator */ ?
-                        2 /* StylesheetFromDecorator */ :
-                        1 /* StylesheetFromTemplate */;
-                    const resolvedStyleUrl = this._resolveResourceOrThrow(styleUrl.url, containingFile, styleUrl.nodeForError, resourceType);
-                    const styleText = this.resourceLoader.load(resolvedStyleUrl);
-                    styles.push(styleText);
+                    try {
+                        const resolvedStyleUrl = this.resourceLoader.resolve(styleUrl.url, containingFile);
+                        const styleText = this.resourceLoader.load(resolvedStyleUrl);
+                        styles.push(styleText);
+                    }
+                    catch (e) {
+                        // Resource resolve failures should already be in the diagnostics list from the analyze
+                        // stage. We do not need to do anything with them when updating resources.
+                    }
                 }
             }
             if (analysis.inlineStyles !== null) {
@@ -30339,8 +30826,15 @@ Either add the @Injectable() decorator to '${provider.node.name
             const styleUrlsExpr = component.get('styleUrls');
             if (styleUrlsExpr !== undefined && ts$1.isArrayLiteralExpression(styleUrlsExpr)) {
                 for (const expression of stringLiteralElements(styleUrlsExpr)) {
-                    const resourceUrl = this._resolveResourceOrThrow(expression.text, containingFile, expression, 2 /* StylesheetFromDecorator */);
-                    styles.add({ path: absoluteFrom(resourceUrl), expression });
+                    try {
+                        const resourceUrl = this.resourceLoader.resolve(expression.text, containingFile);
+                        styles.add({ path: absoluteFrom(resourceUrl), expression });
+                    }
+                    catch (_a) {
+                        // Errors in style resource extraction do not need to be handled here. We will produce
+                        // diagnostics for each one that fails in the analysis, after we evaluate the `styleUrls`
+                        // expression to determine _all_ style resources, not just the string literals.
+                    }
                 }
             }
             const stylesExpr = component.get('styles');
@@ -30359,20 +30853,25 @@ Either add the @Injectable() decorator to '${provider.node.name
                 if (typeof templateUrl !== 'string') {
                     throw createValueHasWrongTypeError(templateUrlExpr, templateUrl, 'templateUrl must be a string');
                 }
-                const resourceUrl = this._resolveResourceOrThrow(templateUrl, containingFile, templateUrlExpr, 0 /* Template */);
-                const templatePromise = this.resourceLoader.preload(resourceUrl);
-                // If the preload worked, then actually load and parse the template, and wait for any style
-                // URLs to resolve.
-                if (templatePromise !== undefined) {
-                    return templatePromise.then(() => {
-                        const templateDecl = this.parseTemplateDeclaration(decorator, component, containingFile);
-                        const template = this.extractTemplate(node, templateDecl);
-                        this.preanalyzeTemplateCache.set(node, template);
-                        return template;
-                    });
+                try {
+                    const resourceUrl = this.resourceLoader.resolve(templateUrl, containingFile);
+                    const templatePromise = this.resourceLoader.preload(resourceUrl);
+                    // If the preload worked, then actually load and parse the template, and wait for any style
+                    // URLs to resolve.
+                    if (templatePromise !== undefined) {
+                        return templatePromise.then(() => {
+                            const templateDecl = this.parseTemplateDeclaration(decorator, component, containingFile);
+                            const template = this.extractTemplate(node, templateDecl);
+                            this.preanalyzeTemplateCache.set(node, template);
+                            return template;
+                        });
+                    }
+                    else {
+                        return Promise.resolve(null);
+                    }
                 }
-                else {
-                    return Promise.resolve(null);
+                catch (e) {
+                    throw this.makeResourceNotFoundError(templateUrl, templateUrlExpr, 0 /* Template */);
                 }
             }
             else {
@@ -30504,16 +31003,21 @@ Either add the @Injectable() decorator to '${provider.node.name
                 if (typeof templateUrl !== 'string') {
                     throw createValueHasWrongTypeError(templateUrlExpr, templateUrl, 'templateUrl must be a string');
                 }
-                const resourceUrl = this._resolveResourceOrThrow(templateUrl, containingFile, templateUrlExpr, 0 /* Template */);
-                return {
-                    isInline: false,
-                    interpolationConfig,
-                    preserveWhitespaces,
-                    templateUrl,
-                    templateUrlExpression: templateUrlExpr,
-                    resolvedTemplateUrl: resourceUrl,
-                    sourceMapUrl: sourceMapUrl(resourceUrl),
-                };
+                try {
+                    const resourceUrl = this.resourceLoader.resolve(templateUrl, containingFile);
+                    return {
+                        isInline: false,
+                        interpolationConfig,
+                        preserveWhitespaces,
+                        templateUrl,
+                        templateUrlExpression: templateUrlExpr,
+                        resolvedTemplateUrl: resourceUrl,
+                        sourceMapUrl: sourceMapUrl(resourceUrl),
+                    };
+                }
+                catch (e) {
+                    throw this.makeResourceNotFoundError(templateUrl, templateUrlExpr, 0 /* Template */);
+                }
             }
             else if (component.has('template')) {
                 return {
@@ -30566,30 +31070,20 @@ Either add the @Injectable() decorator to '${provider.node.name
             }
             this.cycleAnalyzer.recordSyntheticImport(origin, imported);
         }
-        /**
-         * Resolve the url of a resource relative to the file that contains the reference to it.
-         *
-         * Throws a FatalDiagnosticError when unable to resolve the file.
-         */
-        _resolveResourceOrThrow(file, basePath, nodeForError, resourceType) {
-            try {
-                return this.resourceLoader.resolve(file, basePath);
-            }
-            catch (e) {
-                let errorText;
-                switch (resourceType) {
-                    case 0 /* Template */:
-                        errorText = `Could not find template file '${file}'.`;
-                        break;
-                    case 1 /* StylesheetFromTemplate */:
-                        errorText = `Could not find stylesheet file '${file}' linked from the template.`;
-                        break;
-                    case 2 /* StylesheetFromDecorator */:
-                        errorText = `Could not find stylesheet file '${file}'.`;
-                        break;
-                }
-                throw new FatalDiagnosticError(ErrorCode.COMPONENT_RESOURCE_NOT_FOUND, nodeForError, errorText);
+        makeResourceNotFoundError(file, nodeForError, resourceType) {
+            let errorText;
+            switch (resourceType) {
+                case 0 /* Template */:
+                    errorText = `Could not find template file '${file}'.`;
+                    break;
+                case 1 /* StylesheetFromTemplate */:
+                    errorText = `Could not find stylesheet file '${file}' linked from the template.`;
+                    break;
+                case 2 /* StylesheetFromDecorator */:
+                    errorText = `Could not find stylesheet file '${file}'.`;
+                    break;
             }
+            return new FatalDiagnosticError(ErrorCode.COMPONENT_RESOURCE_NOT_FOUND, nodeForError, errorText);
         }
         _extractTemplateStyleUrls(template) {
             if (template.styleUrls === null) {
@@ -30657,7 +31151,7 @@ Either add the @Injectable() decorator to '${provider.node.name
      * Adapts the `compileIvyInjectable` compiler for `@Injectable` decorators to the Ivy compiler.
      */
     class InjectableDecoratorHandler {
-        constructor(reflector, defaultImportRecorder, isCore, strictCtorDeps, injectableRegistry, 
+        constructor(reflector, defaultImportRecorder, isCore, strictCtorDeps, injectableRegistry, perf, 
         /**
          * What to do if the injectable already contains a ɵprov property.
          *
@@ -30670,6 +31164,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             this.isCore = isCore;
             this.strictCtorDeps = strictCtorDeps;
             this.injectableRegistry = injectableRegistry;
+            this.perf = perf;
             this.errorOnDuplicateProv = errorOnDuplicateProv;
             this.precedence = HandlerPrecedence.SHARED;
             this.name = InjectableDecoratorHandler.name;
@@ -30691,6 +31186,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             }
         }
         analyze(node, decorator) {
+            this.perf.eventCount(PerfEvent.AnalyzeInjectable);
             const meta = extractInjectableMetadata(node, decorator, this.reflector);
             const decorators = this.reflector.getDecoratorsOfDeclaration(node);
             return {
@@ -30946,7 +31442,7 @@ Either add the @Injectable() decorator to '${provider.node.name
         }
     }
     class PipeDecoratorHandler {
-        constructor(reflector, evaluator, metaRegistry, scopeRegistry, defaultImportRecorder, injectableRegistry, isCore) {
+        constructor(reflector, evaluator, metaRegistry, scopeRegistry, defaultImportRecorder, injectableRegistry, isCore, perf) {
             this.reflector = reflector;
             this.evaluator = evaluator;
             this.metaRegistry = metaRegistry;
@@ -30954,6 +31450,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             this.defaultImportRecorder = defaultImportRecorder;
             this.injectableRegistry = injectableRegistry;
             this.isCore = isCore;
+            this.perf = perf;
             this.precedence = HandlerPrecedence.PRIMARY;
             this.name = PipeDecoratorHandler.name;
         }
@@ -30974,6 +31471,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             }
         }
         analyze(clazz, decorator) {
+            this.perf.eventCount(PerfEvent.AnalyzePipe);
             const name = clazz.name.text;
             const type = wrapTypeReference(this.reflector, clazz);
             const internalType = new WrappedNodeExpr(this.reflector.getInternalNameOfClass(clazz));
@@ -31152,8 +31650,9 @@ Either add the @Injectable() decorator to '${provider.node.name
      * dependencies within the same program are tracked; imports into packages on NPM are not.
      */
     class ImportGraph {
-        constructor(checker) {
+        constructor(checker, perf) {
             this.checker = checker;
+            this.perf = perf;
             this.map = new Map();
         }
         /**
@@ -31229,25 +31728,27 @@ Either add the @Injectable() decorator to '${provider.node.name
             }
         }
         scanImports(sf) {
-            const imports = new Set();
-            // Look through the source file for import and export statements.
-            for (const stmt of sf.statements) {
-                if ((!ts$1.isImportDeclaration(stmt) && !ts$1.isExportDeclaration(stmt)) ||
-                    stmt.moduleSpecifier === undefined) {
-                    continue;
-                }
-                const symbol = this.checker.getSymbolAtLocation(stmt.moduleSpecifier);
-                if (symbol === undefined || symbol.valueDeclaration === undefined) {
-                    // No symbol could be found to skip over this import/export.
-                    continue;
-                }
-                const moduleFile = symbol.valueDeclaration;
-                if (ts$1.isSourceFile(moduleFile) && isLocalFile(moduleFile)) {
-                    // Record this local import.
-                    imports.add(moduleFile);
+            return this.perf.inPhase(PerfPhase.CycleDetection, () => {
+                const imports = new Set();
+                // Look through the source file for import and export statements.
+                for (const stmt of sf.statements) {
+                    if ((!ts$1.isImportDeclaration(stmt) && !ts$1.isExportDeclaration(stmt)) ||
+                        stmt.moduleSpecifier === undefined) {
+                        continue;
+                    }
+                    const symbol = this.checker.getSymbolAtLocation(stmt.moduleSpecifier);
+                    if (symbol === undefined || symbol.valueDeclaration === undefined) {
+                        // No symbol could be found to skip over this import/export.
+                        continue;
+                    }
+                    const moduleFile = symbol.valueDeclaration;
+                    if (ts$1.isSourceFile(moduleFile) && isLocalFile(moduleFile)) {
+                        // Record this local import.
+                        imports.add(moduleFile);
+                    }
                 }
-            }
-            return imports;
+                return imports;
+            });
         }
     }
     function isLocalFile(sf) {
@@ -31609,103 +32110,107 @@ Either add the @Injectable() decorator to '${provider.node.name
          * The previous build's `BuildState` is reconciled with the new program's changes, and the results
          * are merged into the new build's `PendingBuildState`.
          */
-        static reconcile(oldProgram, oldDriver, newProgram, modifiedResourceFiles) {
-            // Initialize the state of the current build based on the previous one.
-            let state;
-            if (oldDriver.state.kind === BuildStateKind.Pending) {
-                // The previous build never made it past the pending state. Reuse it as the starting state for
-                // this build.
-                state = oldDriver.state;
-            }
-            else {
-                let priorGraph = null;
-                if (oldDriver.state.lastGood !== null) {
-                    priorGraph = oldDriver.state.lastGood.semanticDepGraph;
-                }
-                // The previous build was successfully analyzed. `pendingEmit` is the only state carried
-                // forward into this build.
-                state = {
-                    kind: BuildStateKind.Pending,
-                    pendingEmit: oldDriver.state.pendingEmit,
-                    pendingTypeCheckEmit: oldDriver.state.pendingTypeCheckEmit,
-                    changedResourcePaths: new Set(),
-                    changedTsPaths: new Set(),
-                    lastGood: oldDriver.state.lastGood,
-                    semanticDepGraphUpdater: new SemanticDepGraphUpdater(priorGraph),
-                };
-            }
-            // Merge the freshly modified resource files with any prior ones.
-            if (modifiedResourceFiles !== null) {
-                for (const resFile of modifiedResourceFiles) {
-                    state.changedResourcePaths.add(absoluteFrom(resFile));
-                }
-            }
-            // Next, process the files in the new program, with a couple of goals:
-            // 1) Determine which TS files have changed, if any, and merge them into `changedTsFiles`.
-            // 2) Produce a list of TS files which no longer exist in the program (they've been deleted
-            //    since the previous compilation). These need to be removed from the state tracking to avoid
-            //    leaking memory.
-            // All files in the old program, for easy detection of changes.
-            const oldFiles = new Set(oldProgram.getSourceFiles());
-            // Assume all the old files were deleted to begin with. Only TS files are tracked.
-            const deletedTsPaths = new Set(tsOnlyFiles(oldProgram).map(sf => sf.fileName));
-            for (const newFile of newProgram.getSourceFiles()) {
-                if (!newFile.isDeclarationFile) {
-                    // This file exists in the new program, so remove it from `deletedTsPaths`.
-                    deletedTsPaths.delete(newFile.fileName);
-                }
-                if (oldFiles.has(newFile)) {
-                    // This file hasn't changed; no need to look at it further.
-                    continue;
-                }
-                // The file has changed since the last successful build. The appropriate reaction depends on
-                // what kind of file it is.
-                if (!newFile.isDeclarationFile) {
-                    // It's a .ts file, so track it as a change.
-                    state.changedTsPaths.add(newFile.fileName);
+        static reconcile(oldProgram, oldDriver, newProgram, modifiedResourceFiles, perf) {
+            return perf.inPhase(PerfPhase.Reconciliation, () => {
+                // Initialize the state of the current build based on the previous one.
+                let state;
+                if (oldDriver.state.kind === BuildStateKind.Pending) {
+                    // The previous build never made it past the pending state. Reuse it as the starting state
+                    // for this build.
+                    state = oldDriver.state;
                 }
                 else {
-                    // It's a .d.ts file. Currently the compiler does not do a great job of tracking
-                    // dependencies on .d.ts files, so bail out of incremental builds here and do a full build.
-                    // This usually only happens if something in node_modules changes.
-                    return IncrementalDriver.fresh(newProgram);
-                }
-            }
-            // The next step is to remove any deleted files from the state.
-            for (const filePath of deletedTsPaths) {
-                state.pendingEmit.delete(filePath);
-                state.pendingTypeCheckEmit.delete(filePath);
-                // Even if the file doesn't exist in the current compilation, it still might have been changed
-                // in a previous one, so delete it from the set of changed TS files, just in case.
-                state.changedTsPaths.delete(filePath);
-            }
-            // Now, changedTsPaths contains physically changed TS paths. Use the previous program's logical
-            // dependency graph to determine logically changed files.
-            const depGraph = new FileDependencyGraph();
-            // If a previous compilation exists, use its dependency graph to determine the set of logically
-            // changed files.
-            let logicalChanges = null;
-            if (state.lastGood !== null) {
-                // Extract the set of logically changed files. At the same time, this operation populates the
-                // current (fresh) dependency graph with information about those files which have not
-                // logically changed.
-                logicalChanges = depGraph.updateWithPhysicalChanges(state.lastGood.depGraph, state.changedTsPaths, deletedTsPaths, state.changedResourcePaths);
-                for (const fileName of state.changedTsPaths) {
-                    logicalChanges.add(fileName);
-                }
-                // Any logically changed files need to be re-emitted. Most of the time this would happen
-                // regardless because the new dependency graph would _also_ identify the file as stale.
-                // However there are edge cases such as removing a component from an NgModule without adding
-                // it to another one, where the previous graph identifies the file as logically changed, but
-                // the new graph (which does not have that edge) fails to identify that the file should be
-                // re-emitted.
-                for (const change of logicalChanges) {
-                    state.pendingEmit.add(change);
-                    state.pendingTypeCheckEmit.add(change);
+                    let priorGraph = null;
+                    if (oldDriver.state.lastGood !== null) {
+                        priorGraph = oldDriver.state.lastGood.semanticDepGraph;
+                    }
+                    // The previous build was successfully analyzed. `pendingEmit` is the only state carried
+                    // forward into this build.
+                    state = {
+                        kind: BuildStateKind.Pending,
+                        pendingEmit: oldDriver.state.pendingEmit,
+                        pendingTypeCheckEmit: oldDriver.state.pendingTypeCheckEmit,
+                        changedResourcePaths: new Set(),
+                        changedTsPaths: new Set(),
+                        lastGood: oldDriver.state.lastGood,
+                        semanticDepGraphUpdater: new SemanticDepGraphUpdater(priorGraph),
+                    };
                 }
-            }
-            // `state` now reflects the initial pending state of the current compilation.
-            return new IncrementalDriver(state, depGraph, logicalChanges);
+                // Merge the freshly modified resource files with any prior ones.
+                if (modifiedResourceFiles !== null) {
+                    for (const resFile of modifiedResourceFiles) {
+                        state.changedResourcePaths.add(absoluteFrom(resFile));
+                    }
+                }
+                // Next, process the files in the new program, with a couple of goals:
+                // 1) Determine which TS files have changed, if any, and merge them into `changedTsFiles`.
+                // 2) Produce a list of TS files which no longer exist in the program (they've been deleted
+                //    since the previous compilation). These need to be removed from the state tracking to
+                //    avoid leaking memory.
+                // All files in the old program, for easy detection of changes.
+                const oldFiles = new Set(oldProgram.getSourceFiles());
+                // Assume all the old files were deleted to begin with. Only TS files are tracked.
+                const deletedTsPaths = new Set(tsOnlyFiles(oldProgram).map(sf => sf.fileName));
+                for (const newFile of newProgram.getSourceFiles()) {
+                    if (!newFile.isDeclarationFile) {
+                        // This file exists in the new program, so remove it from `deletedTsPaths`.
+                        deletedTsPaths.delete(newFile.fileName);
+                    }
+                    if (oldFiles.has(newFile)) {
+                        // This file hasn't changed; no need to look at it further.
+                        continue;
+                    }
+                    // The file has changed since the last successful build. The appropriate reaction depends on
+                    // what kind of file it is.
+                    if (!newFile.isDeclarationFile) {
+                        // It's a .ts file, so track it as a change.
+                        state.changedTsPaths.add(newFile.fileName);
+                    }
+                    else {
+                        // It's a .d.ts file. Currently the compiler does not do a great job of tracking
+                        // dependencies on .d.ts files, so bail out of incremental builds here and do a full
+                        // build. This usually only happens if something in node_modules changes.
+                        return IncrementalDriver.fresh(newProgram);
+                    }
+                }
+                // The next step is to remove any deleted files from the state.
+                for (const filePath of deletedTsPaths) {
+                    state.pendingEmit.delete(filePath);
+                    state.pendingTypeCheckEmit.delete(filePath);
+                    // Even if the file doesn't exist in the current compilation, it still might have been
+                    // changed in a previous one, so delete it from the set of changed TS files, just in case.
+                    state.changedTsPaths.delete(filePath);
+                }
+                perf.eventCount(PerfEvent.SourceFilePhysicalChange, state.changedTsPaths.size);
+                // Now, changedTsPaths contains physically changed TS paths. Use the previous program's
+                // logical dependency graph to determine logically changed files.
+                const depGraph = new FileDependencyGraph();
+                // If a previous compilation exists, use its dependency graph to determine the set of
+                // logically changed files.
+                let logicalChanges = null;
+                if (state.lastGood !== null) {
+                    // Extract the set of logically changed files. At the same time, this operation populates
+                    // the current (fresh) dependency graph with information about those files which have not
+                    // logically changed.
+                    logicalChanges = depGraph.updateWithPhysicalChanges(state.lastGood.depGraph, state.changedTsPaths, deletedTsPaths, state.changedResourcePaths);
+                    perf.eventCount(PerfEvent.SourceFileLogicalChange, logicalChanges.size);
+                    for (const fileName of state.changedTsPaths) {
+                        logicalChanges.add(fileName);
+                    }
+                    // Any logically changed files need to be re-emitted. Most of the time this would happen
+                    // regardless because the new dependency graph would _also_ identify the file as stale.
+                    // However there are edge cases such as removing a component from an NgModule without adding
+                    // it to another one, where the previous graph identifies the file as logically changed, but
+                    // the new graph (which does not have that edge) fails to identify that the file should be
+                    // re-emitted.
+                    for (const change of logicalChanges) {
+                        state.pendingEmit.add(change);
+                        state.pendingTypeCheckEmit.add(change);
+                    }
+                }
+                // `state` now reflects the initial pending state of the current compilation.
+                return new IncrementalDriver(state, depGraph, logicalChanges);
+            });
         }
         static fresh(program) {
             // Initialize the set of files which need to be emitted to the set of all TS files in the
@@ -32390,29 +32895,6 @@ Either add the @Injectable() decorator to '${provider.node.name
             node.modifiers.some(mod => mod.kind === ts$1.SyntaxKind.StaticKeyword);
     }
 
-    const NOOP_PERF_RECORDER = {
-        enabled: false,
-        mark: (name, node, category, detail) => { },
-        start: (name, node, category, detail) => {
-            return 0;
-        },
-        stop: (span) => { },
-    };
-
-    /**
-     * @license
-     * Copyright Google LLC All Rights Reserved.
-     *
-     * Use of this source code is governed by an MIT-style license that can be
-     * found in the LICENSE file at https://angular.io/license
-     */
-    var PerfLogEventType;
-    (function (PerfLogEventType) {
-        PerfLogEventType[PerfLogEventType["SPAN_OPEN"] = 0] = "SPAN_OPEN";
-        PerfLogEventType[PerfLogEventType["SPAN_CLOSE"] = 1] = "SPAN_CLOSE";
-        PerfLogEventType[PerfLogEventType["MARK"] = 2] = "MARK";
-    })(PerfLogEventType || (PerfLogEventType = {}));
-
     /**
      * @license
      * Copyright Google LLC All Rights Reserved.
@@ -35333,6 +35815,30 @@ Either add the @Injectable() decorator to '${provider.node.name
             }
             this._diagnostics.push(makeInlineDiagnostic(templateId, ErrorCode.INLINE_TYPE_CTOR_REQUIRED, node.name, message, directives.map(dir => makeRelatedInformation(dir.name, `Requires an inline type constructor.`))));
         }
+        suboptimalTypeInference(templateId, variables) {
+            const mapping = this.resolver.getSourceMapping(templateId);
+            // Select one of the template variables that's most suitable for reporting the diagnostic. Any
+            // variable will do, but prefer one bound to the context's $implicit if present.
+            let diagnosticVar = null;
+            for (const variable of variables) {
+                if (diagnosticVar === null || (variable.value === '' || variable.value === '$implicit')) {
+                    diagnosticVar = variable;
+                }
+            }
+            if (diagnosticVar === null) {
+                // There is no variable on which to report the diagnostic.
+                return;
+            }
+            let varIdentification = `'${diagnosticVar.name}'`;
+            if (variables.length === 2) {
+                varIdentification += ` (and 1 other)`;
+            }
+            else if (variables.length > 2) {
+                varIdentification += ` (and ${variables.length - 1} others)`;
+            }
+            const message = `This structural directive supports advanced type inference, but the current compiler configuration prevents its usage. The variable ${varIdentification} will have type 'any' as a result.\n\nConsider enabling the 'strictTemplates' option in your tsconfig.json for better type inference within this template.`;
+            this._diagnostics.push(makeTemplateDiagnostic(templateId, mapping, diagnosticVar.keySpan, ts$1.DiagnosticCategory.Suggestion, ngErrorCode(ErrorCode.SUGGEST_SUBOPTIMAL_TYPE_INFERENCE), message));
+        }
     }
     function makeInlineDiagnostic(templateId, code, node, messageText, relatedInformation) {
         return Object.assign(Object.assign({}, makeDiagnostic(code, node, messageText, relatedInformation)), { componentFile: node.getSourceFile(), templateId });
@@ -36184,11 +36690,20 @@ Either add the @Injectable() decorator to '${provider.node.name
                     });
                     // The second kind of guard is a template context guard. This guard narrows the template
                     // rendering context variable `ctx`.
-                    if (dir.hasNgTemplateContextGuard && this.tcb.env.config.applyTemplateContextGuards) {
-                        const ctx = this.scope.resolve(this.template);
-                        const guardInvoke = tsCallMethod(dirId, 'ngTemplateContextGuard', [dirInstId, ctx]);
-                        addParseSpanInfo(guardInvoke, this.template.sourceSpan);
-                        directiveGuards.push(guardInvoke);
+                    if (dir.hasNgTemplateContextGuard) {
+                        if (this.tcb.env.config.applyTemplateContextGuards) {
+                            const ctx = this.scope.resolve(this.template);
+                            const guardInvoke = tsCallMethod(dirId, 'ngTemplateContextGuard', [dirInstId, ctx]);
+                            addParseSpanInfo(guardInvoke, this.template.sourceSpan);
+                            directiveGuards.push(guardInvoke);
+                        }
+                        else if (this.template.variables.length > 0 &&
+                            this.tcb.env.config.suggestionsForSuboptimalTypeInference) {
+                            // The compiler could have inferred a better type for the variables in this template,
+                            // but was prevented from doing so by the type-checking configuration. Issue a warning
+                            // diagnostic.
+                            this.tcb.oobRecorder.suboptimalTypeInference(this.tcb.id, this.template.variables);
+                        }
                     }
                 }
             }
@@ -36246,15 +36761,10 @@ Either add the @Injectable() decorator to '${provider.node.name
         }
     }
     /**
-     * A `TcbOp` which constructs an instance of a directive _without_ setting any of its inputs. Inputs
-     * are later set in the `TcbDirectiveInputsOp`. Type checking was found to be faster when done in
-     * this way as opposed to `TcbDirectiveCtorOp` which is only necessary when the directive is
-     * generic.
-     *
-     * Executing this operation returns a reference to the directive instance variable with its inferred
-     * type.
+     * A `TcbOp` which constructs an instance of a directive. For generic directives, generic
+     * parameters are set to `any` type.
      */
-    class TcbDirectiveTypeOp extends TcbOp {
+    class TcbDirectiveTypeOpBase extends TcbOp {
         constructor(tcb, scope, node, dir) {
             super();
             this.tcb = tcb;
@@ -36269,14 +36779,65 @@ Either add the @Injectable() decorator to '${provider.node.name
             return true;
         }
         execute() {
+            const dirRef = this.dir.ref;
+            const rawType = this.tcb.env.referenceType(this.dir.ref);
+            let type;
+            if (this.dir.isGeneric === false || dirRef.node.typeParameters === undefined) {
+                type = rawType;
+            }
+            else {
+                if (!ts$1.isTypeReferenceNode(rawType)) {
+                    throw new Error(`Expected TypeReferenceNode when referencing the type for ${this.dir.ref.debugName}`);
+                }
+                const typeArguments = dirRef.node.typeParameters.map(() => ts$1.factory.createKeywordTypeNode(ts$1.SyntaxKind.AnyKeyword));
+                type = ts$1.factory.createTypeReferenceNode(rawType.typeName, typeArguments);
+            }
             const id = this.tcb.allocateId();
-            const type = this.tcb.env.referenceType(this.dir.ref);
             addExpressionIdentifier(type, ExpressionIdentifier.DIRECTIVE);
             addParseSpanInfo(type, this.node.startSourceSpan || this.node.sourceSpan);
             this.scope.addStatement(tsDeclareVariable(id, type));
             return id;
         }
     }
+    /**
+     * A `TcbOp` which constructs an instance of a non-generic directive _without_ setting any of its
+     * inputs. Inputs  are later set in the `TcbDirectiveInputsOp`. Type checking was found to be
+     * faster when done in this way as opposed to `TcbDirectiveCtorOp` which is only necessary when the
+     * directive is generic.
+     *
+     * Executing this operation returns a reference to the directive instance variable with its inferred
+     * type.
+     */
+    class TcbNonGenericDirectiveTypeOp extends TcbDirectiveTypeOpBase {
+        /**
+         * Creates a variable declaration for this op's directive of the argument type. Returns the id of
+         * the newly created variable.
+         */
+        execute() {
+            const dirRef = this.dir.ref;
+            if (this.dir.isGeneric) {
+                throw new Error(`Assertion Error: expected ${dirRef.debugName} not to be generic.`);
+            }
+            return super.execute();
+        }
+    }
+    /**
+     * A `TcbOp` which constructs an instance of a generic directive with its generic parameters set
+     * to `any` type. This op is like `TcbDirectiveTypeOp`, except that generic parameters are set to
+     * `any` type. This is used for situations where we want to avoid inlining.
+     *
+     * Executing this operation returns a reference to the directive instance variable with its generic
+     * type parameters set to `any`.
+     */
+    class TcbGenericDirectiveTypeWithAnyParamsOp extends TcbDirectiveTypeOpBase {
+        execute() {
+            const dirRef = this.dir.ref;
+            if (dirRef.node.typeParameters === undefined) {
+                throw new Error(`Assertion Error: expected typeParameters when creating a declaration for ${dirRef.debugName}`);
+            }
+            return super.execute();
+        }
+    }
     /**
      * A `TcbOp` which creates a variable for a local ref in a template.
      * The initializer for the variable is the variable expression for the directive, template, or
@@ -37198,8 +37759,26 @@ Either add the @Injectable() decorator to '${provider.node.name
             }
             const dirMap = new Map();
             for (const dir of directives) {
-                const directiveOp = dir.isGeneric ? new TcbDirectiveCtorOp(this.tcb, this, node, dir) :
-                    new TcbDirectiveTypeOp(this.tcb, this, node, dir);
+                let directiveOp;
+                const host = this.tcb.env.reflector;
+                const dirRef = dir.ref;
+                if (!dir.isGeneric) {
+                    // The most common case is that when a directive is not generic, we use the normal
+                    // `TcbNonDirectiveTypeOp`.
+                    directiveOp = new TcbNonGenericDirectiveTypeOp(this.tcb, this, node, dir);
+                }
+                else if (!requiresInlineTypeCtor(dirRef.node, host) ||
+                    this.tcb.env.config.useInlineTypeConstructors) {
+                    // For generic directives, we use a type constructor to infer types. If a directive requires
+                    // an inline type constructor, then inlining must be available to use the
+                    // `TcbDirectiveCtorOp`. If not we, we fallback to using `any` – see below.
+                    directiveOp = new TcbDirectiveCtorOp(this.tcb, this, node, dir);
+                }
+                else {
+                    // If inlining is not available, then we give up on infering the generic params, and use
+                    // `any` type for the directive's generic parameters.
+                    directiveOp = new TcbGenericDirectiveTypeWithAnyParamsOp(this.tcb, this, node, dir);
+                }
                 const dirIndex = this.opQueue.push(directiveOp) - 1;
                 dirMap.set(dir, dirIndex);
                 this.opQueue.push(new TcbDirectiveInputsOp(this.tcb, this, node, dir));
@@ -37623,12 +38202,12 @@ Either add the @Injectable() decorator to '${provider.node.name
             const fn = generateTypeCheckBlock(this, ref, fnId, meta, domSchemaChecker, oobRecorder);
             this.tcbStatements.push(fn);
         }
-        render() {
+        render(removeComments) {
             let source = this.importManager.getAllImports(this.contextFile.fileName)
                 .map(i => `import * as ${i.qualifier.text} from '${i.specifier}';`)
                 .join('\n') +
                 '\n\n';
-            const printer = ts$1.createPrinter();
+            const printer = ts$1.createPrinter({ removeComments });
             source += '\n';
             for (const stmt of this.pipeInstStatements) {
                 source += printer.printNode(ts$1.EmitHint.Unspecified, stmt, this.contextFile) + '\n';
@@ -37679,7 +38258,7 @@ Either add the @Injectable() decorator to '${provider.node.name
      * type checked.
      */
     class TypeCheckContextImpl {
-        constructor(config, compilerHost, componentMappingStrategy, refEmitter, reflector, host, inlining) {
+        constructor(config, compilerHost, componentMappingStrategy, refEmitter, reflector, host, inlining, perf) {
             this.config = config;
             this.compilerHost = compilerHost;
             this.componentMappingStrategy = componentMappingStrategy;
@@ -37687,6 +38266,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             this.reflector = reflector;
             this.host = host;
             this.inlining = inlining;
+            this.perf = perf;
             this.fileMap = new Map();
             /**
              * A `Map` of `ts.SourceFile`s that the context has seen to the operations (additions of methods
@@ -37698,6 +38278,10 @@ Either add the @Injectable() decorator to '${provider.node.name
              * queued.
              */
             this.typeCtorPending = new Set();
+            if (inlining === InliningMode.Error && config.useInlineTypeConstructors) {
+                // We cannot use inlining for type checking since this environment does not support it.
+                throw new Error(`AssertionError: invalid inlining configuration.`);
+            }
         }
         /**
          * Register a template to potentially be type-checked.
@@ -37715,20 +38299,18 @@ Either add the @Injectable() decorator to '${provider.node.name
             if (parseErrors !== null) {
                 templateDiagnostics.push(...this.getTemplateDiagnostics(parseErrors, templateId, sourceMapping));
             }
-            // Accumulate a list of any directives which could not have type constructors generated due to
-            // unsupported inlining operations.
-            let missingInlines = [];
             const boundTarget = binder.bind({ template });
-            // Get all of the directives used in the template and record type constructors for all of them.
-            for (const dir of boundTarget.getUsedDirectives()) {
-                const dirRef = dir.ref;
-                const dirNode = dirRef.node;
-                if (dir.isGeneric && requiresInlineTypeCtor(dirNode, this.reflector)) {
-                    if (this.inlining === InliningMode.Error) {
-                        missingInlines.push(dirNode);
+            if (this.inlining === InliningMode.InlineOps) {
+                // Get all of the directives used in the template and record inline type constructors when
+                // required.
+                for (const dir of boundTarget.getUsedDirectives()) {
+                    const dirRef = dir.ref;
+                    const dirNode = dirRef.node;
+                    if (!dir.isGeneric || !requiresInlineTypeCtor(dirNode, this.reflector)) {
+                        // inlining not required
                         continue;
                     }
-                    // Add a type constructor operation for the directive.
+                    // Add an inline type constructor operation for the directive.
                     this.addInlineTypeCtor(fileData, dirNode.getSourceFile(), dirRef, {
                         fnName: 'ngTypeCtor',
                         // The constructor should have a body if the directive comes from a .ts file, but not if
@@ -37752,17 +38334,13 @@ Either add the @Injectable() decorator to '${provider.node.name
             const tcbRequiresInline = requiresInlineTypeCheckBlock(ref.node, pipes);
             // If inlining is not supported, but is required for either the TCB or one of its directive
             // dependencies, then exit here with an error.
-            if (this.inlining === InliningMode.Error && (tcbRequiresInline || missingInlines.length > 0)) {
+            if (this.inlining === InliningMode.Error && tcbRequiresInline) {
                 // This template cannot be supported because the underlying strategy does not support inlining
                 // and inlining would be required.
                 // Record diagnostics to indicate the issues with this template.
-                if (tcbRequiresInline) {
-                    shimData.oobRecorder.requiresInlineTcb(templateId, ref.node);
-                }
-                if (missingInlines.length > 0) {
-                    shimData.oobRecorder.requiresInlineTypeConstructors(templateId, ref.node, missingInlines);
-                }
+                shimData.oobRecorder.requiresInlineTcb(templateId, ref.node);
                 // Checking this template would be unsupported, so don't try.
+                this.perf.eventCount(PerfEvent.SkipGenerateTcbNoInline);
                 return;
             }
             const meta = {
@@ -37771,6 +38349,7 @@ Either add the @Injectable() decorator to '${provider.node.name
                 pipes,
                 schemas,
             };
+            this.perf.eventCount(PerfEvent.GenerateTcb);
             if (tcbRequiresInline) {
                 // This class didn't meet the requirements for external type checking, so generate an inline
                 // TCB for the class.
@@ -37857,7 +38436,7 @@ Either add the @Injectable() decorator to '${provider.node.name
                         path: pendingShimData.file.fileName,
                         templates: pendingShimData.templates,
                     });
-                    updates.set(pendingShimData.file.fileName, pendingShimData.file.render());
+                    updates.set(pendingShimData.file.fileName, pendingShimData.file.render(false /* removeComments */));
                 }
             }
             return updates;
@@ -38587,7 +39166,7 @@ Either add the @Injectable() decorator to '${provider.node.name
      * `ProgramTypeCheckAdapter` for generation of template type-checking code.
      */
     class TemplateTypeCheckerImpl {
-        constructor(originalProgram, typeCheckingStrategy, typeCheckAdapter, config, refEmitter, reflector, compilerHost, priorBuild, componentScopeReader, typeCheckScopeRegistry) {
+        constructor(originalProgram, typeCheckingStrategy, typeCheckAdapter, config, refEmitter, reflector, compilerHost, priorBuild, componentScopeReader, typeCheckScopeRegistry, perf) {
             this.originalProgram = originalProgram;
             this.typeCheckingStrategy = typeCheckingStrategy;
             this.typeCheckAdapter = typeCheckAdapter;
@@ -38598,6 +39177,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             this.priorBuild = priorBuild;
             this.componentScopeReader = componentScopeReader;
             this.typeCheckScopeRegistry = typeCheckScopeRegistry;
+            this.perf = perf;
             this.state = new Map();
             /**
              * Stores the `CompletionEngine` which powers autocompletion for each component class.
@@ -38709,48 +39289,52 @@ Either add the @Injectable() decorator to '${provider.node.name
                     this.ensureAllShimsForOneFile(sf);
                     break;
             }
-            const sfPath = absoluteFromSourceFile(sf);
-            const fileRecord = this.state.get(sfPath);
-            const typeCheckProgram = this.typeCheckingStrategy.getProgram();
-            const diagnostics = [];
-            if (fileRecord.hasInlines) {
-                const inlineSf = getSourceFileOrError(typeCheckProgram, sfPath);
-                diagnostics.push(...typeCheckProgram.getSemanticDiagnostics(inlineSf).map(diag => convertDiagnostic(diag, fileRecord.sourceManager)));
-            }
-            for (const [shimPath, shimRecord] of fileRecord.shimData) {
+            return this.perf.inPhase(PerfPhase.TtcDiagnostics, () => {
+                const sfPath = absoluteFromSourceFile(sf);
+                const fileRecord = this.state.get(sfPath);
+                const typeCheckProgram = this.typeCheckingStrategy.getProgram();
+                const diagnostics = [];
+                if (fileRecord.hasInlines) {
+                    const inlineSf = getSourceFileOrError(typeCheckProgram, sfPath);
+                    diagnostics.push(...typeCheckProgram.getSemanticDiagnostics(inlineSf).map(diag => convertDiagnostic(diag, fileRecord.sourceManager)));
+                }
+                for (const [shimPath, shimRecord] of fileRecord.shimData) {
+                    const shimSf = getSourceFileOrError(typeCheckProgram, shimPath);
+                    diagnostics.push(...typeCheckProgram.getSemanticDiagnostics(shimSf).map(diag => convertDiagnostic(diag, fileRecord.sourceManager)));
+                    diagnostics.push(...shimRecord.genesisDiagnostics);
+                    for (const templateData of shimRecord.templates.values()) {
+                        diagnostics.push(...templateData.templateDiagnostics);
+                    }
+                }
+                return diagnostics.filter((diag) => diag !== null);
+            });
+        }
+        getDiagnosticsForComponent(component) {
+            this.ensureShimForComponent(component);
+            return this.perf.inPhase(PerfPhase.TtcDiagnostics, () => {
+                const sf = component.getSourceFile();
+                const sfPath = absoluteFromSourceFile(sf);
+                const shimPath = this.typeCheckingStrategy.shimPathForComponent(component);
+                const fileRecord = this.getFileData(sfPath);
+                if (!fileRecord.shimData.has(shimPath)) {
+                    return [];
+                }
+                const templateId = fileRecord.sourceManager.getTemplateId(component);
+                const shimRecord = fileRecord.shimData.get(shimPath);
+                const typeCheckProgram = this.typeCheckingStrategy.getProgram();
+                const diagnostics = [];
+                if (shimRecord.hasInlines) {
+                    const inlineSf = getSourceFileOrError(typeCheckProgram, sfPath);
+                    diagnostics.push(...typeCheckProgram.getSemanticDiagnostics(inlineSf).map(diag => convertDiagnostic(diag, fileRecord.sourceManager)));
+                }
                 const shimSf = getSourceFileOrError(typeCheckProgram, shimPath);
                 diagnostics.push(...typeCheckProgram.getSemanticDiagnostics(shimSf).map(diag => convertDiagnostic(diag, fileRecord.sourceManager)));
                 diagnostics.push(...shimRecord.genesisDiagnostics);
                 for (const templateData of shimRecord.templates.values()) {
                     diagnostics.push(...templateData.templateDiagnostics);
                 }
-            }
-            return diagnostics.filter((diag) => diag !== null);
-        }
-        getDiagnosticsForComponent(component) {
-            this.ensureShimForComponent(component);
-            const sf = component.getSourceFile();
-            const sfPath = absoluteFromSourceFile(sf);
-            const shimPath = this.typeCheckingStrategy.shimPathForComponent(component);
-            const fileRecord = this.getFileData(sfPath);
-            if (!fileRecord.shimData.has(shimPath)) {
-                return [];
-            }
-            const templateId = fileRecord.sourceManager.getTemplateId(component);
-            const shimRecord = fileRecord.shimData.get(shimPath);
-            const typeCheckProgram = this.typeCheckingStrategy.getProgram();
-            const diagnostics = [];
-            if (shimRecord.hasInlines) {
-                const inlineSf = getSourceFileOrError(typeCheckProgram, sfPath);
-                diagnostics.push(...typeCheckProgram.getSemanticDiagnostics(inlineSf).map(diag => convertDiagnostic(diag, fileRecord.sourceManager)));
-            }
-            const shimSf = getSourceFileOrError(typeCheckProgram, shimPath);
-            diagnostics.push(...typeCheckProgram.getSemanticDiagnostics(shimSf).map(diag => convertDiagnostic(diag, fileRecord.sourceManager)));
-            diagnostics.push(...shimRecord.genesisDiagnostics);
-            for (const templateData of shimRecord.templates.values()) {
-                diagnostics.push(...templateData.templateDiagnostics);
-            }
-            return diagnostics.filter((diag) => diag !== null && diag.templateId === templateId);
+                return diagnostics.filter((diag) => diag !== null && diag.templateId === templateId);
+            });
         }
         getTypeCheckBlock(component) {
             return this.getLatestComponentState(component).tcb;
@@ -38760,14 +39344,14 @@ Either add the @Injectable() decorator to '${provider.node.name
             if (engine === null) {
                 return null;
             }
-            return engine.getGlobalCompletions(context);
+            return this.perf.inPhase(PerfPhase.TtcAutocompletion, () => engine.getGlobalCompletions(context));
         }
         getExpressionCompletionLocation(ast, component) {
             const engine = this.getOrCreateCompletionEngine(component);
             if (engine === null) {
                 return null;
             }
-            return engine.getExpressionCompletionLocation(ast);
+            return this.perf.inPhase(PerfPhase.TtcAutocompletion, () => engine.getExpressionCompletionLocation(ast));
         }
         invalidateClass(clazz) {
             this.completionCache.delete(clazz);
@@ -38808,43 +39392,48 @@ Either add the @Injectable() decorator to '${provider.node.name
             if (previousResults === null || !previousResults.isComplete) {
                 return;
             }
+            this.perf.eventCount(PerfEvent.ReuseTypeCheckFile);
             this.state.set(sfPath, previousResults);
         }
         ensureAllShimsForAllFiles() {
             if (this.isComplete) {
                 return;
             }
-            const host = new WholeProgramTypeCheckingHost(this);
-            const ctx = this.newContext(host);
-            for (const sf of this.originalProgram.getSourceFiles()) {
-                if (sf.isDeclarationFile || isShim(sf)) {
-                    continue;
+            this.perf.inPhase(PerfPhase.TcbGeneration, () => {
+                const host = new WholeProgramTypeCheckingHost(this);
+                const ctx = this.newContext(host);
+                for (const sf of this.originalProgram.getSourceFiles()) {
+                    if (sf.isDeclarationFile || isShim(sf)) {
+                        continue;
+                    }
+                    this.maybeAdoptPriorResultsForFile(sf);
+                    const sfPath = absoluteFromSourceFile(sf);
+                    const fileData = this.getFileData(sfPath);
+                    if (fileData.isComplete) {
+                        continue;
+                    }
+                    this.typeCheckAdapter.typeCheck(sf, ctx);
+                    fileData.isComplete = true;
                 }
+                this.updateFromContext(ctx);
+                this.isComplete = true;
+            });
+        }
+        ensureAllShimsForOneFile(sf) {
+            this.perf.inPhase(PerfPhase.TcbGeneration, () => {
                 this.maybeAdoptPriorResultsForFile(sf);
                 const sfPath = absoluteFromSourceFile(sf);
                 const fileData = this.getFileData(sfPath);
                 if (fileData.isComplete) {
-                    continue;
+                    // All data for this file is present and accounted for already.
+                    return;
                 }
+                const host = new SingleFileTypeCheckingHost(sfPath, fileData, this.typeCheckingStrategy, this);
+                const ctx = this.newContext(host);
                 this.typeCheckAdapter.typeCheck(sf, ctx);
                 fileData.isComplete = true;
-            }
-            this.updateFromContext(ctx);
-            this.isComplete = true;
-        }
-        ensureAllShimsForOneFile(sf) {
-            this.maybeAdoptPriorResultsForFile(sf);
-            const sfPath = absoluteFromSourceFile(sf);
-            const fileData = this.getFileData(sfPath);
-            if (fileData.isComplete) {
-                // All data for this file is present and accounted for already.
-                return;
-            }
-            const host = new SingleFileTypeCheckingHost(sfPath, fileData, this.typeCheckingStrategy, this);
-            const ctx = this.newContext(host);
-            this.typeCheckAdapter.typeCheck(sf, ctx);
-            fileData.isComplete = true;
-            this.updateFromContext(ctx);
+                this.updateFromContext(ctx);
+            });
         }
         ensureShimForComponent(component) {
             const sf = component.getSourceFile();
@@ -38864,7 +39453,7 @@ Either add the @Injectable() decorator to '${provider.node.name
         newContext(host) {
             const inlining = this.typeCheckingStrategy.supportsInlineOperations ? InliningMode.InlineOps :
                 InliningMode.Error;
-            return new TypeCheckContextImpl(this.config, this.compilerHost, this.typeCheckingStrategy, this.refEmitter, this.reflector, host, inlining);
+            return new TypeCheckContextImpl(this.config, this.compilerHost, this.typeCheckingStrategy, this.refEmitter, this.reflector, host, inlining, this.perf);
         }
         /**
          * Remove any shim data that depends on inline operations applied to the type-checking program.
@@ -38889,8 +39478,14 @@ Either add the @Injectable() decorator to '${provider.node.name
         }
         updateFromContext(ctx) {
             const updates = ctx.finalize();
-            this.typeCheckingStrategy.updateFiles(updates, UpdateMode.Incremental);
-            this.priorBuild.recordSuccessfulTypeCheck(this.state);
+            return this.perf.inPhase(PerfPhase.TcbUpdateProgram, () => {
+                if (updates.size > 0) {
+                    this.perf.eventCount(PerfEvent.UpdateTypeCheckProgram);
+                }
+                this.typeCheckingStrategy.updateFiles(updates, UpdateMode.Incremental);
+                this.priorBuild.recordSuccessfulTypeCheck(this.state);
+                this.perf.memory(PerfCheckpoint.TtcUpdateProgram);
+            });
         }
         getFileData(path) {
             if (!this.state.has(path)) {
@@ -38908,7 +39503,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             if (builder === null) {
                 return null;
             }
-            return builder.getSymbol(node);
+            return this.perf.inPhase(PerfPhase.TtcSymbol, () => builder.getSymbol(node));
         }
         getOrCreateSymbolBuilder(component) {
             if (this.symbolBuilderCache.has(component)) {
@@ -39167,7 +39762,7 @@ Either add the @Injectable() decorator to '${provider.node.name
     /**
      * Create a `CompilationTicket` for a brand new compilation, using no prior state.
      */
-    function freshCompilationTicket(tsProgram, options, incrementalBuildStrategy, typeCheckingProgramStrategy, enableTemplateTypeChecker, usePoisonedData) {
+    function freshCompilationTicket(tsProgram, options, incrementalBuildStrategy, typeCheckingProgramStrategy, perfRecorder, enableTemplateTypeChecker, usePoisonedData) {
         return {
             kind: CompilationTicketKind.Fresh,
             tsProgram,
@@ -39176,21 +39771,25 @@ Either add the @Injectable() decorator to '${provider.node.name
             typeCheckingProgramStrategy,
             enableTemplateTypeChecker,
             usePoisonedData,
+            perfRecorder: perfRecorder !== null && perfRecorder !== void 0 ? perfRecorder : ActivePerfRecorder.zeroedToNow(),
         };
     }
     /**
      * Create a `CompilationTicket` as efficiently as possible, based on a previous `NgCompiler`
      * instance and a new `ts.Program`.
      */
-    function incrementalFromCompilerTicket(oldCompiler, newProgram, incrementalBuildStrategy, typeCheckingProgramStrategy, modifiedResourceFiles) {
+    function incrementalFromCompilerTicket(oldCompiler, newProgram, incrementalBuildStrategy, typeCheckingProgramStrategy, modifiedResourceFiles, perfRecorder) {
         const oldProgram = oldCompiler.getNextProgram();
         const oldDriver = oldCompiler.incrementalStrategy.getIncrementalDriver(oldProgram);
         if (oldDriver === null) {
             // No incremental step is possible here, since no IncrementalDriver was found for the old
             // program.
-            return freshCompilationTicket(newProgram, oldCompiler.options, incrementalBuildStrategy, typeCheckingProgramStrategy, oldCompiler.enableTemplateTypeChecker, oldCompiler.usePoisonedData);
+            return freshCompilationTicket(newProgram, oldCompiler.options, incrementalBuildStrategy, typeCheckingProgramStrategy, perfRecorder, oldCompiler.enableTemplateTypeChecker, oldCompiler.usePoisonedData);
+        }
+        if (perfRecorder === null) {
+            perfRecorder = ActivePerfRecorder.zeroedToNow();
         }
-        const newDriver = IncrementalDriver.reconcile(oldProgram, oldDriver, newProgram, modifiedResourceFiles);
+        const newDriver = IncrementalDriver.reconcile(oldProgram, oldDriver, newProgram, modifiedResourceFiles, perfRecorder);
         return {
             kind: CompilationTicketKind.IncrementalTypeScript,
             enableTemplateTypeChecker: oldCompiler.enableTemplateTypeChecker,
@@ -39201,6 +39800,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             newDriver,
             oldProgram,
             newProgram,
+            perfRecorder,
         };
     }
     function resourceChangeTicket(compiler, modifiedResourceFiles) {
@@ -39208,6 +39808,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             kind: CompilationTicketKind.IncrementalResource,
             compiler,
             modifiedResourceFiles,
+            perfRecorder: ActivePerfRecorder.zeroedToNow(),
         };
     }
     /**
@@ -39223,7 +39824,7 @@ Either add the @Injectable() decorator to '${provider.node.name
      * See the README.md for more information.
      */
     class NgCompiler {
-        constructor(adapter, options, tsProgram, typeCheckingProgramStrategy, incrementalStrategy, incrementalDriver, enableTemplateTypeChecker, usePoisonedData, perfRecorder = NOOP_PERF_RECORDER) {
+        constructor(adapter, options, tsProgram, typeCheckingProgramStrategy, incrementalStrategy, incrementalDriver, enableTemplateTypeChecker, usePoisonedData, livePerfRecorder) {
             this.adapter = adapter;
             this.options = options;
             this.tsProgram = tsProgram;
@@ -39232,7 +39833,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             this.incrementalDriver = incrementalDriver;
             this.enableTemplateTypeChecker = enableTemplateTypeChecker;
             this.usePoisonedData = usePoisonedData;
-            this.perfRecorder = perfRecorder;
+            this.livePerfRecorder = livePerfRecorder;
             /**
              * Lazily evaluated state of the compilation.
              *
@@ -39252,6 +39853,13 @@ Either add the @Injectable() decorator to '${provider.node.name
              * This is set by (and memoizes) `getNonTemplateDiagnostics`.
              */
             this.nonTemplateDiagnostics = null;
+            /**
+             * `NgCompiler` can be reused for multiple compilations (for resource-only changes), and each
+             * new compilation uses a fresh `PerfRecorder`. Thus, classes created with a lifespan of the
+             * `NgCompiler` use a `DelegatingPerfRecorder` so the `PerfRecorder` they write to can be updated
+             * with each fresh compilation.
+             */
+            this.delegatingPerfRecorder = new DelegatingPerfRecorder(this.perfRecorder);
             this.constructionDiagnostics.push(...this.adapter.constructionDiagnostics);
             const incompatibleTypeCheckOptionsDiagnostic = verifyCompatibleTypeCheckOptions(this.options);
             if (incompatibleTypeCheckOptionsDiagnostic !== null) {
@@ -39262,9 +39870,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             this.entryPoint =
                 adapter.entryPoint !== null ? getSourceFileOrNull(tsProgram, adapter.entryPoint) : null;
             const moduleResolutionCache = ts$1.createModuleResolutionCache(this.adapter.getCurrentDirectory(), 
-            // Note: this used to be an arrow-function closure. However, JS engines like v8 have some
-            // strange behaviors with retaining the lexical scope of the closure. Even if this function
-            // doesn't retain a reference to `this`, if other closures in the constructor here reference
+            // doen't retain a reference to `this`, if other closures in the constructor here reference
             // `this` internally then a closure created here would retain them. This can cause major
             // memory leak issues since the `moduleResolutionCache` is a long-lived object and finds its
             // way into all kinds of places inside TS internal objects.
@@ -39272,55 +39878,75 @@ Either add the @Injectable() decorator to '${provider.node.name
             this.moduleResolver =
                 new ModuleResolver(tsProgram, this.options, this.adapter, moduleResolutionCache);
             this.resourceManager = new AdapterResourceLoader(adapter, this.options);
-            this.cycleAnalyzer = new CycleAnalyzer(new ImportGraph(tsProgram.getTypeChecker()));
+            this.cycleAnalyzer =
+                new CycleAnalyzer(new ImportGraph(tsProgram.getTypeChecker(), this.delegatingPerfRecorder));
             this.incrementalStrategy.setIncrementalDriver(this.incrementalDriver, tsProgram);
             this.ignoreForDiagnostics =
                 new Set(tsProgram.getSourceFiles().filter(sf => this.adapter.isShim(sf)));
             this.ignoreForEmit = this.adapter.ignoreForEmit;
+            let dtsFileCount = 0;
+            let nonDtsFileCount = 0;
+            for (const sf of tsProgram.getSourceFiles()) {
+                if (sf.isDeclarationFile) {
+                    dtsFileCount++;
+                }
+                else {
+                    nonDtsFileCount++;
+                }
+            }
+            livePerfRecorder.eventCount(PerfEvent.InputDtsFile, dtsFileCount);
+            livePerfRecorder.eventCount(PerfEvent.InputTsFile, nonDtsFileCount);
         }
         /**
          * Convert a `CompilationTicket` into an `NgCompiler` instance for the requested compilation.
          *
          * Depending on the nature of the compilation request, the `NgCompiler` instance may be reused
          * from a previous compilation and updated with any changes, it may be a new instance which
-         * incrementally reuses state from a previous compilation, or it may represent a fresh compilation
-         * entirely.
+         * incrementally reuses state from a previous compilation, or it may represent a fresh
+         * compilation entirely.
          */
-        static fromTicket(ticket, adapter, perfRecorder) {
+        static fromTicket(ticket, adapter) {
             switch (ticket.kind) {
                 case CompilationTicketKind.Fresh:
-                    return new NgCompiler(adapter, ticket.options, ticket.tsProgram, ticket.typeCheckingProgramStrategy, ticket.incrementalBuildStrategy, IncrementalDriver.fresh(ticket.tsProgram), ticket.enableTemplateTypeChecker, ticket.usePoisonedData, perfRecorder);
+                    return new NgCompiler(adapter, ticket.options, ticket.tsProgram, ticket.typeCheckingProgramStrategy, ticket.incrementalBuildStrategy, IncrementalDriver.fresh(ticket.tsProgram), ticket.enableTemplateTypeChecker, ticket.usePoisonedData, ticket.perfRecorder);
                 case CompilationTicketKind.IncrementalTypeScript:
-                    return new NgCompiler(adapter, ticket.options, ticket.newProgram, ticket.typeCheckingProgramStrategy, ticket.incrementalBuildStrategy, ticket.newDriver, ticket.enableTemplateTypeChecker, ticket.usePoisonedData, perfRecorder);
+                    return new NgCompiler(adapter, ticket.options, ticket.newProgram, ticket.typeCheckingProgramStrategy, ticket.incrementalBuildStrategy, ticket.newDriver, ticket.enableTemplateTypeChecker, ticket.usePoisonedData, ticket.perfRecorder);
                 case CompilationTicketKind.IncrementalResource:
                     const compiler = ticket.compiler;
-                    compiler.updateWithChangedResources(ticket.modifiedResourceFiles);
+                    compiler.updateWithChangedResources(ticket.modifiedResourceFiles, ticket.perfRecorder);
                     return compiler;
             }
         }
-        updateWithChangedResources(changedResources) {
-            if (this.compilation === null) {
-                // Analysis hasn't happened yet, so no update is necessary - any changes to resources will be
-                // captured by the inital analysis pass itself.
-                return;
-            }
-            this.resourceManager.invalidate();
-            const classesToUpdate = new Set();
-            for (const resourceFile of changedResources) {
-                for (const templateClass of this.getComponentsWithTemplateFile(resourceFile)) {
-                    classesToUpdate.add(templateClass);
+        get perfRecorder() {
+            return this.livePerfRecorder;
+        }
+        updateWithChangedResources(changedResources, perfRecorder) {
+            this.livePerfRecorder = perfRecorder;
+            this.delegatingPerfRecorder.target = perfRecorder;
+            perfRecorder.inPhase(PerfPhase.ResourceUpdate, () => {
+                if (this.compilation === null) {
+                    // Analysis hasn't happened yet, so no update is necessary - any changes to resources will
+                    // be captured by the inital analysis pass itself.
+                    return;
                 }
-                for (const styleClass of this.getComponentsWithStyleFile(resourceFile)) {
-                    classesToUpdate.add(styleClass);
+                this.resourceManager.invalidate();
+                const classesToUpdate = new Set();
+                for (const resourceFile of changedResources) {
+                    for (const templateClass of this.getComponentsWithTemplateFile(resourceFile)) {
+                        classesToUpdate.add(templateClass);
+                    }
+                    for (const styleClass of this.getComponentsWithStyleFile(resourceFile)) {
+                        classesToUpdate.add(styleClass);
+                    }
                 }
-            }
-            for (const clazz of classesToUpdate) {
-                this.compilation.traitCompiler.updateResources(clazz);
-                if (!ts$1.isClassDeclaration(clazz)) {
-                    continue;
+                for (const clazz of classesToUpdate) {
+                    this.compilation.traitCompiler.updateResources(clazz);
+                    if (!ts$1.isClassDeclaration(clazz)) {
+                        continue;
+                    }
+                    this.compilation.templateTypeChecker.invalidateClass(clazz);
                 }
-                this.compilation.templateTypeChecker.invalidateClass(clazz);
-            }
+            });
         }
         /**
          * Get the resource dependencies of a file.
@@ -39427,29 +40053,23 @@ Either add the @Injectable() decorator to '${provider.node.name
                 if (this.compilation !== null) {
                     return;
                 }
-                this.compilation = this.makeCompilation();
-                const analyzeSpan = this.perfRecorder.start('analyze');
-                const promises = [];
-                for (const sf of this.tsProgram.getSourceFiles()) {
-                    if (sf.isDeclarationFile) {
-                        continue;
-                    }
-                    const analyzeFileSpan = this.perfRecorder.start('analyzeFile', sf);
-                    let analysisPromise = this.compilation.traitCompiler.analyzeAsync(sf);
-                    this.scanForMwp(sf);
-                    if (analysisPromise === undefined) {
-                        this.perfRecorder.stop(analyzeFileSpan);
-                    }
-                    else if (this.perfRecorder.enabled) {
-                        analysisPromise = analysisPromise.then(() => this.perfRecorder.stop(analyzeFileSpan));
-                    }
-                    if (analysisPromise !== undefined) {
-                        promises.push(analysisPromise);
+                yield this.perfRecorder.inPhase(PerfPhase.Analysis, () => __awaiter(this, void 0, void 0, function* () {
+                    this.compilation = this.makeCompilation();
+                    const promises = [];
+                    for (const sf of this.tsProgram.getSourceFiles()) {
+                        if (sf.isDeclarationFile) {
+                            continue;
+                        }
+                        let analysisPromise = this.compilation.traitCompiler.analyzeAsync(sf);
+                        this.scanForMwp(sf);
+                        if (analysisPromise !== undefined) {
+                            promises.push(analysisPromise);
+                        }
                     }
-                }
-                yield Promise.all(promises);
-                this.perfRecorder.stop(analyzeSpan);
-                this.resolveCompilation(this.compilation.traitCompiler);
+                    yield Promise.all(promises);
+                    this.perfRecorder.memory(PerfCheckpoint.Analysis);
+                    this.resolveCompilation(this.compilation.traitCompiler);
+                }));
             });
         }
         /**
@@ -39459,9 +40079,7 @@ Either add the @Injectable() decorator to '${provider.node.name
          */
         listLazyRoutes(entryRoute) {
             if (entryRoute) {
-                // Note:
-                // This resolution step is here to match the implementation of the old `AotCompilerHost` (see
-                // https://github.com/angular/angular/blob/50732e156/packages/compiler-cli/src/transformers/compiler_host.ts#L175-L188).
+                // htts://github.com/angular/angular/blob/50732e156/packages/compiler-cli/src/transformers/compiler_host.ts#L175-L188).
                 //
                 // `@angular/cli` will always call this API with an absolute path, so the resolution step is
                 // not necessary, but keeping it backwards compatible in case someone else is using the API.
@@ -39503,7 +40121,7 @@ Either add the @Injectable() decorator to '${provider.node.name
                 importRewriter = new NoopImportRewriter();
             }
             const before = [
-                ivyTransformFactory(compilation.traitCompiler, compilation.reflector, importRewriter, compilation.defaultImportTracker, compilation.isCore, this.closureCompilerEnabled),
+                ivyTransformFactory(compilation.traitCompiler, compilation.reflector, importRewriter, compilation.defaultImportTracker, this.delegatingPerfRecorder, compilation.isCore, this.closureCompilerEnabled),
                 aliasTransformFactory(compilation.traitCompiler.exportStatements),
                 compilation.defaultImportTracker.importPreservingTransformer(),
             ];
@@ -39539,25 +40157,27 @@ Either add the @Injectable() decorator to '${provider.node.name
             return this.compilation;
         }
         analyzeSync() {
-            const analyzeSpan = this.perfRecorder.start('analyze');
-            this.compilation = this.makeCompilation();
-            for (const sf of this.tsProgram.getSourceFiles()) {
-                if (sf.isDeclarationFile) {
-                    continue;
+            this.perfRecorder.inPhase(PerfPhase.Analysis, () => {
+                this.compilation = this.makeCompilation();
+                for (const sf of this.tsProgram.getSourceFiles()) {
+                    if (sf.isDeclarationFile) {
+                        continue;
+                    }
+                    this.compilation.traitCompiler.analyzeSync(sf);
+                    this.scanForMwp(sf);
                 }
-                const analyzeFileSpan = this.perfRecorder.start('analyzeFile', sf);
-                this.compilation.traitCompiler.analyzeSync(sf);
-                this.scanForMwp(sf);
-                this.perfRecorder.stop(analyzeFileSpan);
-            }
-            this.perfRecorder.stop(analyzeSpan);
-            this.resolveCompilation(this.compilation.traitCompiler);
+                this.perfRecorder.memory(PerfCheckpoint.Analysis);
+                this.resolveCompilation(this.compilation.traitCompiler);
+            });
         }
         resolveCompilation(traitCompiler) {
-            traitCompiler.resolve();
-            // At this point, analysis is complete and the compiler can now calculate which files need to
-            // be emitted, so do that.
-            this.incrementalDriver.recordSuccessfulAnalysis(traitCompiler);
+            this.perfRecorder.inPhase(PerfPhase.Resolve, () => {
+                traitCompiler.resolve();
+                // At this point, analysis is complete and the compiler can now calculate which files need to
+                // be emitted, so do that.
+                this.incrementalDriver.recordSuccessfulAnalysis(traitCompiler);
+                this.perfRecorder.memory(PerfCheckpoint.Resolve);
+            });
         }
         get fullTemplateTypeCheck() {
             // Determine the strictness level of type checking based on compiler options. As
@@ -39573,6 +40193,7 @@ Either add the @Injectable() decorator to '${provider.node.name
             // Also see `verifyCompatibleTypeCheckOptions` where it is verified that `fullTemplateTypeCheck`
             // is not disabled when `strictTemplates` is enabled.
             const strictTemplates = !!this.options.strictTemplates;
+            const useInlineTypeConstructors = this.typeCheckingProgramStrategy.supportsInlineOperations;
             // First select a type-checking configuration, based on whether full template type-checking is
             // requested.
             let typeCheckingConfig;
@@ -39604,6 +40225,11 @@ Either add the @Injectable() decorator to '${provider.node.name
                     useContextGenericType: strictTemplates,
                     strictLiteralTypes: true,
                     enableTemplateTypeChecker: this.enableTemplateTypeChecker,
+                    useInlineTypeConstructors,
+                    // Warnings for suboptimal type inference are only enabled if in Language Service mode
+                    // (providing the full TemplateTypeChecker API) and if strict mode is not enabled. In strict
+                    // mode, the user is in full control of type inference.
+                    suggestionsForSuboptimalTypeInference: this.enableTemplateTypeChecker && !strictTemplates,
                 };
             }
             else {
@@ -39629,6 +40255,10 @@ Either add the @Injectable() decorator to '${provider.node.name
                     useContextGenericType: false,
                     strictLiteralTypes: false,
                     enableTemplateTypeChecker: this.enableTemplateTypeChecker,
+                    useInlineTypeConstructors,
+                    // In "basic" template type-checking mode, no warnings are produced since most things are
+                    // not checked anyways.
+                    suggestionsForSuboptimalTypeInference: false,
                 };
             }
             // Apply explicitly configured strictness flags on top of the default configuration
@@ -39671,7 +40301,6 @@ Either add the @Injectable() decorator to '${provider.node.name
         getTemplateDiagnostics() {
             const compilation = this.ensureAnalyzed();
             // Get the diagnostics.
-            const typeCheckSpan = this.perfRecorder.start('typeCheckDiagnostics');
             const diagnostics = [];
             for (const sf of this.tsProgram.getSourceFiles()) {
                 if (sf.isDeclarationFile || this.adapter.isShim(sf)) {
@@ -39680,7 +40309,6 @@ Either add the @Injectable() decorator to '${provider.node.name
                 diagnostics.push(...compilation.templateTypeChecker.getDiagnosticsForFile(sf, OptimizeFor.WholeProgram));
             }
             const program = this.typeCheckingProgramStrategy.getProgram();
-            this.perfRecorder.stop(typeCheckSpan);
             this.incrementalStrategy.setIncrementalDriver(this.incrementalDriver, program);
             this.nextProgram = program;
             return diagnostics;
@@ -39688,13 +40316,11 @@ Either add the @Injectable() decorator to '${provider.node.name
         getTemplateDiagnosticsForFile(sf, optimizeFor) {
             const compilation = this.ensureAnalyzed();
             // Get the diagnostics.
-            const typeCheckSpan = this.perfRecorder.start('typeCheckDiagnostics');
             const diagnostics = [];
             if (!sf.isDeclarationFile && !this.adapter.isShim(sf)) {
                 diagnostics.push(...compilation.templateTypeChecker.getDiagnosticsForFile(sf, optimizeFor));
             }
             const program = this.typeCheckingProgramStrategy.getProgram();
-            this.perfRecorder.stop(typeCheckSpan);
             this.incrementalStrategy.setIncrementalDriver(this.incrementalDriver, program);
             this.nextProgram = program;
             return diagnostics;
@@ -39813,20 +40439,20 @@ Either add the @Injectable() decorator to '${provider.node.name
                 1 /* Error */;
             // Set up the IvyCompilation, which manages state for the Ivy transformer.
             const handlers = [
-                new ComponentDecoratorHandler(reflector, evaluator, metaRegistry, metaReader, scopeReader, scopeRegistry, typeCheckScopeRegistry, resourceRegistry, isCore, this.resourceManager, this.adapter.rootDirs, this.options.preserveWhitespaces || false, this.options.i18nUseExternalIds !== false, this.options.enableI18nLegacyMessageIdFormat !== false, this.usePoisonedData, this.options.i18nNormalizeLineEndingsInICUs, this.moduleResolver, this.cycleAnalyzer, cycleHandlingStrategy, refEmitter, defaultImportTracker, this.incrementalDriver.depGraph, injectableRegistry, semanticDepGraphUpdater, this.closureCompilerEnabled),
+                new ComponentDecoratorHandler(reflector, evaluator, metaRegistry, metaReader, scopeReader, scopeRegistry, typeCheckScopeRegistry, resourceRegistry, isCore, this.resourceManager, this.adapter.rootDirs, this.options.preserveWhitespaces || false, this.options.i18nUseExternalIds !== false, this.options.enableI18nLegacyMessageIdFormat !== false, this.usePoisonedData, this.options.i18nNormalizeLineEndingsInICUs, this.moduleResolver, this.cycleAnalyzer, cycleHandlingStrategy, refEmitter, defaultImportTracker, this.incrementalDriver.depGraph, injectableRegistry, semanticDepGraphUpdater, this.closureCompilerEnabled, this.delegatingPerfRecorder),
                 // TODO(alxhub): understand why the cast here is necessary (something to do with `null`
                 // not being assignable to `unknown` when wrapped in `Readonly`).
                 // clang-format off
-                new DirectiveDecoratorHandler(reflector, evaluator, metaRegistry, scopeRegistry, metaReader, defaultImportTracker, injectableRegistry, isCore, semanticDepGraphUpdater, this.closureCompilerEnabled, compileUndecoratedClassesWithAngularFeatures),
+                new DirectiveDecoratorHandler(reflector, evaluator, metaRegistry, scopeRegistry, metaReader, defaultImportTracker, injectableRegistry, isCore, semanticDepGraphUpdater, this.closureCompilerEnabled, compileUndecoratedClassesWithAngularFeatures, this.delegatingPerfRecorder),
                 // clang-format on
                 // Pipe handler must be before injectable handler in list so pipe factories are printed
                 // before injectable factories (so injectable factories can delegate to them)
-                new PipeDecoratorHandler(reflector, evaluator, metaRegistry, scopeRegistry, defaultImportTracker, injectableRegistry, isCore),
-                new InjectableDecoratorHandler(reflector, defaultImportTracker, isCore, this.options.strictInjectionParameters || false, injectableRegistry),
-                new NgModuleDecoratorHandler(reflector, evaluator, metaReader, metaRegistry, scopeRegistry, referencesRegistry, isCore, routeAnalyzer, refEmitter, this.adapter.factoryTracker, defaultImportTracker, this.closureCompilerEnabled, injectableRegistry, this.options.i18nInLocale),
+                new PipeDecoratorHandler(reflector, evaluator, metaRegistry, scopeRegistry, defaultImportTracker, injectableRegistry, isCore, this.delegatingPerfRecorder),
+                new InjectableDecoratorHandler(reflector, defaultImportTracker, isCore, this.options.strictInjectionParameters || false, injectableRegistry, this.delegatingPerfRecorder),
+                new NgModuleDecoratorHandler(reflector, evaluator, metaReader, metaRegistry, scopeRegistry, referencesRegistry, isCore, routeAnalyzer, refEmitter, this.adapter.factoryTracker, defaultImportTracker, this.closureCompilerEnabled, injectableRegistry, this.delegatingPerfRecorder, this.options.i18nInLocale),
             ];
-            const traitCompiler = new TraitCompiler(handlers, reflector, this.perfRecorder, this.incrementalDriver, this.options.compileNonExportedClasses !== false, compilationMode, dtsTransforms, semanticDepGraphUpdater);
-            const templateTypeChecker = new TemplateTypeCheckerImpl(this.tsProgram, this.typeCheckingProgramStrategy, traitCompiler, this.getTypeCheckingConfig(), refEmitter, reflector, this.adapter, this.incrementalDriver, scopeRegistry, typeCheckScopeRegistry);
+            const traitCompiler = new TraitCompiler(handlers, reflector, this.delegatingPerfRecorder, this.incrementalDriver, this.options.compileNonExportedClasses !== false, compilationMode, dtsTransforms, semanticDepGraphUpdater);
+            const templateTypeChecker = new TemplateTypeCheckerImpl(this.tsProgram, this.typeCheckingProgramStrategy, traitCompiler, this.getTypeCheckingConfig(), refEmitter, reflector, this.adapter, this.incrementalDriver, scopeRegistry, typeCheckScopeRegistry, this.delegatingPerfRecorder);
             return {
                 isCore,
                 traitCompiler,
@@ -40019,24 +40645,30 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
         };
     }
     function getExtendedConfigPath(configFile, extendsValue, host, fs) {
-        let extendedConfigPath = null;
+        const result = getExtendedConfigPathWorker(configFile, extendsValue, host, fs);
+        if (result !== null) {
+            return result;
+        }
+        // Try to resolve the paths with a json extension append a json extension to the file in case if
+        // it is missing and the resolution failed. This is to replicate TypeScript behaviour, see:
+        // https://github.com/microsoft/TypeScript/blob/294a5a7d784a5a95a8048ee990400979a6bc3a1c/src/compiler/commandLineParser.ts#L2806
+        return getExtendedConfigPathWorker(configFile, `${extendsValue}.json`, host, fs);
+    }
+    function getExtendedConfigPathWorker(configFile, extendsValue, host, fs) {
         if (extendsValue.startsWith('.') || fs.isRooted(extendsValue)) {
-            extendedConfigPath = host.resolve(host.dirname(configFile), extendsValue);
-            extendedConfigPath = host.extname(extendedConfigPath) ?
-                extendedConfigPath :
-                absoluteFrom(`${extendedConfigPath}.json`);
+            const extendedConfigPath = host.resolve(host.dirname(configFile), extendsValue);
+            if (host.exists(extendedConfigPath)) {
+                return extendedConfigPath;
+            }
         }
         else {
             const parseConfigHost = createParseConfigHost(host, fs);
             // Path isn't a rooted or relative path, resolve like a module.
             const { resolvedModule, } = ts$1.nodeModuleNameResolver(extendsValue, configFile, { moduleResolution: ts$1.ModuleResolutionKind.NodeJs, resolveJsonModule: true }, parseConfigHost);
             if (resolvedModule) {
-                extendedConfigPath = absoluteFrom(resolvedModule.resolvedFileName);
+                return absoluteFrom(resolvedModule.resolvedFileName);
             }
         }
-        if (extendedConfigPath !== null && host.exists(extendedConfigPath)) {
-            return extendedConfigPath;
-        }
         return null;
     }
 
@@ -40745,14 +41377,20 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
                     const ticket = resourceChangeTicket(this.compiler, modifiedResourceFiles);
                     this.compiler = NgCompiler.fromTicket(ticket, this.adapter);
                 }
+                else {
+                    // The previous NgCompiler is being reused, but we still want to reset its performance
+                    // tracker to capture only the operations that are needed to service the current request.
+                    this.compiler.perfRecorder.reset();
+                }
                 return this.compiler;
             }
             let ticket;
             if (this.compiler === null || this.lastKnownProgram === null) {
-                ticket = freshCompilationTicket(program, this.options, this.incrementalStrategy, this.programStrategy, true, true);
+                ticket = freshCompilationTicket(program, this.options, this.incrementalStrategy, this.programStrategy, 
+                /* perfRecorder */ null, true, true);
             }
             else {
-                ticket = incrementalFromCompilerTicket(this.compiler, program, this.incrementalStrategy, this.programStrategy, modifiedResourceFiles);
+                ticket = incrementalFromCompilerTicket(this.compiler, program, this.incrementalStrategy, this.programStrategy, modifiedResourceFiles, /* perfRecorder */ null);
             }
             this.compiler = NgCompiler.fromTicket(ticket, this.adapter);
             this.lastKnownProgram = program;
@@ -42556,43 +43194,50 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
             this.ttc = this.compiler.getTemplateTypeChecker();
         }
         getRenameInfo(filePath, position) {
-            const templateInfo = getTemplateInfoAtPosition(filePath, position, this.compiler);
-            // We could not get a template at position so we assume the request came from outside the
-            // template.
-            if (templateInfo === undefined) {
-                return this.tsLS.getRenameInfo(filePath, position);
-            }
-            const allTargetDetails = this.getTargetDetailsAtTemplatePosition(templateInfo, position);
-            if (allTargetDetails === null) {
-                return { canRename: false, localizedErrorMessage: 'Could not find template node at position.' };
-            }
-            const { templateTarget } = allTargetDetails[0];
-            const templateTextAndSpan = getRenameTextAndSpanAtPosition(templateTarget, position);
-            if (templateTextAndSpan === null) {
-                return { canRename: false, localizedErrorMessage: 'Could not determine template node text.' };
-            }
-            const { text, span } = templateTextAndSpan;
-            return {
-                canRename: true,
-                displayName: text,
-                fullDisplayName: text,
-                triggerSpan: span,
-            };
+            return this.compiler.perfRecorder.inPhase(PerfPhase.LsReferencesAndRenames, () => {
+                const templateInfo = getTemplateInfoAtPosition(filePath, position, this.compiler);
+                // We could not get a template at position so we assume the request came from outside the
+                // template.
+                if (templateInfo === undefined) {
+                    return this.tsLS.getRenameInfo(filePath, position);
+                }
+                const allTargetDetails = this.getTargetDetailsAtTemplatePosition(templateInfo, position);
+                if (allTargetDetails === null) {
+                    return {
+                        canRename: false,
+                        localizedErrorMessage: 'Could not find template node at position.',
+                    };
+                }
+                const { templateTarget } = allTargetDetails[0];
+                const templateTextAndSpan = getRenameTextAndSpanAtPosition(templateTarget, position);
+                if (templateTextAndSpan === null) {
+                    return { canRename: false, localizedErrorMessage: 'Could not determine template node text.' };
+                }
+                const { text, span } = templateTextAndSpan;
+                return {
+                    canRename: true,
+                    displayName: text,
+                    fullDisplayName: text,
+                    triggerSpan: span,
+                };
+            });
         }
         findRenameLocations(filePath, position) {
             this.ttc.generateAllTypeCheckBlocks();
-            const templateInfo = getTemplateInfoAtPosition(filePath, position, this.compiler);
-            // We could not get a template at position so we assume the request came from outside the
-            // template.
-            if (templateInfo === undefined) {
-                const requestNode = this.getTsNodeAtPosition(filePath, position);
-                if (requestNode === null) {
-                    return undefined;
+            return this.compiler.perfRecorder.inPhase(PerfPhase.LsReferencesAndRenames, () => {
+                const templateInfo = getTemplateInfoAtPosition(filePath, position, this.compiler);
+                // We could not get a template at position so we assume the request came from outside the
+                // template.
+                if (templateInfo === undefined) {
+                    const requestNode = this.getTsNodeAtPosition(filePath, position);
+                    if (requestNode === null) {
+                        return undefined;
+                    }
+                    const requestOrigin = { kind: RequestKind.TypeScript, requestNode };
+                    return this.findRenameLocationsAtTypescriptPosition(filePath, position, requestOrigin);
                 }
-                const requestOrigin = { kind: RequestKind.TypeScript, requestNode };
-                return this.findRenameLocationsAtTypescriptPosition(filePath, position, requestOrigin);
-            }
-            return this.findRenameLocationsAtTemplatePosition(templateInfo, position);
+                return this.findRenameLocationsAtTemplatePosition(templateInfo, position);
+            });
         }
         findRenameLocationsAtTemplatePosition(templateInfo, position) {
             const allTargetDetails = this.getTargetDetailsAtTemplatePosition(templateInfo, position);
@@ -42627,52 +43272,56 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
             return (_a = findTightestNode(sf, position)) !== null && _a !== void 0 ? _a : null;
         }
         findRenameLocationsAtTypescriptPosition(filePath, position, requestOrigin) {
-            let originalNodeText;
-            if (requestOrigin.kind === RequestKind.TypeScript) {
-                originalNodeText = requestOrigin.requestNode.getText();
-            }
-            else {
-                const templateNodeText = getRenameTextAndSpanAtPosition(requestOrigin.requestNode, requestOrigin.position);
-                if (templateNodeText === null) {
-                    return undefined;
+            return this.compiler.perfRecorder.inPhase(PerfPhase.LsReferencesAndRenames, () => {
+                let originalNodeText;
+                if (requestOrigin.kind === RequestKind.TypeScript) {
+                    originalNodeText = requestOrigin.requestNode.getText();
                 }
-                originalNodeText = templateNodeText.text;
-            }
-            const locations = this.tsLS.findRenameLocations(filePath, position, /*findInStrings*/ false, /*findInComments*/ false);
-            if (locations === undefined) {
-                return undefined;
-            }
-            const entries = new Map();
-            for (const location of locations) {
-                // TODO(atscott): Determine if a file is a shim file in a more robust way and make the API
-                // available in an appropriate location.
-                if (this.ttc.isTrackedTypeCheckFile(absoluteFrom(location.fileName))) {
-                    const entry = this.convertToTemplateDocumentSpan(location, this.ttc, originalNodeText);
-                    // There is no template node whose text matches the original rename request. Bail on
-                    // renaming completely rather than providing incomplete results.
-                    if (entry === null) {
+                else {
+                    const templateNodeText = getRenameTextAndSpanAtPosition(requestOrigin.requestNode, requestOrigin.position);
+                    if (templateNodeText === null) {
                         return undefined;
                     }
-                    entries.set(createLocationKey(entry), entry);
+                    originalNodeText = templateNodeText.text;
                 }
-                else {
-                    // Ensure we only allow renaming a TS result with matching text
-                    const refNode = this.getTsNodeAtPosition(location.fileName, location.textSpan.start);
-                    if (refNode === null || refNode.getText() !== originalNodeText) {
-                        return undefined;
+                const locations = this.tsLS.findRenameLocations(filePath, position, /*findInStrings*/ false, /*findInComments*/ false);
+                if (locations === undefined) {
+                    return undefined;
+                }
+                const entries = new Map();
+                for (const location of locations) {
+                    // TODO(atscott): Determine if a file is a shim file in a more robust way and make the API
+                    // available in an appropriate location.
+                    if (this.ttc.isTrackedTypeCheckFile(absoluteFrom(location.fileName))) {
+                        const entry = this.convertToTemplateDocumentSpan(location, this.ttc, originalNodeText);
+                        // There is no template node whose text matches the original rename request. Bail on
+                        // renaming completely rather than providing incomplete results.
+                        if (entry === null) {
+                            return undefined;
+                        }
+                        entries.set(createLocationKey(entry), entry);
+                    }
+                    else {
+                        // Ensure we only allow renaming a TS result with matching text
+                        const refNode = this.getTsNodeAtPosition(location.fileName, location.textSpan.start);
+                        if (refNode === null || refNode.getText() !== originalNodeText) {
+                            return undefined;
+                        }
+                        entries.set(createLocationKey(location), location);
                     }
-                    entries.set(createLocationKey(location), location);
                 }
-            }
-            return Array.from(entries.values());
+                return Array.from(entries.values());
+            });
         }
         getReferencesAtPosition(filePath, position) {
             this.ttc.generateAllTypeCheckBlocks();
-            const templateInfo = getTemplateInfoAtPosition(filePath, position, this.compiler);
-            if (templateInfo === undefined) {
-                return this.getReferencesAtTypescriptPosition(filePath, position);
-            }
-            return this.getReferencesAtTemplatePosition(templateInfo, position);
+            return this.compiler.perfRecorder.inPhase(PerfPhase.LsReferencesAndRenames, () => {
+                const templateInfo = getTemplateInfoAtPosition(filePath, position, this.compiler);
+                if (templateInfo === undefined) {
+                    return this.getReferencesAtTypescriptPosition(filePath, position);
+                }
+                return this.getReferencesAtTemplatePosition(templateInfo, position);
+            });
         }
         getReferencesAtTemplatePosition(templateInfo, position) {
             const allTargetDetails = this.getTargetDetailsAtTemplatePosition(templateInfo, position);
@@ -42913,49 +43562,52 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
             return this.options;
         }
         getSemanticDiagnostics(fileName) {
-            const compiler = this.compilerFactory.getOrCreate();
-            const ttc = compiler.getTemplateTypeChecker();
-            const diagnostics = [];
-            if (isTypeScriptFile(fileName)) {
-                const program = compiler.getNextProgram();
-                const sourceFile = program.getSourceFile(fileName);
-                if (sourceFile) {
-                    const ngDiagnostics = compiler.getDiagnosticsForFile(sourceFile, OptimizeFor.SingleFile);
-                    // There are several kinds of diagnostics returned by `NgCompiler` for a source file:
-                    //
-                    // 1. Angular-related non-template diagnostics from decorated classes within that file.
-                    // 2. Template diagnostics for components with direct inline templates (a string literal).
-                    // 3. Template diagnostics for components with indirect inline templates (templates computed
-                    //    by expression).
-                    // 4. Template diagnostics for components with external templates.
-                    //
-                    // When showing diagnostics for a TS source file, we want to only include kinds 1 and 2 -
-                    // those diagnostics which are reported at a location within the TS file itself. Diagnostics
-                    // for external templates will be shown when editing that template file (the `else` block)
-                    // below.
-                    //
-                    // Currently, indirect inline template diagnostics (kind 3) are not shown at all by the
-                    // Language Service, because there is no sensible location in the user's code for them. Such
-                    // templates are an edge case, though, and should not be common.
-                    //
-                    // TODO(alxhub): figure out a good user experience for indirect template diagnostics and
-                    // show them from within the Language Service.
-                    diagnostics.push(...ngDiagnostics.filter(diag => diag.file !== undefined && diag.file.fileName === sourceFile.fileName));
+            return this.withCompilerAndPerfTracing(PerfPhase.LsDiagnostics, (compiler) => {
+                const ttc = compiler.getTemplateTypeChecker();
+                const diagnostics = [];
+                if (isTypeScriptFile(fileName)) {
+                    const program = compiler.getNextProgram();
+                    const sourceFile = program.getSourceFile(fileName);
+                    if (sourceFile) {
+                        const ngDiagnostics = compiler.getDiagnosticsForFile(sourceFile, OptimizeFor.SingleFile);
+                        // There are several kinds of diagnostics returned by `NgCompiler` for a source file:
+                        //
+                        // 1. Angular-related non-template diagnostics from decorated classes within that
+                        // file.
+                        // 2. Template diagnostics for components with direct inline templates (a string
+                        // literal).
+                        // 3. Template diagnostics for components with indirect inline templates (templates
+                        // computed
+                        //    by expression).
+                        // 4. Template diagnostics for components with external templates.
+                        //
+                        // When showing diagnostics for a TS source file, we want to only include kinds 1 and
+                        // 2 - those diagnostics which are reported at a location within the TS file itself.
+                        // Diagnostics for external templates will be shown when editing that template file
+                        // (the `else` block) below.
+                        //
+                        // Currently, indirect inline template diagnostics (kind 3) are not shown at all by
+                        // the Language Service, because there is no sensible location in the user's code for
+                        // them. Such templates are an edge case, though, and should not be common.
+                        //
+                        // TODO(alxhub): figure out a good user experience for indirect template diagnostics
+                        // and show them from within the Language Service.
+                        diagnostics.push(...ngDiagnostics.filter(diag => diag.file !== undefined && diag.file.fileName === sourceFile.fileName));
+                    }
                 }
-            }
-            else {
-                const components = compiler.getComponentsWithTemplateFile(fileName);
-                for (const component of components) {
-                    if (ts.isClassDeclaration(component)) {
-                        diagnostics.push(...ttc.getDiagnosticsForComponent(component));
+                else {
+                    const components = compiler.getComponentsWithTemplateFile(fileName);
+                    for (const component of components) {
+                        if (ts.isClassDeclaration(component)) {
+                            diagnostics.push(...ttc.getDiagnosticsForComponent(component));
+                        }
                     }
                 }
-            }
-            this.compilerFactory.registerLastKnownProgram();
-            return diagnostics;
+                return diagnostics;
+            });
         }
         getDefinitionAndBoundSpan(fileName, position) {
-            return this.withCompiler((compiler) => {
+            return this.withCompilerAndPerfTracing(PerfPhase.LsDefinition, (compiler) => {
                 if (!isInAngularContext(compiler.getNextProgram(), fileName, position)) {
                     return undefined;
                 }
@@ -42964,7 +43616,7 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
             });
         }
         getTypeDefinitionAtPosition(fileName, position) {
-            return this.withCompiler((compiler) => {
+            return this.withCompilerAndPerfTracing(PerfPhase.LsDefinition, (compiler) => {
                 if (!isTemplateContext(compiler.getNextProgram(), fileName, position)) {
                     return undefined;
                 }
@@ -42973,56 +43625,57 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
             });
         }
         getQuickInfoAtPosition(fileName, position) {
-            return this.withCompiler((compiler) => {
-                if (!isTemplateContext(compiler.getNextProgram(), fileName, position)) {
-                    return undefined;
-                }
-                const templateInfo = getTemplateInfoAtPosition(fileName, position, compiler);
-                if (templateInfo === undefined) {
-                    return undefined;
-                }
-                const positionDetails = getTargetAtPosition(templateInfo.template, position);
-                if (positionDetails === null) {
-                    return undefined;
-                }
-                // Because we can only show 1 quick info, just use the bound attribute if the target is a two
-                // way binding. We may consider concatenating additional display parts from the other target
-                // nodes or representing the two way binding in some other manner in the future.
-                const node = positionDetails.context.kind === TargetNodeKind.TwoWayBindingContext ?
-                    positionDetails.context.nodes[0] :
-                    positionDetails.context.node;
-                return new QuickInfoBuilder(this.tsLS, compiler, templateInfo.component, node).get();
+            return this.withCompilerAndPerfTracing(PerfPhase.LsQuickInfo, (compiler) => {
+                return this.getQuickInfoAtPositionImpl(fileName, position, compiler);
             });
         }
+        getQuickInfoAtPositionImpl(fileName, position, compiler) {
+            if (!isTemplateContext(compiler.getNextProgram(), fileName, position)) {
+                return undefined;
+            }
+            const templateInfo = getTemplateInfoAtPosition(fileName, position, compiler);
+            if (templateInfo === undefined) {
+                return undefined;
+            }
+            const positionDetails = getTargetAtPosition(templateInfo.template, position);
+            if (positionDetails === null) {
+                return undefined;
+            }
+            // Because we can only show 1 quick info, just use the bound attribute if the target is a two
+            // way binding. We may consider concatenating additional display parts from the other target
+            // nodes or representing the two way binding in some other manner in the future.
+            const node = positionDetails.context.kind === TargetNodeKind.TwoWayBindingContext ?
+                positionDetails.context.nodes[0] :
+                positionDetails.context.node;
+            return new QuickInfoBuilder(this.tsLS, compiler, templateInfo.component, node).get();
+        }
         getReferencesAtPosition(fileName, position) {
-            const compiler = this.compilerFactory.getOrCreate();
-            const results = new ReferencesAndRenameBuilder(this.strategy, this.tsLS, compiler)
-                .getReferencesAtPosition(fileName, position);
-            this.compilerFactory.registerLastKnownProgram();
-            return results;
+            return this.withCompilerAndPerfTracing(PerfPhase.LsReferencesAndRenames, (compiler) => {
+                return new ReferencesAndRenameBuilder(this.strategy, this.tsLS, compiler)
+                    .getReferencesAtPosition(fileName, position);
+            });
         }
         getRenameInfo(fileName, position) {
-            var _a, _b, _c;
-            const compiler = this.compilerFactory.getOrCreate();
-            const renameInfo = new ReferencesAndRenameBuilder(this.strategy, this.tsLS, compiler)
-                .getRenameInfo(absoluteFrom(fileName), position);
-            if (!renameInfo.canRename) {
-                return renameInfo;
-            }
-            const quickInfo = (_a = this.getQuickInfoAtPosition(fileName, position)) !== null && _a !== void 0 ? _a : this.tsLS.getQuickInfoAtPosition(fileName, position);
-            const kind = (_b = quickInfo === null || quickInfo === void 0 ? void 0 : quickInfo.kind) !== null && _b !== void 0 ? _b : ts.ScriptElementKind.unknown;
-            const kindModifiers = (_c = quickInfo === null || quickInfo === void 0 ? void 0 : quickInfo.kindModifiers) !== null && _c !== void 0 ? _c : ts.ScriptElementKind.unknown;
-            return Object.assign(Object.assign({}, renameInfo), { kind, kindModifiers });
+            return this.withCompilerAndPerfTracing(PerfPhase.LsReferencesAndRenames, (compiler) => {
+                var _a, _b, _c;
+                const renameInfo = new ReferencesAndRenameBuilder(this.strategy, this.tsLS, compiler)
+                    .getRenameInfo(absoluteFrom(fileName), position);
+                if (!renameInfo.canRename) {
+                    return renameInfo;
+                }
+                const quickInfo = (_a = this.getQuickInfoAtPositionImpl(fileName, position, compiler)) !== null && _a !== void 0 ? _a : this.tsLS.getQuickInfoAtPosition(fileName, position);
+                const kind = (_b = quickInfo === null || quickInfo === void 0 ? void 0 : quickInfo.kind) !== null && _b !== void 0 ? _b : ts.ScriptElementKind.unknown;
+                const kindModifiers = (_c = quickInfo === null || quickInfo === void 0 ? void 0 : quickInfo.kindModifiers) !== null && _c !== void 0 ? _c : ts.ScriptElementKind.unknown;
+                return Object.assign(Object.assign({}, renameInfo), { kind, kindModifiers });
+            });
         }
         findRenameLocations(fileName, position) {
-            const compiler = this.compilerFactory.getOrCreate();
-            const results = new ReferencesAndRenameBuilder(this.strategy, this.tsLS, compiler)
-                .findRenameLocations(fileName, position);
-            this.compilerFactory.registerLastKnownProgram();
-            return results;
+            return this.withCompilerAndPerfTracing(PerfPhase.LsReferencesAndRenames, (compiler) => {
+                return new ReferencesAndRenameBuilder(this.strategy, this.tsLS, compiler)
+                    .findRenameLocations(fileName, position);
+            });
         }
-        getCompletionBuilder(fileName, position) {
-            const compiler = this.compilerFactory.getOrCreate();
+        getCompletionBuilder(fileName, position, compiler) {
             const templateInfo = getTemplateInfoAtPosition(fileName, position, compiler);
             if (templateInfo === undefined) {
                 return null;
@@ -43039,23 +43692,26 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
             return new CompletionBuilder(this.tsLS, compiler, templateInfo.component, node, positionDetails, isTypeScriptFile(fileName));
         }
         getCompletionsAtPosition(fileName, position, options) {
-            return this.withCompiler((compiler) => {
-                if (!isTemplateContext(compiler.getNextProgram(), fileName, position)) {
-                    return undefined;
-                }
-                const builder = this.getCompletionBuilder(fileName, position);
-                if (builder === null) {
-                    return undefined;
-                }
-                return builder.getCompletionsAtPosition(options);
+            return this.withCompilerAndPerfTracing(PerfPhase.LsCompletions, (compiler) => {
+                return this.getCompletionsAtPositionImpl(fileName, position, options, compiler);
             });
         }
+        getCompletionsAtPositionImpl(fileName, position, options, compiler) {
+            if (!isTemplateContext(compiler.getNextProgram(), fileName, position)) {
+                return undefined;
+            }
+            const builder = this.getCompletionBuilder(fileName, position, compiler);
+            if (builder === null) {
+                return undefined;
+            }
+            return builder.getCompletionsAtPosition(options);
+        }
         getCompletionEntryDetails(fileName, position, entryName, formatOptions, preferences) {
-            return this.withCompiler((compiler) => {
+            return this.withCompilerAndPerfTracing(PerfPhase.LsCompletions, (compiler) => {
                 if (!isTemplateContext(compiler.getNextProgram(), fileName, position)) {
                     return undefined;
                 }
-                const builder = this.getCompletionBuilder(fileName, position);
+                const builder = this.getCompletionBuilder(fileName, position, compiler);
                 if (builder === null) {
                     return undefined;
                 }
@@ -43063,11 +43719,11 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
             });
         }
         getCompletionEntrySymbol(fileName, position, entryName) {
-            return this.withCompiler((compiler) => {
+            return this.withCompilerAndPerfTracing(PerfPhase.LsCompletions, (compiler) => {
                 if (!isTemplateContext(compiler.getNextProgram(), fileName, position)) {
                     return undefined;
                 }
-                const builder = this.getCompletionBuilder(fileName, position);
+                const builder = this.getCompletionBuilder(fileName, position, compiler);
                 if (builder === null) {
                     return undefined;
                 }
@@ -43077,7 +43733,7 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
             });
         }
         getTcb(fileName, position) {
-            return this.withCompiler(compiler => {
+            return this.withCompilerAndPerfTracing(PerfPhase.LsTcb, compiler => {
                 const templateInfo = getTemplateInfoAtPosition(fileName, position, compiler);
                 if (templateInfo === undefined) {
                     return undefined;
@@ -43117,10 +43773,31 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
                 };
             });
         }
-        withCompiler(p) {
+        /**
+         * Provides an instance of the `NgCompiler` and traces perf results. Perf results are logged only
+         * if the log level is verbose or higher. This method is intended to be called once per public
+         * method call.
+         *
+         * Here is an example of the log output.
+         *
+         * Perf 245  [16:16:39.353] LanguageService#getQuickInfoAtPosition(): {"events":{},"phases":{
+         * "Unaccounted":379,"TtcSymbol":4},"memory":{}}
+         *
+         * Passing name of caller instead of using `arguments.caller` because 'caller', 'callee', and
+         * 'arguments' properties may not be accessed in strict mode.
+         *
+         * @param phase the `PerfPhase` to execute the `p` callback in
+         * @param p callback to be run synchronously with an instance of the `NgCompiler` as argument
+         * @return the result of running the `p` callback
+         */
+        withCompilerAndPerfTracing(phase, p) {
             const compiler = this.compilerFactory.getOrCreate();
-            const result = p(compiler);
+            const result = compiler.perfRecorder.inPhase(phase, () => p(compiler));
             this.compilerFactory.registerLastKnownProgram();
+            const logger = this.project.projectService.logger;
+            if (logger.hasLevel(ts.server.LogLevel.verbose)) {
+                logger.perftrc(`LanguageService#${PerfPhase[phase]}: ${JSON.stringify(compiler.perfRecorder.finalize())}`);
+            }
             return result;
         }
         getCompilerOptionsDiagnostics() {
@@ -43128,22 +43805,23 @@ https://v9.angular.io/guide/template-typecheck#template-type-checking`,
             if (!(project instanceof ts.server.ConfiguredProject)) {
                 return [];
             }
-            const diagnostics = [];
-            const configSourceFile = ts.readJsonConfigFile(project.getConfigFilePath(), (path) => project.readFile(path));
-            if (!this.options.strictTemplates && !this.options.fullTemplateTypeCheck) {
-                diagnostics.push({
-                    messageText: 'Some language features are not available. ' +
-                        'To access all features, enable `strictTemplates` in `angularCompilerOptions`.',
-                    category: ts.DiagnosticCategory.Suggestion,
-                    code: ngErrorCode(ErrorCode.SUGGEST_STRICT_TEMPLATES),
-                    file: configSourceFile,
-                    start: undefined,
-                    length: undefined,
-                });
-            }
-            const compiler = this.compilerFactory.getOrCreate();
-            diagnostics.push(...compiler.getOptionDiagnostics());
-            return diagnostics;
+            return this.withCompilerAndPerfTracing(PerfPhase.LsDiagnostics, (compiler) => {
+                const diagnostics = [];
+                const configSourceFile = ts.readJsonConfigFile(project.getConfigFilePath(), (path) => project.readFile(path));
+                if (!this.options.strictTemplates && !this.options.fullTemplateTypeCheck) {
+                    diagnostics.push({
+                        messageText: 'Some language features are not available. ' +
+                            'To access all features, enable `strictTemplates` in `angularCompilerOptions`.',
+                        category: ts.DiagnosticCategory.Suggestion,
+                        code: ngErrorCode(ErrorCode.SUGGEST_STRICT_TEMPLATES),
+                        file: configSourceFile,
+                        start: undefined,
+                        length: undefined,
+                    });
+                }
+                diagnostics.push(...compiler.getOptionDiagnostics());
+                return diagnostics;
+            });
         }
         watchConfigFile(project) {
             // TODO: Check the case when the project is disposed. An InferredProject