Deploy March 20, 2026

docs-developer/CHANGELOG-formats.md

@@ -6,6 +6,14 @@ Note that this is not an exhaustive list. Processed profile format upgraders can
 
 ## Processed profile format
 
+### Version 61
+
+The `SourceTable` in `profile.shared.sources` was updated:
+
+- The `uuid` field was renamed to `id`.
+- Two new fields `startLine` and `startColumn` were added (1-based). These describe the start position of the script within its resource, useful for inline scripts. If the source covers the entire file, use `(1, 1)`.
+- A new `sourceMapURL` field was added. Use `null` for entries with no source map URL.
+
 ### Version 60
 
 The following tables have moved into `profile.shared`: `stackTable`, `frameTable`, `funcTable`, `resourceTable`, `nativeSymbols`. They are no longer per-thread.
@@ -137,6 +145,14 @@ Older versions are not documented in this changelog but can be found in [process
 
 ## Gecko profile format
 
+### Version 34
+
+The `SourceTable` schema was updated:
+
+- The `uuid` field was renamed to `id`.
+- Two new fields `startLine` and `startColumn` were added (1-based). If the source covers the entire file, use `(1, 1)`.
+- A new `sourceMapURL` field was added. It can be omitted if it is the last element in the row and there is no source map URL.
+
 ### Version 33
 
 The `sources` field in the Gecko profile format is now non-optional. An upgrader was added that creates an empty `SourceTable` for profiles that don't have one.

locales/be/app.ftl

@@ -315,6 +315,7 @@ Home--additional-content-title = Загрузіць існуючыя профі
 Home--additional-content-content = Вы можаце <strong>перацягнуць</strong> файл профілю сюды, каб загрузіць яго, або:
 Home--compare-recordings-info = Вы таксама можаце параўнаць запісы. <a>Адкрыць інтэрфейс параўнання.</a>
 Home--your-recent-uploaded-recordings-title = Вашы нядаўна запампаваныя запісы
+Home--dark-mode-title = Цёмны рэжым
 # We replace the elements such as <perf> and <simpleperf> with links to the
 # documentation to use these tools.
 Home--load-files-from-other-tools2 =
@@ -569,6 +570,8 @@ MenuButtons--metaInfo--buffer-duration-seconds =
 MenuButtons--metaInfo--buffer-duration-unlimited = Неабмежавана
 MenuButtons--metaInfo--application = Праграма
 MenuButtons--metaInfo--name-and-version = Назва і версія:
+# The time between application startup and when the profiler was started
+MenuButtons--metaInfo--application-uptime2 = Час працы:
 MenuButtons--metaInfo--update-channel = Канал абнаўлення:
 MenuButtons--metaInfo--build-id = ID зборкі:
 MenuButtons--metaInfo--build-type = Тып зборкі:
@@ -881,6 +884,11 @@ TrackPower--tooltip-power-watt = { $value } Вт
 #   $value (String) - the power value at this location
 TrackPower--tooltip-power-milliwatt = { $value } мВт
     .label = Магутнасць
+# This is used in the tooltip when the instant power value uses the microwatt unit.
+# Variables:
+#   $value (String) - the power value at this location
+TrackPower--tooltip-power-microwatt = { $value } мкВт
+    .label = Энэргія
 # This is used in the tooltip when the power value uses the kilowatt unit.
 # Variables:
 #   $value (String) - the power value at this location
@@ -1175,6 +1183,17 @@ AssemblyView--show-button =
 # Assembly refers to the low-level programming language.
 AssemblyView--hide-button =
     .title = Схаваць прагляд асэмблера
+# The "◀" button above the assembly view.
+AssemblyView--prev-button =
+    .title = Назад
+# The "▶" button above the assembly view.
+AssemblyView--next-button =
+    .title = Далей
+# The label showing the current position and total count above the assembly view.
+# Variables:
+#   $current (Number) - The current position (1-indexed).
+#   $total (Number) - The total count.
+AssemblyView--position-label = { $current } з { $total }
 
 ## UploadedRecordingsHome
 ## This is the page that displays all the profiles that user has uploaded.

locales/el/app.ftl

@@ -348,6 +348,9 @@ Home--record-instructions =
     Για να αρχίσει η καταγραφή προφίλ, κάντε κλικ στο αντίστοιχο κουμπί ή χρησιμοποιήστε
     τις συντομεύσεις πληκτρολογίου. Το εικονίδιο είναι μπλε κατά την καταγραφή ενός προφίλ.
     Πατήστε το <kbd>Καταγραφή</kbd> για να φορτώσετε τα δεδομένα στο profiler.firefox.com.
+Home--instructions-content2 =
+    Η καταγραφή των προφίλ επιδόσεων απαιτεί το <a>{ -firefox-brand-name } για υπολογιστές</a>.
+    Ωστόσο, τα υπάρχοντα προφίλ μπορούν να προβληθούν σε όλα τα σύγχρονα προγράμματα περιήγησης.
 Home--fenix-instructions-directly =
     Μπορείτε να καταγράψετε προφίλ για το { -firefox-android-brand-name } απευθείας σε αυτήν τη συσκευή. Για
     περισσότερες πληροφορίες, διαβάστε το <a>Καταγραφή προφίλ του { -firefox-android-brand-name } απευθείας στη συσκευή</a>.

locales/en-GB/app.ftl

@@ -352,6 +352,9 @@ Home--record-instructions =
     To start profiling, click on the profiling button, or use the
     keyboard shortcuts. The icon is blue when a profile is recording.
     Hit <kbd>Capture</kbd> to load the data into profiler.firefox.com.
+Home--instructions-content2 =
+    Recording performance profiles requires <a>{ -firefox-brand-name } for desktop</a>.
+    However, existing profiles can be viewed in any modern browser.
 Home--fenix-instructions-directly =
     { -firefox-android-brand-name } can be profiled directly on this device. For
     more information, read <a>Profiling { -firefox-android-brand-name } directly on device</a>.

locales/es-CL/app.ftl

@@ -284,6 +284,9 @@ Home--enable-button-unavailable =
 # This message can be seen on https://main--perf-html.netlify.app/ .
 Home--web-channel-unavailable = Esta instancia del perfilador no pudo conectarse a WebChannel. Esto usualmente significa que está ejecutándose en un servidor diferente del especificado en la preferencia <code>devtools.performance.recording.ui-base-url</code>. Si quieres capturar nuevos perfiles con esta instancia, y otorgarle control programático del botón del menú del perfilador, puedes ir a <code>about:config</code> y cambiar la preferencia.
 Home--record-instructions = Para empezar a perfilar, haz clic en el botón de perfilado o utiliza los atajos del teclado. El icono se torna azul cuando se está grabando un perfil. Pulsa <kbd>Capturar</kbd> para cargar los datos en profiler.firefox.com.
+Home--instructions-content2 =
+    Registrar perfiles de rendimiento requiere de <a>{ -firefox-brand-name } para escritorio</a>.
+    Sin embargo, los perfiles existentes pueden ser vistos en cualquier navegador moderno.
 Home--fenix-instructions-directly = { -firefox-android-brand-name } puede ser perfilado directamente en este dispositivo. Para más información, consulta <a>Perfilar { -firefox-android-brand-name } directamente en el dispositivo</a>.
 Home--fenix-instructions-remotely = También puedes perfilar { -firefox-android-brand-name } de forma remota desde { -firefox-brand-name } para escritorio. Para más información, consulta esta documentación: <a>Perfilar { -firefox-android-brand-name } de forma remota</a>.
 Home--record-instructions-start-stop = Detener e iniciar perfilado

locales/ia/app.ftl

@@ -344,6 +344,9 @@ Home--record-instructions =
     Pro comenciar le profilage, clicca sur le button de profilage o usa le
     claves de accesso directe. Le icone es blau quando un profilo se registra.
     Pulsa <kbd>Capturar</kbd> pro cargar le datos in profiler.firefox.com.
+Home--instructions-content2 =
+    Registrar profilos de prestation require <a>{ -firefox-brand-name } pro scriptorio</a>.
+    Totevia, le profilos existente pote esser vidite in qualcunque navigator moderne.
 Home--fenix-instructions-directly =
     { -firefox-android-brand-name } pote esser profilate directemente sur iste
     apparato. Pro altere informationes, lege <a>Profilar { -firefox-android-brand-name }

locales/sv-SE/app.ftl

@@ -347,6 +347,9 @@ Home--record-instructions =
     För att starta profilering, klicka på profileringsknappen eller använd
     kortkommandona. Ikonen är blå när en profil spelas in. Tryck på
     <kbd>Fånga</kbd> för att ladda data till profiler.firefox.com.
+Home--instructions-content2 =
+    Inspelning av prestandaprofiler kräver <a>{ -firefox-brand-name } för datorer</a>.
+    Befintliga profiler kan dock visas i vilken modern webbläsare som helst.
 Home--fenix-instructions-directly =
     { -firefox-android-brand-name } kan profileras direkt på den här enheten. För
     mer information, läs <a>Profilering av { -firefox-android-brand-name } direkt på enheten</a>.

locales/tr/app.ftl

@@ -265,6 +265,9 @@ Home--record-instructions =
     Profillemeyi başlatmak için profilleme düğmesine tıklayın veya
     klavye kısayollarını kullanın. Profil kaydedilirken simge maviye dönüşür.
     Verileri profiler.firefox.com’a yüklemek için <kbd>Kaydet</kbd>’e tıklayın.
+Home--instructions-content2 =
+    Performans profilleri yalnızca <a>{ -firefox-brand-name }’un masaüstü sürümü</a> ile kaydedilebilir.
+    Ancak mevcut profiller herhangi bir modern tarayıcıda görüntülenebilir.
 Home--record-instructions-start-stop = Profillemeyi durdur ve başlat
 Home--record-instructions-capture-load = Profili yakala ve yükle
 Home--profiler-motto = Performans profili kaydedin. Analiz edin. Paylaşın. Web’i daha hızlı hale getirin.

package.json

@@ -61,17 +61,17 @@
   },
   "dependencies": {
     "@codemirror/lang-cpp": "^6.0.3",
-    "@codemirror/lang-javascript": "^6.2.4",
+    "@codemirror/lang-javascript": "^6.2.5",
     "@codemirror/lang-rust": "^6.0.2",
-    "@codemirror/language": "^6.12.1",
+    "@codemirror/language": "^6.12.2",
     "@codemirror/state": "^6.5.4",
     "@codemirror/view": "^6.39.14",
     "@firefox-devtools/react-contextmenu": "^5.2.3",
     "@fluent/bundle": "^0.19.1",
     "@fluent/langneg": "^0.7.0",
     "@fluent/react": "^0.15.2",
     "@lezer/highlight": "^1.2.3",
-    "@tgwf/co2": "^0.17.0",
+    "@tgwf/co2": "^0.18.0",
     "array-move": "^3.0.1",
     "array-range": "^1.0.1",
     "clamp": "^1.0.1",
@@ -96,7 +96,7 @@
     "query-string": "^9.3.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-intersection-observer": "^10.0.2",
+    "react-intersection-observer": "^10.0.3",
     "react-redux": "^9.2.0",
     "react-splitter-layout": "^4.0.0",
     "react-transition-group": "^4.4.5",
@@ -118,15 +118,15 @@
     "@babel/preset-env": "^7.29.0",
     "@babel/preset-react": "^7.28.5",
     "@babel/preset-typescript": "^7.28.5",
-    "@eslint/js": "^9.39.3",
+    "@eslint/js": "^9.39.4",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@types/clamp": "^1.0.3",
     "@types/common-tags": "^1.8.4",
     "@types/jest": "^30.0.0",
     "@types/minimist": "^1.2.5",
-    "@types/node": "^22.19.11",
+    "@types/node": "^22.19.15",
     "@types/query-string": "^6.3.0",
     "@types/react": "^18.3.28",
     "@types/react-dom": "^18.3.1",
@@ -147,18 +147,18 @@
     "esbuild": "^0.27.0",
     "esbuild-plugin-copy": "^2.1.1",
     "esbuild-plugin-wasm": "^1.1.0",
-    "eslint": "^9.39.3",
+    "eslint": "^9.39.4",
     "eslint-config-prettier": "^10.1.8",
     "eslint-import-resolver-alias": "^1.1.2",
     "eslint-plugin-import": "^2.32.0",
-    "eslint-plugin-jest": "^29.13.0",
+    "eslint-plugin-jest": "^29.15.0",
     "eslint-plugin-jest-dom": "^5.5.0",
     "eslint-plugin-jest-formatting": "^3.1.0",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-testing-library": "^7.16.0",
     "fake-indexeddb": "^6.2.5",
     "fetch-mock": "^12.6.0",
-    "globals": "^17.3.0",
+    "globals": "^17.4.0",
     "husky": "^4.3.8",
     "jest": "^30.2.0",
     "jest-environment-jsdom": "^30.2.0",
@@ -169,7 +169,7 @@
     "npm-run-all2": "^8.0.4",
     "open": "^11.0.0",
     "patch-package": "^8.0.1",
-    "postcss": "^8.5.6",
+    "postcss": "^8.5.8",
     "postinstall-postinstall": "^2.1.0",
     "prettier": "^3.8.1",
     "rimraf": "^6.1.3",

src/app-logic/constants.ts

@@ -7,12 +7,12 @@ import type { MarkerPhase } from 'firefox-profiler/types';
 // The current version of the Gecko profile format.
 // Please don't forget to update the gecko profile format changelog in
 // `docs-developer/CHANGELOG-formats.md`.
-export const GECKO_PROFILE_VERSION = 33;
+export const GECKO_PROFILE_VERSION = 34;
 
 // The current version of the "processed" profile format.
 // Please don't forget to update the processed profile format changelog in
 // `docs-developer/CHANGELOG-formats.md`.
-export const PROCESSED_PROFILE_VERSION = 60;
+export const PROCESSED_PROFILE_VERSION = 61;
 
 // The following are the margin sizes for the left and right of the timeline. Independent
 // components need to share these values.

src/components/app/SourceCodeFetcher.tsx

@@ -11,7 +11,7 @@ import {
   getSymbolServerUrl,
   getSourceViewFile,
   getSourceViewSourceIndex,
-  getSourceViewSourceUuid,
+  getSourceViewSourceId,
 } from 'firefox-profiler/selectors';
 import {
   beginLoadingSourceCodeFromUrl,
@@ -36,7 +36,7 @@ import type {
 type StateProps = {
   readonly sourceViewFile: string | null;
   readonly sourceViewSourceIndex: IndexIntoSourceTable | null;
-  readonly sourceViewSourceUuid: string | null;
+  readonly sourceViewSourceId: string | null;
   readonly sourceViewCode: SourceCodeStatus | void;
   readonly symbolServerUrl: string;
   readonly profile: Profile | null;
@@ -68,7 +68,7 @@ class SourceCodeFetcherImpl extends React.PureComponent<Props> {
       sourceViewSourceIndex,
       sourceViewCode,
       sourceViewFile,
-      sourceViewSourceUuid,
+      sourceViewSourceId,
       beginLoadingSourceCodeFromUrl,
       beginLoadingSourceCodeFromBrowserConnection,
       finishLoadingSourceCode,
@@ -105,7 +105,7 @@ class SourceCodeFetcherImpl extends React.PureComponent<Props> {
 
     const fetchSourceResult = await fetchSource(
       sourceViewFile,
-      sourceViewSourceUuid,
+      sourceViewSourceId,
       symbolServerUrl,
       addressProof,
       this._archiveCache,
@@ -137,7 +137,7 @@ export const SourceCodeFetcher = explicitConnect<{}, StateProps, DispatchProps>(
     mapStateToProps: (state) => ({
       sourceViewSourceIndex: getSourceViewSourceIndex(state),
       sourceViewFile: getSourceViewFile(state),
-      sourceViewSourceUuid: getSourceViewSourceUuid(state),
+      sourceViewSourceId: getSourceViewSourceId(state),
       sourceViewCode: getSourceViewCode(state),
       symbolServerUrl: getSymbolServerUrl(state),
       profile: getProfileOrNull(state),

src/components/flame-graph/Canvas.tsx

@@ -32,6 +32,7 @@ import type {
   SamplesLikeTable,
   InnerWindowID,
   Page,
+  SampleCategoriesAndSubcategories,
 } from 'firefox-profiler/types';
 
 import type {
@@ -55,8 +56,6 @@ export type OwnProps = {
   readonly thread: Thread;
   readonly weightType: WeightType;
   readonly innerWindowIDToPageMap: Map<InnerWindowID, Page> | null;
-  readonly unfilteredThread: Thread;
-  readonly ctssSampleIndexOffset: number;
   readonly maxStackDepthPlusOne: number;
   readonly flameGraphTiming: FlameGraphTiming;
   readonly callNodeInfo: CallNodeInfo;
@@ -74,7 +73,7 @@ export type OwnProps = {
   readonly isInverted: boolean;
   readonly callTreeSummaryStrategy: CallTreeSummaryStrategy;
   readonly ctssSamples: SamplesLikeTable;
-  readonly unfilteredCtssSamples: SamplesLikeTable;
+  readonly ctssSampleCategoriesAndSubcategories: SampleCategoriesAndSubcategories;
   readonly tracedTiming: CallTreeTimingsNonInverted | null;
   readonly displayStackType: boolean;
 };
@@ -355,8 +354,6 @@ class FlameGraphCanvasImpl extends React.PureComponent<Props> {
   }: HoveredStackTiming): React.ReactNode => {
     const {
       thread,
-      unfilteredThread,
-      ctssSampleIndexOffset,
       flameGraphTiming,
       callTree,
       callNodeInfo,
@@ -367,7 +364,7 @@ class FlameGraphCanvasImpl extends React.PureComponent<Props> {
       innerWindowIDToPageMap,
       weightType,
       ctssSamples,
-      unfilteredCtssSamples,
+      ctssSampleCategoriesAndSubcategories,
       tracedTiming,
       displayStackType,
     } = this.props;
@@ -426,11 +423,9 @@ class FlameGraphCanvasImpl extends React.PureComponent<Props> {
             ? this._getTimingsForCallNodeIndex(
                 callNodeIndex,
                 callNodeInfo,
-                unfilteredThread,
-                ctssSampleIndexOffset,
                 categories,
                 ctssSamples,
-                unfilteredCtssSamples
+                ctssSampleCategoriesAndSubcategories
               )
             : undefined
         }