lighthouse 12.8.2 → 13.0.0-dev.20251009

package/core/audits/byte-efficiency/duplicated-javascript.js

@@ -1,223 +0,0 @@
-/**
- * @license
- * Copyright 2020 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * @fileoverview This audit highlights JavaScript modules that appear to be duplicated across
- * all resources, either within the same bundle or between different bundles.
- */
-
-/** @typedef {import('./byte-efficiency-audit.js').ByteEfficiencyProduct} ByteEfficiencyProduct */
-/** @typedef {LH.Audit.ByteEfficiencyItem & {source: string, subItems: {type: 'subitems', items: SubItem[]}}} Item */
-/** @typedef {{url: string, sourceTransferBytes?: number}} SubItem */
-
-import {ByteEfficiencyAudit} from './byte-efficiency-audit.js';
-import {ModuleDuplication} from '../../computed/module-duplication.js';
-import * as i18n from '../../lib/i18n/i18n.js';
-import {estimateCompressionRatioForContent} from '../../lib/script-helpers.js';
-
-const UIStrings = {
-  /** Imperative title of a Lighthouse audit that tells the user to remove duplicate JavaScript from their code. This is displayed in a list of audit titles that Lighthouse generates. */
-  title: 'Remove duplicate modules in JavaScript bundles',
-  /** Description of a Lighthouse audit that tells the user *why* they should remove duplicate JavaScript from their scripts. This is displayed after a user expands the section to see more. No word length limits. The last sentence starting with 'Learn' becomes link text to additional documentation. */
-  description: 'Remove large, duplicate JavaScript modules from bundles ' +
-    'to reduce unnecessary bytes consumed by network activity. ', // +
-  // TODO: we need docs.
-  // '[Learn more](https://developer.chrome.com/docs/lighthouse/performance/duplicated-javascript/).',
-};
-
-const str_ = i18n.createIcuMessageFn(import.meta.url, UIStrings);
-
-const IGNORE_THRESHOLD_IN_BYTES = 1024 * 10;
-
-/**
- * @param {string} haystack
- * @param {string} needle
- * @param {number} startPosition
- */
-function indexOfOrEnd(haystack, needle, startPosition = 0) {
-  const index = haystack.indexOf(needle, startPosition);
-  return index === -1 ? haystack.length : index;
-}
-
-class DuplicatedJavascript extends ByteEfficiencyAudit {
-  /**
-   * @return {LH.Audit.Meta}
-   */
-  static get meta() {
-    return {
-      id: 'duplicated-javascript',
-      title: str_(UIStrings.title),
-      description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
-      guidanceLevel: 2,
-      requiredArtifacts: ['DevtoolsLog', 'Trace', 'SourceMaps', 'Scripts',
-        'GatherContext', 'URL'],
-    };
-  }
-
-  /**
-   * @param {string} source
-   */
-  static _getNodeModuleName(source) {
-    const sourceSplit = source.split('node_modules/');
-    source = sourceSplit[sourceSplit.length - 1];
-
-    const indexFirstSlash = indexOfOrEnd(source, '/');
-    if (source[0] === '@') {
-      return source.slice(0, indexOfOrEnd(source, '/', indexFirstSlash + 1));
-    }
-
-    return source.slice(0, indexFirstSlash);
-  }
-
-  /**
-   * @param {LH.Artifacts} artifacts
-   * @param {LH.Audit.Context} context
-   */
-  static async _getDuplicationGroupedByNodeModules(artifacts, context) {
-    const duplication = await ModuleDuplication.request(artifacts, context);
-
-    /** @type {typeof duplication} */
-    const groupedDuplication = new Map();
-    for (const [source, sourceDatas] of duplication.entries()) {
-      if (!source.includes('node_modules')) {
-        groupedDuplication.set(source, sourceDatas);
-        continue;
-      }
-
-      const normalizedSource = 'node_modules/' + DuplicatedJavascript._getNodeModuleName(source);
-      const aggregatedSourceDatas = groupedDuplication.get(normalizedSource) || [];
-      for (const {scriptId, scriptUrl, resourceSize} of sourceDatas) {
-        let sourceData = aggregatedSourceDatas.find(d => d.scriptId === scriptId);
-        if (!sourceData) {
-          sourceData = {scriptId, scriptUrl, resourceSize: 0};
-          aggregatedSourceDatas.push(sourceData);
-        }
-        sourceData.resourceSize += resourceSize;
-      }
-      groupedDuplication.set(normalizedSource, aggregatedSourceDatas);
-    }
-
-    for (const sourceDatas of duplication.values()) {
-      sourceDatas.sort((a, b) => b.resourceSize - a.resourceSize);
-    }
-
-    return groupedDuplication;
-  }
-
-  /**
-   * Each details item returned is a module with subItems for each resource that
-   * includes it. The wastedBytes for the details item is the number of bytes
-   * occupied by the sum of all but the largest copy of the module. wastedBytesByUrl
-   * attributes the cost of the bytes to a specific resource, for use by lantern.
-   * @param {LH.Artifacts} artifacts
-   * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords
-   * @param {LH.Audit.Context} context
-   * @return {Promise<ByteEfficiencyProduct>}
-   */
-  static async audit_(artifacts, networkRecords, context) {
-    const ignoreThresholdInBytes =
-      context.options?.ignoreThresholdInBytes || IGNORE_THRESHOLD_IN_BYTES;
-    const duplication =
-      await DuplicatedJavascript._getDuplicationGroupedByNodeModules(artifacts, context);
-
-    /** @type {Map<string, number>} */
-    const compressionRatioByUrl = new Map();
-
-    /** @type {Item[]} */
-    const items = [];
-
-    let overflowWastedBytes = 0;
-    const overflowUrls = new Set();
-
-    /** @type {Map<string, number>} */
-    const wastedBytesByUrl = new Map();
-    for (const [source, sourceDatas] of duplication.entries()) {
-      // One copy of this module is treated as the canonical version - the rest will have
-      // non-zero `wastedBytes`. In the case of all copies being the same version, all sizes are
-      // equal and the selection doesn't matter (ignoring compression ratios). When the copies are
-      // different versions, it does matter. Ideally the newest version would be the canonical
-      // copy, but version information is not present. Instead, size is used as a heuristic for
-      // latest version. This makes the audit conserative in its estimation.
-
-      /** @type {SubItem[]} */
-      const subItems = [];
-
-      let wastedBytesTotal = 0;
-      for (let i = 0; i < sourceDatas.length; i++) {
-        const sourceData = sourceDatas[i];
-        const scriptId = sourceData.scriptId;
-        const script = artifacts.Scripts.find(script => script.scriptId === scriptId);
-        const url = script?.url || '';
-        const compressionRatio = estimateCompressionRatioForContent(
-          compressionRatioByUrl, url, artifacts, networkRecords);
-        const transferSize = Math.round(sourceData.resourceSize * compressionRatio);
-
-        subItems.push({
-          url,
-          sourceTransferBytes: transferSize,
-        });
-
-        if (i === 0) continue;
-        wastedBytesTotal += transferSize;
-        wastedBytesByUrl.set(url, (wastedBytesByUrl.get(url) || 0) + transferSize);
-      }
-
-      if (wastedBytesTotal <= ignoreThresholdInBytes) {
-        overflowWastedBytes += wastedBytesTotal;
-        for (const subItem of subItems) {
-          overflowUrls.add(subItem.url);
-        }
-        continue;
-      }
-
-      items.push({
-        source,
-        wastedBytes: wastedBytesTotal,
-        // Not needed, but keeps typescript happy.
-        url: '',
-        // Not needed, but keeps typescript happy.
-        totalBytes: 0,
-        subItems: {
-          type: 'subitems',
-          items: subItems,
-        },
-      });
-    }
-
-    if (overflowWastedBytes > ignoreThresholdInBytes) {
-      items.push({
-        source: 'Other',
-        wastedBytes: overflowWastedBytes,
-        url: '',
-        totalBytes: 0,
-        subItems: {
-          type: 'subitems',
-          items: Array.from(overflowUrls).map(url => ({url})),
-        },
-      });
-    }
-
-    /** @type {LH.Audit.Details.TableColumnHeading[]} */
-    const headings = [
-      /* eslint-disable max-len */
-      {key: 'source', valueType: 'code', subItemsHeading: {key: 'url', valueType: 'url'}, label: str_(i18n.UIStrings.columnSource)},
-      {key: null, valueType: 'bytes', subItemsHeading: {key: 'sourceTransferBytes'}, granularity: 10, label: str_(i18n.UIStrings.columnTransferSize)},
-      {key: 'wastedBytes', valueType: 'bytes', granularity: 10, label: str_(i18n.UIStrings.columnWastedBytes)},
-      /* eslint-enable max-len */
-    ];
-
-    // TODO: show warning somewhere if no source maps.
-    return {
-      items,
-      headings,
-      wastedBytesByUrl,
-    };
-  }
-}
-
-export default DuplicatedJavascript;
-export {UIStrings};

