Upgrading web-vitals 0.2 to 1
Breaking0.2.4 → 1.1.2Breaking2Changed3Fixed6
BreakingUpgrade verdict
2 breaking changes.
In plain terms
- The isFinal property is no longer included on metric objects, so code reading it will break.
- Metrics are now reported again when a page is restored from the browser's back/forward cache.
Must act 2 items need code or config changes
What you must change
Breaking2
Removes the
isFinal flag from the Metric interface.MetricisFinalAdds support for reporting metrics on back/forward cache restore.
API changes
Generated by DepDelta from published .d.ts files. Not mixed with prose notes.
- added:
export * from './dist/modules/index'
- removed:
property Window.perfMetrics: FIDPolyfill - added:
property Window.__WEB_VITALS_POLYFILL__: boolean - added:
property Window.webVitals: WebVitalsGlobal
- removed:
const getCLS: (onReport: ReportHandler, reportAllChanges?: boolean) => void
- removed:
const getFCP: (onReport: ReportHandler) => void
- removed:
const getFID: (onReport: ReportHandler) => void - removed:
declare global
- removed:
const getLCP: (onReport: ReportHandler, reportAllChanges?: boolean) => void
- removed:
const getTTFB: (onReport: ReportHandler) => void
- removed:
export * from './types' - removed:
export { getCLS } from './getCLS' - removed:
export { getFCP } from './getFCP' - removed:
export { getFID } from './getFID' - removed:
export { getLCP } from './getLCP' - removed:
export { getTTFB } from './getTTFB'
- removed:
const bindReporter: (callback: ReportHandler, metric: Metric, po: PerformanceObserver | undefined, observeAllUpdates?: boolean | undefined) => () => void
- removed:
const generateUniqueID: () => string
- removed:
const getFirstHidden: () => { readonly timeStamp: number }
- removed:
const initMetric: (name: Metric['name'], value?: number) => Metric
- removed:
call PerformanceEntryHandler(entry: PerformanceEntry): void - removed:
const observe: (type: string, callback: PerformanceEntryHandler) => PerformanceObserver | undefined - removed:
interface PerformanceEntryHandler
- removed:
call OnHiddenCallback({ timeStamp, isUnloading }: { timeStamp: number; isUnloading: boolean }): void - removed:
const onHidden: (cb: OnHiddenCallback, once?: boolean) => void - removed:
interface OnHiddenCallback
- removed:
const whenInput: () => Promise<Event>
- added:
const getCLS: (onReport: ReportHandler, reportAllChanges?: boolean | undefined) => void
- added:
const getFCP: (onReport: ReportHandler, reportAllChanges?: boolean | undefined) => void
- added:
const getFID: (onReport: ReportHandler, reportAllChanges?: boolean | undefined) => void
- added:
const getLCP: (onReport: ReportHandler, reportAllChanges?: boolean | undefined) => void
- added:
const getTTFB: (onReport: ReportHandler) => void
- added:
export * from './types' - added:
export { getCLS } from './getCLS' - added:
export { getFCP } from './getFCP' - added:
export { getFID } from './getFID' - added:
export { getLCP } from './getLCP' - added:
export { getTTFB } from './getTTFB'
- added:
const bindReporter: (callback: ReportHandler, metric: Metric, reportAllChanges?: boolean | undefined) => () => void
- added:
const finalMetrics: WeakSet<Metric> | Set<Metric>
- added:
const generateUniqueID: () => string
- added:
const getFirstHidden: () => { readonly timeStamp: number }
- added:
const initMetric: (name: Metric['name'], value?: number | undefined) => Metric
- added:
call PerformanceEntryHandler(entry: PerformanceEntry): void - added:
const observe: (type: string, callback: PerformanceEntryHandler) => PerformanceObserver | undefined - added:
interface PerformanceEntryHandler
- added:
const onBFCacheRestore: (cb: onBFCacheRestoreCallback) => void
- added:
call OnHiddenCallback(event: Event): void - added:
const onHidden: (cb: OnHiddenCallback, once?: boolean | undefined) => void - added:
interface OnHiddenCallback
- added:
const firstInputPolyfill: (onFirstInput: FirstInputPolyfillCallback) => void - added:
const resetFirstInputPolyfill: () => void
- added:
const getFirstHiddenTime: () => number
- added:
call FirstInputPolyfillCallback(entry: FirstInputPolyfillEntry): void - added:
call ReportHandler(metric: Metric): void - added:
declare global - added:
interface FirstInputPolyfillCallback - added:
interface Metric - added:
interface PerformanceEventTiming extends PerformanceEntry - added:
interface ReportHandler - added:
interface WebVitalsGlobal - added:
property Metric.delta: number - added:
property Metric.entries: (PerformanceEntry | FirstInputPolyfillEntry | NavigationTimingPolyfillEntry)[] - added:
property Metric.id: string - added:
property Metric.name: 'CLS' | 'FCP' | 'FID' | 'LCP' | 'TTFB' - added:
property Metric.value: number - added:
property PerformanceEventTiming.cancelable?: boolean - added:
property PerformanceEventTiming.duration: DOMHighResTimeStamp - added:
property PerformanceEventTiming.processingEnd: DOMHighResTimeStamp - added:
property PerformanceEventTiming.processingStart: DOMHighResTimeStamp - added:
property PerformanceEventTiming.target?: Element - added:
property WebVitalsGlobal.firstHiddenTime: number - added:
property WebVitalsGlobal.firstInputPolyfill: (onFirstInput: FirstInputPolyfillCallback) => void - added:
property WebVitalsGlobal.resetFirstInputPolyfill: () => void - added:
type FirstInputPolyfillEntry = Omit<PerformanceEventTiming, 'processingEnd' | 'toJSON'> - added:
type NavigationTimingPolyfillEntry = Omit<PerformanceNavigationTiming, 'initiatorType' | 'nextHopProtocol' | 'redirectCount' | 'transferSize' | 'encodedBodySize' | 'decodedBodySize' | 'toJSON'>
- removed:
call ReportHandler(metric: Metric): void - removed:
interface Metric - removed:
interface ReportHandler - removed:
property Metric.delta: number - removed:
property Metric.entries: PerformanceEntry[] - removed:
property Metric.id: string - removed:
property Metric.isFinal: boolean - removed:
property Metric.name: 'CLS' | 'FCP' | 'FID' | 'LCP' | 'TTFB' - removed:
property Metric.value: number