lighthouse 9.6.8 → 10.0.0

package/core/computed/resource-summary.js

@@ -0,0 +1,118 @@
+/**
+ * @license Copyright 2019 The Lighthouse Authors. All Rights Reserved.
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import {EntityClassification} from './entity-classification.js';
+import {makeComputedArtifact} from './computed-artifact.js';
+import {NetworkRecords} from './network-records.js';
+import {NetworkRequest} from '../lib/network-request.js';
+import {Budget} from '../config/budget.js';
+import {Util} from '../../shared/util.js';
+
+/** @typedef {{count: number, resourceSize: number, transferSize: number}} ResourceEntry */
+
+class ResourceSummary {
+  /**
+   * @param {LH.Artifacts.NetworkRequest} record
+   * @return {LH.Budget.ResourceType}
+   */
+  static determineResourceType(record) {
+    if (!record.resourceType) return 'other';
+    /** @type {Partial<Record<LH.Crdp.Network.ResourceType, LH.Budget.ResourceType>>} */
+    const requestToResourceType = {
+      'Stylesheet': 'stylesheet',
+      'Image': 'image',
+      'Media': 'media',
+      'Font': 'font',
+      'Script': 'script',
+      'Document': 'document',
+    };
+    return requestToResourceType[record.resourceType] || 'other';
+  }
+
+  /**
+   * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords
+   * @param {LH.Artifacts.URL} URLArtifact
+   * @param {LH.Util.ImmutableObject<LH.Budget[]|null>} budgets
+   * @param {LH.Artifacts.EntityClassification} classifiedEntities
+   * @return {Record<LH.Budget.ResourceType, ResourceEntry>}
+   */
+  static summarize(networkRecords, URLArtifact, budgets, classifiedEntities) {
+    /** @type {Record<LH.Budget.ResourceType, ResourceEntry>} */
+    const resourceSummary = {
+      'stylesheet': {count: 0, resourceSize: 0, transferSize: 0},
+      'image': {count: 0, resourceSize: 0, transferSize: 0},
+      'media': {count: 0, resourceSize: 0, transferSize: 0},
+      'font': {count: 0, resourceSize: 0, transferSize: 0},
+      'script': {count: 0, resourceSize: 0, transferSize: 0},
+      'document': {count: 0, resourceSize: 0, transferSize: 0},
+      'other': {count: 0, resourceSize: 0, transferSize: 0},
+      'total': {count: 0, resourceSize: 0, transferSize: 0},
+      'third-party': {count: 0, resourceSize: 0, transferSize: 0},
+    };
+    const budget = Budget.getMatchingBudget(budgets, URLArtifact.mainDocumentUrl);
+    /** @type {ReadonlyArray<string>} */
+    let firstPartyHosts = [];
+    if (budget?.options?.firstPartyHostnames) {
+      firstPartyHosts = budget.options.firstPartyHostnames;
+    } else {
+      firstPartyHosts = classifiedEntities.firstParty?.domains.map(domain => `*.${domain}`) ||
+        [`*.${Util.getRootDomain(URLArtifact.finalDisplayedUrl)}`];
+    }
+
+    networkRecords.filter(record => {
+      // Ignore favicon.co
+      // Headless Chrome does not request /favicon.ico, so don't consider this request.
+      // Makes resource summary consistent across LR / other channels.
+      const type = this.determineResourceType(record);
+      if (type === 'other' && record.url.endsWith('/favicon.ico')) {
+        return false;
+      }
+      // Ignore non-network protocols
+      if (NetworkRequest.isNonNetworkRequest(record)) return false;
+      return true;
+    }).forEach((record) => {
+      const type = this.determineResourceType(record);
+      resourceSummary[type].count++;
+      resourceSummary[type].resourceSize += record.resourceSize;
+      resourceSummary[type].transferSize += record.transferSize;
+
+      resourceSummary.total.count++;
+      resourceSummary.total.resourceSize += record.resourceSize;
+      resourceSummary.total.transferSize += record.transferSize;
+
+      const isFirstParty = firstPartyHosts.some((hostExp) => {
+        const url = new URL(record.url);
+        if (hostExp.startsWith('*.')) {
+          return url.hostname.endsWith(hostExp.slice(2));
+        }
+        return url.hostname === hostExp;
+      });
+
+      if (!isFirstParty) {
+        resourceSummary['third-party'].count++;
+        resourceSummary['third-party'].resourceSize += record.resourceSize;
+        resourceSummary['third-party'].transferSize += record.transferSize;
+      }
+    });
+    return resourceSummary;
+  }
+
+  /**
+   * @param {{URL: LH.Artifacts['URL'], devtoolsLog: LH.DevtoolsLog, budgets: LH.Util.ImmutableObject<LH.Budget[]|null>}} data
+   * @param {LH.Artifacts.ComputedContext} context
+   * @return {Promise<Record<LH.Budget.ResourceType,ResourceEntry>>}
+   */
+  static async compute_(data, context) {
+    const networkRecords = await NetworkRecords.request(data.devtoolsLog, context);
+    const classifiedEntities = await EntityClassification.request(
+      {URL: data.URL, devtoolsLog: data.devtoolsLog}, context);
+    return ResourceSummary.summarize(networkRecords, data.URL, data.budgets, classifiedEntities);
+  }
+}
+
+const ResourceSummaryComputed =
+  makeComputedArtifact(ResourceSummary, ['URL', 'devtoolsLog', 'budgets']);
+export {ResourceSummaryComputed as ResourceSummary};