package/core/audits/byte-efficiency/efficient-animated-content.d.ts

@@ -1,22 +0,0 @@
-export default EfficientAnimatedContent;
-declare class EfficientAnimatedContent extends ByteEfficiencyAudit {
-    /**
-     * Calculate rough savings percentage based on 1000 real gifs transcoded to video
-     * @param {number} bytes
-     * @return {number} rough savings percentage
-     * @see https://github.com/GoogleChrome/lighthouse/issues/4696#issuecomment-380296510 bytes
-     */
-    static getPercentSavings(bytes: number): number;
-    /**
-     * @param {LH.Artifacts} artifacts
-     * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords
-     * @return {import('./byte-efficiency-audit.js').ByteEfficiencyProduct}
-     */
-    static audit_(artifacts: LH.Artifacts, networkRecords: Array<LH.Artifacts.NetworkRequest>): import("./byte-efficiency-audit.js").ByteEfficiencyProduct;
-}
-export namespace UIStrings {
-    let title: string;
-    let description: string;
-}
-import { ByteEfficiencyAudit } from './byte-efficiency-audit.js';
-//# sourceMappingURL=efficient-animated-content.d.ts.map

package/core/audits/byte-efficiency/efficient-animated-content.js

@@ -1,93 +0,0 @@
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-/*
- * @fileoverview Audit a page to ensure that videos are used instead of animated gifs
- */
-
-
-import {NetworkRequest} from '../../lib/network-request.js';
-import {ByteEfficiencyAudit} from './byte-efficiency-audit.js';
-import * as i18n from '../../lib/i18n/i18n.js';
-
-const UIStrings = {
-  /** Imperative title of a Lighthouse audit that tells the user to use video formats rather than animated GIFs, which are wasteful. This is displayed in a list of audit titles that Lighthouse generates. */
-  title: 'Use video formats for animated content',
-  /** Description of a Lighthouse audit that tells the user *why* they should use video instead of GIF format for delivering animated content. This is displayed after a user expands the section to see more. No character length limits. The last sentence starting with 'Learn' becomes link text to additional documentation. */
-  description: 'Large GIFs are inefficient for delivering animated content. Consider using ' +
-    'MPEG4/WebM videos for animations and PNG/WebP for static images instead of GIF to save ' +
-    'network bytes. [Learn more about efficient video formats](https://developer.chrome.com/docs/lighthouse/performance/efficient-animated-content/)',
-};
-
-const str_ = i18n.createIcuMessageFn(import.meta.url, UIStrings);
-
-// If GIFs are above this size, we'll flag them
-// See https://github.com/GoogleChrome/lighthouse/pull/4885#discussion_r178406623 and https://github.com/GoogleChrome/lighthouse/issues/4696#issuecomment-370979920
-const GIF_BYTE_THRESHOLD = 100 * 1024;
-
-class EfficientAnimatedContent extends ByteEfficiencyAudit {
-  /**
-   * @return {LH.Audit.Meta}
-   */
-  static get meta() {
-    return {
-      id: 'efficient-animated-content',
-      title: str_(UIStrings.title),
-      description: str_(UIStrings.description),
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
-      guidanceLevel: 3,
-      requiredArtifacts: ['DevtoolsLog', 'Trace', 'GatherContext', 'URL', 'SourceMaps'],
-    };
-  }
-
-  /**
-   * Calculate rough savings percentage based on 1000 real gifs transcoded to video
-   * @param {number} bytes
-   * @return {number} rough savings percentage
-   * @see https://github.com/GoogleChrome/lighthouse/issues/4696#issuecomment-380296510 bytes
-   */
-  static getPercentSavings(bytes) {
-    return Math.round((29.1 * Math.log10(bytes) - 100.7)) / 100;
-  }
-
-  /**
-   * @param {LH.Artifacts} artifacts
-   * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords
-   * @return {import('./byte-efficiency-audit.js').ByteEfficiencyProduct}
-   */
-  static audit_(artifacts, networkRecords) {
-    const unoptimizedContent = networkRecords.filter(
-      record => record.mimeType === 'image/gif' &&
-        record.resourceType === NetworkRequest.TYPES.Image &&
-        (record.resourceSize || 0) > GIF_BYTE_THRESHOLD
-    );
-
-    /** @type {Array<{url: string, totalBytes: number, wastedBytes: number}>}*/
-    const items = unoptimizedContent.map(record => {
-      const resourceSize = record.resourceSize || 0;
-      return {
-        url: record.url,
-        totalBytes: resourceSize,
-        wastedBytes: Math.round(resourceSize *
-          EfficientAnimatedContent.getPercentSavings(resourceSize)),
-      };
-    });
-
-    /** @type {LH.Audit.Details.Opportunity['headings']} */
-    const headings = [
-      {key: 'url', valueType: 'url', label: str_(i18n.UIStrings.columnURL)},
-      {key: 'totalBytes', valueType: 'bytes', label: str_(i18n.UIStrings.columnResourceSize)},
-      {key: 'wastedBytes', valueType: 'bytes', label: str_(i18n.UIStrings.columnWastedBytes)},
-    ];
-
-    return {
-      items,
-      headings,
-    };
-  }
-}
-
-export default EfficientAnimatedContent;
-export {UIStrings};

