Next.js website for Rocky Mountain Vending company featuring: - Product catalog with Stripe integration - Service areas and parts pages - Admin dashboard with Clerk authentication - SEO optimized pages with JSON-LD structured data Co-authored-by: Cursor <cursoragent@cursor.com>
70 lines
3.6 KiB
Text
70 lines
3.6 KiB
Text
// import type * as Common from '../../../core/common/common.js';
|
|
import * as Handlers from '../handlers/handlers.js';
|
|
import * as Types from '../types/types.js';
|
|
import { type InsightModel, type InsightSetContext } from './types.js';
|
|
export declare const UIStrings: {
|
|
/**
|
|
* @description Title of an insight that recommends reducing the size of the DOM tree as a means to improve page responsiveness. "DOM" is an acronym and should not be translated.
|
|
*/
|
|
readonly title: "Optimize DOM size";
|
|
/**
|
|
* @description Description of an insight that recommends reducing the size of the DOM tree as a means to improve page responsiveness. "DOM" is an acronym and should not be translated. "layout reflows" are when the browser will recompute the layout of content on the page.
|
|
*/
|
|
readonly description: "A large DOM can increase the duration of style calculations and layout reflows, impacting page responsiveness. A large DOM will also increase memory usage. [Learn how to avoid an excessive DOM size](https://developer.chrome.com/docs/lighthouse/performance/dom-size/).";
|
|
/**
|
|
* @description Header for a column containing the names of statistics as opposed to the actual statistic values.
|
|
*/
|
|
readonly statistic: "Statistic";
|
|
/**
|
|
* @description Header for a column containing the value of a statistic.
|
|
*/
|
|
readonly value: "Value";
|
|
/**
|
|
* @description Header for a column containing the page element related to a statistic.
|
|
*/
|
|
readonly element: "Element";
|
|
/**
|
|
* @description Label for a value representing the total number of elements on the page.
|
|
*/
|
|
readonly totalElements: "Total elements";
|
|
/**
|
|
* @description Label for a value representing the maximum depth of the Document Object Model (DOM). "DOM" is a acronym and should not be translated.
|
|
*/
|
|
readonly maxDOMDepth: "DOM depth";
|
|
/**
|
|
* @description Label for a value representing the maximum number of child elements of any parent element on the page.
|
|
*/
|
|
readonly maxChildren: "Most children";
|
|
/**
|
|
* @description Text for a section.
|
|
*/
|
|
readonly topUpdatesDescription: "These are the largest layout and style recalculation events. Their performance impact may be reduced by making the DOM simpler.";
|
|
/**
|
|
* @description Label used for a time duration.
|
|
*/
|
|
readonly duration: "Duration";
|
|
/**
|
|
* @description Message displayed in a table detailing how big a layout (rendering) is.
|
|
* @example {134} PH1
|
|
*/
|
|
readonly largeLayout: "Layout ({PH1} objects)";
|
|
/**
|
|
* @description Message displayed in a table detailing how big a style recalculation (rendering) is.
|
|
* @example {134} PH1
|
|
*/
|
|
readonly largeStyleRecalc: "Style recalculation ({PH1} elements)";
|
|
};
|
|
export declare const i18nString: (id: string, values?: Record<string, string> | undefined) => {i18nId: string, values: Record<string, string|number>, formattedDefault: string};
|
|
export type DOMSizeInsightModel = InsightModel<typeof UIStrings, {
|
|
largeLayoutUpdates: Types.Events.Layout[];
|
|
largeStyleRecalcs: Types.Events.UpdateLayoutTree[];
|
|
largeUpdates: Array<{
|
|
label: {i18nId: string, values: Record<string, string|number>, formattedDefault: string};
|
|
duration: Types.Timing.Milli;
|
|
size: number;
|
|
event: Types.Events.Event;
|
|
}>;
|
|
maxDOMStats?: Types.Events.DOMStats;
|
|
}>;
|
|
export declare function generateInsight(parsedTrace: Handlers.Types.ParsedTrace, context: InsightSetContext): DOMSizeInsightModel;
|
|
export declare function createOverlays(model: DOMSizeInsightModel): Types.Overlays.Overlay[];
|