package/core/computed/screenshots.d.ts

@@ -0,0 +1,20 @@
+export { ScreenshotsComputed as Screenshots };
+declare const ScreenshotsComputed: typeof Screenshots & {
+    request: (dependencies: import("../index.js").Trace, context: import("../../types/utility-types.js").default.ImmutableObject<{
+        computedCache: Map<string, import("../lib/arbitrary-equality-map.js").ArbitraryEqualityMap>;
+    }>) => Promise<{
+        timestamp: number;
+        datauri: string;
+    }[]>;
+};
+declare class Screenshots {
+    /**
+     * @param {LH.Trace} trace
+     * @return {Promise<Array<{timestamp: number, datauri: string}>>}
+    */
+    static compute_(trace: LH.Trace): Promise<Array<{
+        timestamp: number;
+        datauri: string;
+    }>>;
+}
+//# sourceMappingURL=screenshots.d.ts.map

package/core/computed/screenshots.js

@@ -0,0 +1,29 @@
+/**
+ * @license Copyright 2016 The Lighthouse Authors. All Rights Reserved.
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import {makeComputedArtifact} from './computed-artifact.js';
+
+const SCREENSHOT_TRACE_NAME = 'Screenshot';
+
+class Screenshots {
+  /**
+   * @param {LH.Trace} trace
+   * @return {Promise<Array<{timestamp: number, datauri: string}>>}
+  */
+  static async compute_(trace) {
+    return trace.traceEvents
+      .filter(evt => evt.name === SCREENSHOT_TRACE_NAME)
+      .map(evt => {
+        return {
+          timestamp: evt.ts,
+          datauri: `data:image/jpeg;base64,${evt.args.snapshot}`,
+        };
+      });
+  }
+}
+
+const ScreenshotsComputed = makeComputedArtifact(Screenshots, null);
+export {ScreenshotsComputed as Screenshots};

package/core/computed/speedline.d.ts

@@ -0,0 +1,15 @@
+export { SpeedlineComputed as Speedline };
+declare const SpeedlineComputed: typeof Speedline & {
+    request: (dependencies: import("../index.js").Trace, context: import("../../types/utility-types.js").default.ImmutableObject<{
+        computedCache: Map<string, import("../lib/arbitrary-equality-map.js").ArbitraryEqualityMap>;
+    }>) => Promise<import("../index.js").Artifacts.Speedline>;
+};
+declare class Speedline {
+    /**
+     * @param {LH.Trace} trace
+     * @param {LH.Artifacts.ComputedContext} context
+     * @return {Promise<LH.Artifacts.Speedline>}
+     */
+    static compute_(trace: LH.Trace, context: LH.Artifacts.ComputedContext): Promise<LH.Artifacts.Speedline>;
+}
+//# sourceMappingURL=speedline.d.ts.map

package/core/computed/speedline.js