package/core/audits/byte-efficiency/legacy-javascript.d.ts

@@ -1,28 +0,0 @@
-export default LegacyJavascript;
-export type ByteEfficiencyProduct = import("./byte-efficiency-audit.js").ByteEfficiencyProduct;
-export type Item = LH.Audit.ByteEfficiencyItem & {
-    subItems: {
-        type: "subitems";
-        items: SubItem[];
-    };
-};
-export type SubItem = {
-    signal: string;
-    location: LH.Audit.Details.SourceLocationValue;
-};
-declare class LegacyJavascript extends ByteEfficiencyAudit {
-    /**
-     * @param {LH.Artifacts} artifacts
-     * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords
-     * @param {LH.Audit.Context} context
-     * @return {Promise<ByteEfficiencyProduct>}
-     */
-    static audit_(artifacts: LH.Artifacts, networkRecords: Array<LH.Artifacts.NetworkRequest>, context: LH.Audit.Context): Promise<ByteEfficiencyProduct>;
-}
-export namespace UIStrings {
-    let title: string;
-    let description: string;
-    let detectedCoreJs2Warning: string;
-}
-import { ByteEfficiencyAudit } from './byte-efficiency-audit.js';
-//# sourceMappingURL=legacy-javascript.d.ts.map

package/core/audits/byte-efficiency/legacy-javascript.js

@@ -1,144 +0,0 @@
-/**
- * @license
- * Copyright 2020 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * @fileoverview Identifies polyfills and transforms that should not be present if needing to support only Baseline browsers.
- * @see https://docs.google.com/document/d/1ItjJwAd6e0Ts6yMbvh8TN3BBh_sAd58rYE1whnpuxaA/edit Design document (old, based on module/nomodule pattern)
- * @see https://docs.google.com/spreadsheets/d/1z28Au8wo8-c2UsM2lDVEOJcI3jOkb2c951xEBqzBKCc/edit?usp=sharing Legacy babel transforms / polyfills
- * ./core/scripts/legacy-javascript - verification tool.
- */
-
-/** @typedef {import('./byte-efficiency-audit.js').ByteEfficiencyProduct} ByteEfficiencyProduct */
-/** @typedef {LH.Audit.ByteEfficiencyItem & {subItems: {type: 'subitems', items: SubItem[]}}} Item */
-/** @typedef {{signal: string, location: LH.Audit.Details.SourceLocationValue}} SubItem */
-
-import {ByteEfficiencyAudit} from './byte-efficiency-audit.js';
-import {EntityClassification} from '../../computed/entity-classification.js';
-import {JSBundles} from '../../computed/js-bundles.js';
-import * as i18n from '../../lib/i18n/i18n.js';
-import {estimateCompressionRatioForContent} from '../../lib/script-helpers.js';
-import {detectLegacyJavaScript} from '../../lib/legacy-javascript/legacy-javascript.js';
-
-const UIStrings = {
-  /** Title of a Lighthouse audit that tells the user about legacy polyfills and transforms used on the page. This is displayed in a list of audit titles that Lighthouse generates. */
-  title: 'Avoid serving legacy JavaScript to modern browsers',
-  // TODO: developer.chrome.com article. this codelab is good starting place: https://web.dev/articles/codelab-serve-modern-code
-  /** Description of a Lighthouse audit that tells the user about old JavaScript that is no longer needed. This is displayed after a user expands the section to see more. No character length limits. The last sentence starting with 'Learn' becomes link text to additional documentation. */
-  description: 'Polyfills and transforms enable legacy browsers to use new JavaScript features. However, many aren\'t necessary for modern browsers. Consider modifying your JavaScript build process to not transpile [Baseline](https://web.dev/baseline) features, unless you know you must support legacy browsers. [Learn why most sites can deploy ES6+ code without transpiling](https://philipwalton.com/articles/the-state-of-es5-on-the-web/)',
-  /** Warning text that an outdated version of the library "core-js" was found, and the developer should upgrade. */
-  // eslint-disable-next-line max-len
-  detectedCoreJs2Warning: 'Version 2 of core-js was detected on the page. You should upgrade to version 3 for many performance improvements.',
-};
-
-const str_ = i18n.createIcuMessageFn(import.meta.url, UIStrings);
-
-class LegacyJavascript extends ByteEfficiencyAudit {
-  /**
-   * @return {LH.Audit.Meta}
-   */
-  static get meta() {
-    return {
-      id: 'legacy-javascript',
-      scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.METRIC_SAVINGS,
-      description: str_(UIStrings.description),
-      title: str_(UIStrings.title),
-      guidanceLevel: 2,
-      requiredArtifacts: ['DevtoolsLog', 'Trace', 'Scripts', 'SourceMaps',
-        'GatherContext', 'URL'],
-    };
-  }
-
-  /**
-   * @param {LH.Artifacts} artifacts
-   * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords
-   * @param {LH.Audit.Context} context
-   * @return {Promise<ByteEfficiencyProduct>}
-   */
-  static async audit_(artifacts, networkRecords, context) {
-    const devtoolsLog = artifacts.DevtoolsLog;
-    const classifiedEntities = await EntityClassification.request(
-      {URL: artifacts.URL, devtoolsLog}, context);
-
-    const bundles = await JSBundles.request(artifacts, context);
-
-    /** @type {Item[]} */
-    const items = [];
-
-    /** @type {Map<string, number>} */
-    const compressionRatioByUrl = new Map();
-
-    for (const script of artifacts.Scripts) {
-      const bundle = bundles.find(bundle => bundle.script.scriptId === script.scriptId);
-      const {matches, estimatedByteSavings} =
-        detectLegacyJavaScript(script.content ?? '', bundle?.map ?? null);
-      if (matches.length === 0) continue;
-
-      const compressionRatio = estimateCompressionRatioForContent(
-        compressionRatioByUrl, script.url, artifacts, networkRecords);
-      const wastedBytes = Math.round(estimatedByteSavings * compressionRatio);
-      /** @type {typeof items[number]} */
-      const item = {
-        url: script.url,
-        wastedBytes,
-        subItems: {
-          type: 'subitems',
-          items: [],
-        },
-        // Not needed, but keeps typescript happy.
-        totalBytes: 0,
-      };
-
-      for (const match of matches) {
-        const {name, line, column} = match;
-        /** @type {SubItem} */
-        const subItem = {
-          signal: name,
-          location: ByteEfficiencyAudit.makeSourceLocation(script.url, line, column, bundle),
-        };
-        item.subItems.items.push(subItem);
-      }
-      items.push(item);
-    }
-
-    const warnings = [];
-    for (const bundle of bundles) {
-      if (classifiedEntities.isFirstParty(bundle.script.url)) {
-        if (bundle.rawMap.sources.some(s => s.match(/node_modules\/core-js\/modules\/es[67]/))) {
-          warnings.push(str_(UIStrings.detectedCoreJs2Warning));
-          break;
-        }
-      }
-    }
-
-    /** @type {Map<string, number>} */
-    const wastedBytesByUrl = new Map();
-    for (const item of items) {
-      // Only estimate savings if first party code has legacy code.
-      if (classifiedEntities.isFirstParty(item.url)) {
-        wastedBytesByUrl.set(item.url, item.wastedBytes);
-      }
-    }
-
-    /** @type {LH.Audit.Details.TableColumnHeading[]} */
-    const headings = [
-      /* eslint-disable max-len */
-      {key: 'url', valueType: 'url', subItemsHeading: {key: 'location', valueType: 'source-location'}, label: str_(i18n.UIStrings.columnURL)},
-      {key: null, valueType: 'code', subItemsHeading: {key: 'signal'}, label: ''},
-      {key: 'wastedBytes', valueType: 'bytes', label: str_(i18n.UIStrings.columnWastedBytes)},
-      /* eslint-enable max-len */
-    ];
-
-    return {
-      items,
-      headings,
-      wastedBytesByUrl,
-      warnings,
-    };
-  }
-}
-
-export default LegacyJavascript;
-export {UIStrings};