@@ -0,0 +1,55 @@
+/**
+ * @license Copyright 2016 The Lighthouse Authors. All Rights Reserved.
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import speedline from 'speedline-core';
+
+import {makeComputedArtifact} from './computed-artifact.js';
+import {LighthouseError} from '../lib/lh-error.js';
+import {ProcessedTrace} from './processed-trace.js';
+
+class Speedline {
+  /**
+   * @param {LH.Trace} trace
+   * @param {LH.Artifacts.ComputedContext} context
+   * @return {Promise<LH.Artifacts.Speedline>}
+   */
+  static async compute_(trace, context) {
+    // speedline() may throw without a promise, so we resolve immediately
+    // to get in a promise chain.
+    return ProcessedTrace.request(trace, context).then(processedTrace => {
+      // Use a shallow copy of traceEvents so speedline can sort as it pleases.
+      // See https://github.com/GoogleChrome/lighthouse/issues/2333
+      const traceEvents = trace.traceEvents.slice();
+      // Force use of timeOrigin as reference point for speedline
+      // See https://github.com/GoogleChrome/lighthouse/issues/2095
+      const timeOrigin = processedTrace.timestamps.timeOrigin;
+      return speedline(traceEvents, {
+        timeOrigin,
+        fastMode: true,
+        include: 'speedIndex',
+      });
+    }).catch(err => {
+      if (/No screenshots found in trace/.test(err.message)) {
+        throw new LighthouseError(LighthouseError.errors.NO_SCREENSHOTS);
+      }
+
+      throw err;
+    }).then(speedline => {
+      if (speedline.frames.length === 0) {
+        throw new LighthouseError(LighthouseError.errors.NO_SPEEDLINE_FRAMES);
+      }
+
+      if (speedline.speedIndex === 0) {
+        throw new LighthouseError(LighthouseError.errors.SPEEDINDEX_OF_ZERO);
+      }
+
+      return speedline;
+    });
+  }
+}
+
+const SpeedlineComputed = makeComputedArtifact(Speedline, null);
+export {SpeedlineComputed as Speedline};

package/core/computed/unused-css.d.ts

@@ -0,0 +1,62 @@
+export { UnusedCSSComputed as UnusedCSS };
+export type StyleSheetInfo = LH.Artifacts.CSSStyleSheetInfo & {
+    networkRecord: LH.Artifacts.NetworkRequest;
+    usedRules: Array<LH.Crdp.CSS.RuleUsage>;
+};
+declare const UnusedCSSComputed: typeof UnusedCSS & {
+    request: (dependencies: {
+        CSSUsage: LH.Artifacts['CSSUsage'];
+        devtoolsLog: import("../index.js").DevtoolsLog;
+    }, context: import("../../types/utility-types.js").default.ImmutableObject<{
+        computedCache: Map<string, import("../lib/arbitrary-equality-map.js").ArbitraryEqualityMap>;
+    }>) => Promise<import("../../types/audit.js").default.ByteEfficiencyItem[]>;
+};
+/** @typedef {LH.Artifacts.CSSStyleSheetInfo & {networkRecord: LH.Artifacts.NetworkRequest, usedRules: Array<LH.Crdp.CSS.RuleUsage>}} StyleSheetInfo */
+declare class UnusedCSS {
+    /**
+     * @param {Array<LH.Artifacts.CSSStyleSheetInfo>} styles The output of the Styles gatherer.
+     * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords
+     * @return {Object<string, StyleSheetInfo>} A map of styleSheetId to stylesheet information.
+     */
+    static indexStylesheetsById(styles: Array<LH.Artifacts.CSSStyleSheetInfo>, networkRecords: Array<LH.Artifacts.NetworkRequest>): {
+        [x: string]: StyleSheetInfo;
+    };
+    /**
+     * Adds used rules to their corresponding stylesheet.
+     * @param {Array<LH.Crdp.CSS.RuleUsage>} rules The output of the CSSUsage gatherer.
+     * @param {Object<string, StyleSheetInfo>} indexedStylesheets Stylesheet information indexed by id.
+     */
+    static indexUsedRules(rules: Array<LH.Crdp.CSS.RuleUsage>, indexedStylesheets: {
+        [x: string]: StyleSheetInfo;
+    }): void;
+    /**
+     * @param {StyleSheetInfo} stylesheetInfo
+     * @return {{wastedBytes: number, totalBytes: number, wastedPercent: number}}
+     */
+    static computeUsage(stylesheetInfo: StyleSheetInfo): {
+        wastedBytes: number;
+        totalBytes: number;
+        wastedPercent: number;
+    };
+    /**
+     * Trims stylesheet content down to the first rule-set definition.
+     * @param {string=} content
+     * @return {string}
+     */
+    static determineContentPreview(content?: string | undefined): string;
+    /**
+     * @param {StyleSheetInfo} stylesheetInfo The stylesheetInfo object.
+     * @return {LH.Audit.ByteEfficiencyItem}
+     */
+    static mapSheetToResult(stylesheetInfo: StyleSheetInfo): LH.Audit.ByteEfficiencyItem;
+    /**
+     * @param {{CSSUsage: LH.Artifacts['CSSUsage'], devtoolsLog: LH.DevtoolsLog}} data
+     * @param {LH.Artifacts.ComputedContext} context
+     * @return {Promise<LH.Audit.ByteEfficiencyItem[]>}
+    */
+    static compute_(data: {
+        CSSUsage: LH.Artifacts['CSSUsage'];
+        devtoolsLog: import("../index.js").DevtoolsLog;
+    }, context: LH.Artifacts.ComputedContext): Promise<LH.Audit.ByteEfficiencyItem[]>;
+}
+//# sourceMappingURL=unused-css.d.ts.map

package/core/computed/unused-css.js

@@ -0,0 +1,153 @@
+/**
+ * @license Copyright 2019 The Lighthouse Authors. All Rights Reserved.
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import {makeComputedArtifact} from './computed-artifact.js';
+import {ByteEfficiencyAudit} from '../audits/byte-efficiency/byte-efficiency-audit.js';
+import {NetworkRecords} from './network-records.js';
+
+const PREVIEW_LENGTH = 100;
+
+/** @typedef {LH.Artifacts.CSSStyleSheetInfo & {networkRecord: LH.Artifacts.NetworkRequest, usedRules: Array<LH.Crdp.CSS.RuleUsage>}} StyleSheetInfo */
+
+class UnusedCSS {
+  /**
+   * @param {Array<LH.Artifacts.CSSStyleSheetInfo>} styles The output of the Styles gatherer.
+   * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords
+   * @return {Object<string, StyleSheetInfo>} A map of styleSheetId to stylesheet information.
+   */
+  static indexStylesheetsById(styles, networkRecords) {
+    const indexedNetworkRecords = networkRecords
+        // Some phantom network records appear with a 0 resourceSize that aren't real.
+        // A network record that has no size data is just as good as no network record at all for our
+        // purposes, so we'll just filter them out. https://github.com/GoogleChrome/lighthouse/issues/9684#issuecomment-532381611
+        .filter(record => record.resourceSize > 0)
+        .reduce((indexed, record) => {
+          indexed[record.url] = record;
+          return indexed;
+        }, /** @type {Object<string, LH.Artifacts.NetworkRequest>} */ ({}));
+
+    return styles.reduce((indexed, stylesheet) => {
+      indexed[stylesheet.header.styleSheetId] = Object.assign({
+        usedRules: [],
+        networkRecord: indexedNetworkRecords[stylesheet.header.sourceURL],
+      }, stylesheet);
+      return indexed;
+    }, /** @type {Object<string, StyleSheetInfo>} */ ({}));
+  }
+
+  /**
+   * Adds used rules to their corresponding stylesheet.
+   * @param {Array<LH.Crdp.CSS.RuleUsage>} rules The output of the CSSUsage gatherer.
+   * @param {Object<string, StyleSheetInfo>} indexedStylesheets Stylesheet information indexed by id.
+   */
+  static indexUsedRules(rules, indexedStylesheets) {
+    rules.forEach(rule => {
+      const stylesheetInfo = indexedStylesheets[rule.styleSheetId];
+
+      if (!stylesheetInfo) {
+        return;
+      }
+
+      if (rule.used) {
+        stylesheetInfo.usedRules.push(rule);
+      }
+    });
+  }
+
+  /**
+   * @param {StyleSheetInfo} stylesheetInfo
+   * @return {{wastedBytes: number, totalBytes: number, wastedPercent: number}}
+   */
+  static computeUsage(stylesheetInfo) {
+    let usedUncompressedBytes = 0;
+    const totalUncompressedBytes = stylesheetInfo.content.length;
+
+    for (const usedRule of stylesheetInfo.usedRules) {
+      usedUncompressedBytes += usedRule.endOffset - usedRule.startOffset;
+    }
+
+    const totalTransferredBytes = ByteEfficiencyAudit.estimateTransferSize(
+        stylesheetInfo.networkRecord, totalUncompressedBytes, 'Stylesheet');
+    const percentUnused = (totalUncompressedBytes - usedUncompressedBytes) / totalUncompressedBytes;
+    const wastedBytes = Math.round(percentUnused * totalTransferredBytes);
+
+    return {
+      wastedBytes,
+      wastedPercent: percentUnused * 100,
+      totalBytes: totalTransferredBytes,
+    };
+  }
+
+  /**
+   * Trims stylesheet content down to the first rule-set definition.
+   * @param {string=} content
+   * @return {string}
+   */
+  static determineContentPreview(content) {
+    let preview = (content || '')
+        .slice(0, PREVIEW_LENGTH * 5)
+        .replace(/( {2,}|\t)+/g, '  ') // remove leading indentation if present
+        .replace(/\n\s+}/g, '\n}') // completely remove indentation of closing braces
+        .trim(); // trim the leading whitespace
+
+    if (preview.length > PREVIEW_LENGTH) {
+      const firstRuleStart = preview.indexOf('{');
+      const firstRuleEnd = preview.indexOf('}');
+
+      if (firstRuleStart === -1 || firstRuleEnd === -1 ||
+          firstRuleStart > firstRuleEnd ||
+          firstRuleStart > PREVIEW_LENGTH) {
+        // We couldn't determine the first rule-set or it's not within the preview
+        preview = preview.slice(0, PREVIEW_LENGTH) + '...';
+      } else if (firstRuleEnd < PREVIEW_LENGTH) {
+        // The entire first rule-set fits within the preview
+        preview = preview.slice(0, firstRuleEnd + 1) + ' ...';
+      } else {
+        // The first rule-set doesn't fit within the preview, just show as many as we can
+        const lastSemicolonIndex = preview.slice(0, PREVIEW_LENGTH).lastIndexOf(';');
+        preview = lastSemicolonIndex < firstRuleStart ?
+            preview.slice(0, PREVIEW_LENGTH) + '... } ...' :
+            preview.slice(0, lastSemicolonIndex + 1) + ' ... } ...';
+      }
+    }
+
+    return preview;
+  }
+
+  /**
+   * @param {StyleSheetInfo} stylesheetInfo The stylesheetInfo object.
+   * @return {LH.Audit.ByteEfficiencyItem}
+   */
+  static mapSheetToResult(stylesheetInfo) {
+    let url = stylesheetInfo.header.sourceURL;
+    if (!url || stylesheetInfo.header.isInline) {
+      const contentPreview = UnusedCSS.determineContentPreview(stylesheetInfo.content);
+      url = contentPreview;
+    }
+
+    const usage = UnusedCSS.computeUsage(stylesheetInfo);
+    return {url, ...usage};
+  }
+
+  /**
+   * @param {{CSSUsage: LH.Artifacts['CSSUsage'], devtoolsLog: LH.DevtoolsLog}} data
+   * @param {LH.Artifacts.ComputedContext} context
+   * @return {Promise<LH.Audit.ByteEfficiencyItem[]>}
+  */
+  static async compute_(data, context) {
+    const {CSSUsage, devtoolsLog} = data;
+    const networkRecords = await NetworkRecords.request(devtoolsLog, context);
+    const indexedSheets = UnusedCSS.indexStylesheetsById(CSSUsage.stylesheets, networkRecords);
+    UnusedCSS.indexUsedRules(CSSUsage.rules, indexedSheets);
+
+    const items = Object.keys(indexedSheets)
+      .map(sheetId => UnusedCSS.mapSheetToResult(indexedSheets[sheetId]));
+    return items;
+  }
+}
+
+const UnusedCSSComputed = makeComputedArtifact(UnusedCSS, ['CSSUsage', 'devtoolsLog']);
+export {UnusedCSSComputed as UnusedCSS};