package/core/audits/byte-efficiency/modern-image-formats.d.ts

@@ -1,38 +0,0 @@
-export default ModernImageFormats;
-declare class ModernImageFormats extends ByteEfficiencyAudit {
-    /**
-     * @param {{naturalWidth: number, naturalHeight: number}} imageElement
-     * @return {number}
-     */
-    static estimateWebPSizeFromDimensions(imageElement: {
-        naturalWidth: number;
-        naturalHeight: number;
-    }): number;
-    /**
-     * @param {{naturalWidth: number, naturalHeight: number}} imageElement
-     * @return {number}
-     */
-    static estimateAvifSizeFromDimensions(imageElement: {
-        naturalWidth: number;
-        naturalHeight: number;
-    }): number;
-    /**
-     * @param {{jpegSize: number | undefined, webpSize: number | undefined}} otherFormatSizes
-     * @return {number|undefined}
-     */
-    static estimateAvifSizeFromWebPAndJpegEstimates(otherFormatSizes: {
-        jpegSize: number | undefined;
-        webpSize: number | undefined;
-    }): number | undefined;
-    /**
-     * @param {LH.Artifacts} artifacts
-     * @return {import('./byte-efficiency-audit.js').ByteEfficiencyProduct}
-     */
-    static audit_(artifacts: LH.Artifacts): import("./byte-efficiency-audit.js").ByteEfficiencyProduct;
-}
-export namespace UIStrings {
-    let title: string;
-    let description: string;
-}
-import { ByteEfficiencyAudit } from './byte-efficiency-audit.js';
-//# sourceMappingURL=modern-image-formats.d.ts.map