package/core/computed/unused-javascript-summary.d.ts

@@ -0,0 +1,71 @@
+export { UnusedJavascriptSummaryComputed as UnusedJavascriptSummary };
+export type WasteData = {
+    unusedByIndex: Uint8Array;
+    unusedLength: number;
+    contentLength: number;
+};
+export type ComputeInput = {
+    scriptId: string;
+    scriptCoverage: Omit<LH.Crdp.Profiler.ScriptCoverage, 'url'>;
+    bundle?: LH.Artifacts.Bundle | undefined;
+};
+export type Summary = {
+    scriptId: string;
+    wastedBytes: number;
+    totalBytes: number;
+    wastedPercent?: number | undefined;
+    /**
+     * Keyed by file name. Includes (unmapped) key too.
+     */
+    sourcesWastedBytes?: Record<string, number> | undefined;
+};
+declare const UnusedJavascriptSummaryComputed: typeof UnusedJavascriptSummary & {
+    request: (dependencies: ComputeInput, context: import("../../types/utility-types.js").default.ImmutableObject<{
+        computedCache: Map<string, import("../lib/arbitrary-equality-map.js").ArbitraryEqualityMap>;
+    }>) => Promise<Summary>;
+};
+/**
+ * @typedef WasteData
+ * @property {Uint8Array} unusedByIndex
+ * @property {number} unusedLength
+ * @property {number} contentLength
+ */
+/**
+ * @typedef ComputeInput
+ * @property {string} scriptId
+ * @property {Omit<LH.Crdp.Profiler.ScriptCoverage, 'url'>} scriptCoverage
+ * @property {LH.Artifacts.Bundle=} bundle
+ */
+/**
+ * @typedef Summary
+ * @property {string} scriptId
+ * @property {number} wastedBytes
+ * @property {number} totalBytes
+ * @property {number} wastedBytes
+ * @property {number=} wastedPercent
+ * @property {Record<string, number>=} sourcesWastedBytes Keyed by file name. Includes (unmapped) key too.
+ */
+declare class UnusedJavascriptSummary {
+    /**
+     * @param {Omit<LH.Crdp.Profiler.ScriptCoverage, 'url'>} scriptCoverage
+     * @return {WasteData}
+     */
+    static computeWaste(scriptCoverage: Omit<LH.Crdp.Profiler.ScriptCoverage, 'url'>): WasteData;
+    /**
+     * @param {string} scriptId
+     * @param {WasteData} wasteData
+     * @return {Summary}
+     */
+    static createItem(scriptId: string, wasteData: WasteData): Summary;
+    /**
+     * @param {WasteData} wasteData
+     * @param {LH.Artifacts.Bundle} bundle
+     */
+    static createSourceWastedBytes(wasteData: WasteData, bundle: LH.Artifacts.Bundle): Record<string, number> | undefined;
+    /**
+     * @param {ComputeInput} data
+     * @return {Promise<Summary>}
+     */
+    static compute_(data: ComputeInput): Promise<Summary>;
+}
+//# sourceMappingURL=unused-javascript-summary.d.ts.map

package/core/computed/unused-javascript-summary.js

@@ -0,0 +1,155 @@
+/**
+ * @license Copyright 2020 Google Inc. All Rights Reserved.
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import {makeComputedArtifact} from './computed-artifact.js';
+
+/**
+ * @typedef WasteData
+ * @property {Uint8Array} unusedByIndex
+ * @property {number} unusedLength
+ * @property {number} contentLength
+ */
+
+/**
+ * @typedef ComputeInput
+ * @property {string} scriptId
+ * @property {Omit<LH.Crdp.Profiler.ScriptCoverage, 'url'>} scriptCoverage
+ * @property {LH.Artifacts.Bundle=} bundle
+ */
+
+/**
+ * @typedef Summary
+ * @property {string} scriptId
+ * @property {number} wastedBytes
+ * @property {number} totalBytes
+ * @property {number} wastedBytes
+ * @property {number=} wastedPercent
+ * @property {Record<string, number>=} sourcesWastedBytes Keyed by file name. Includes (unmapped) key too.
+ */
+
+class UnusedJavascriptSummary {
+  /**
+   * @param {Omit<LH.Crdp.Profiler.ScriptCoverage, 'url'>} scriptCoverage
+   * @return {WasteData}
+   */
+  static computeWaste(scriptCoverage) {
+    let maximumEndOffset = 0;
+    for (const func of scriptCoverage.functions) {
+      maximumEndOffset = Math.max(maximumEndOffset, ...func.ranges.map(r => r.endOffset));
+    }
+
+    // We only care about unused ranges of the script, so we can ignore all the nesting and safely
+    // assume that if a range is unexecuted, all nested ranges within it will also be unexecuted.
+    const unusedByIndex = new Uint8Array(maximumEndOffset);
+    for (const func of scriptCoverage.functions) {
+      for (const range of func.ranges) {
+        if (range.count === 0) {
+          for (let i = range.startOffset; i < range.endOffset; i++) {
+            unusedByIndex[i] = 1;
+          }
+        }
+      }
+    }
+
+    let unused = 0;
+    for (const x of unusedByIndex) {
+      unused += x;
+    }
+
+    return {
+      unusedByIndex,
+      unusedLength: unused,
+      contentLength: maximumEndOffset,
+    };
+  }
+
+  /**
+   * @param {string} scriptId
+   * @param {WasteData} wasteData
+   * @return {Summary}
+   */
+  static createItem(scriptId, wasteData) {
+    const wastedRatio = (wasteData.unusedLength / wasteData.contentLength) || 0;
+    const wastedBytes = Math.round(wasteData.contentLength * wastedRatio);
+
+    return {
+      scriptId,
+      totalBytes: wasteData.contentLength,
+      wastedBytes,
+      wastedPercent: 100 * wastedRatio,
+    };
+  }
+
+  /**
+   * @param {WasteData} wasteData
+   * @param {LH.Artifacts.Bundle} bundle
+   */
+  static createSourceWastedBytes(wasteData, bundle) {
+    if (!bundle.script.content) return;
+
+    /** @type {Record<string, number>} */
+    const files = {};
+
+    const lineLengths = bundle.script.content.split('\n').map(l => l.length);
+    let totalSoFar = 0;
+    const lineOffsets = lineLengths.map(len => {
+      const retVal = totalSoFar;
+      totalSoFar += len + 1;
+      return retVal;
+    });
+
+    // @ts-expect-error: We will upstream computeLastGeneratedColumns to CDT eventually.
+    bundle.map.computeLastGeneratedColumns();
+    for (const mapping of bundle.map.mappings()) {
+      let offset = lineOffsets[mapping.lineNumber];
+
+      offset += mapping.columnNumber;
+      const lastColumnOfMapping = mapping.lastColumnNumber !== undefined ?
+        mapping.lastColumnNumber - 1 :
+        lineLengths[mapping.lineNumber];
+      for (let i = mapping.columnNumber; i <= lastColumnOfMapping; i++) {
+        if (wasteData.unusedByIndex[offset] === 1) {
+          const key = mapping.sourceURL || '(unmapped)';
+          files[key] = (files[key] || 0) + 1;
+        }
+        offset += 1;
+      }
+    }
+
+    const dataSorted = Object.entries(files)
+      .sort(([_, unusedBytes1], [__, unusedBytes2]) => unusedBytes2 - unusedBytes1);
+
+    /** @type {Record<string, number>} */
+    const bundleData = {};
+    for (const [key, unusedBytes] of dataSorted) {
+      bundleData[key] = unusedBytes;
+    }
+    return bundleData;
+  }
+
+  /**
+   * @param {ComputeInput} data
+   * @return {Promise<Summary>}
+   */
+  static async compute_(data) {
+    const {scriptId, scriptCoverage, bundle} = data;
+
+    const wasteData = UnusedJavascriptSummary.computeWaste(scriptCoverage);
+    const item = UnusedJavascriptSummary.createItem(scriptId, wasteData);
+    if (!bundle) return item;
+
+    return {
+      ...item,
+      sourcesWastedBytes: UnusedJavascriptSummary.createSourceWastedBytes(wasteData, bundle),
+    };
+  }
+}
+
+const UnusedJavascriptSummaryComputed = makeComputedArtifact(
+  UnusedJavascriptSummary,
+  ['bundle', 'scriptCoverage', 'scriptId']
+);
+export {UnusedJavascriptSummaryComputed as UnusedJavascriptSummary};