firefox-devtools · canova · Sep 5, 2025 · Sep 2, 2025 · Sep 2, 2025 · Sep 2, 2025
diff --git a/.prettierignore b/.prettierignore
@@ -3,7 +3,6 @@ src/types/libdef/npm
 docs-user/js
 docs-user/css
 src/test/fixtures/upgrades
-res/zee-worker.js
 dist
 coverage
 taskcluster/

diff --git a/.vscode/settings.json b/.vscode/settings.json
diff --git a/eslint.config.mjs b/eslint.config.mjs
@@ -17,6 +17,8 @@ export default [
     ignores: [
       'src/profile-logic/import/proto/**',
       'src/types/libdef/npm/**',
+      'res/**',
+      'dist/**',
       'docs-user/**',
       'coverage/**',
     ],

diff --git a/locales/de/app.ftl b/locales/de/app.ftl
@@ -710,7 +710,7 @@ ServiceWorkerManager--hide-notice-button =
 StackSettings--implementation-all-frames = Alle Frames
     .title = Die Stack-Frames nicht filtern
 StackSettings--implementation-script = Skript
-    .title = Nur die Stapelrahmen anzeigen, die mit der Skriptausführung zusammenhängen.
+    .title = Nur Stack-Frames anzeigen, die mit Skriptausführung zusammenhängen.
 StackSettings--implementation-native2 = Native
     .title = Nur die Stack-Frames für nativen Quelltext anzeigen
 # This label is displayed in the marker chart and marker table panels only.

diff --git a/locales/tr/app.ftl b/locales/tr/app.ftl
@@ -131,12 +131,22 @@ CallTreeSidebar--traced-running-time =
     .label = İzlenen çalışma süresi
 CallTreeSidebar--running-time =
     .label = Çalışma süresi
+CallTreeSidebar--self-time =
+    .label = Kendi süresi
 CallTreeSidebar--running-samples =
     .label = Çalışan örnekler
+CallTreeSidebar--self-samples =
+    .label = Kendi örnekleri
 CallTreeSidebar--running-size =
     .label = Çalışma boyutu
+CallTreeSidebar--self-size =
+    .label = Kendi boyutu
 CallTreeSidebar--categories = Kategoriler
 CallTreeSidebar--implementation = Yürütme
+CallTreeSidebar--running-milliseconds = Çalışma milisaniyesi
+CallTreeSidebar--self-milliseconds = Kendi milisaniyesi
+CallTreeSidebar--self-sample-count = Kendi örnek sayısı
+CallTreeSidebar--self-bytes = Kendi baytı
 
 ## CompareHome
 ## This is used in the page to compare two profiles.
@@ -152,6 +162,15 @@ CompareHome--form-label-profile2 = Profil 2:
 CompareHome--submit-button =
     .value = Profilleri getir
 
+## DebugWarning
+## This is displayed at the top of the analysis page when the loaded profile is
+## a debug build of Firefox.
+
+DebugWarning--warning-message =
+    .message =
+        Bu profil, sürüm optimizasyonları yapılmamış bir derlemede kaydedildi.
+        Performans gözlemleri sürüm popülasyonu için geçerli olmayabilir.
+
 ## Details
 ## This is the bottom panel in the analysis UI. They are generic strings to be
 ## used at the bottom part of the UI.
@@ -205,6 +224,10 @@ Home--load-from-url-submit-button =
     .value = Yükle
 Home--documentation-button = Dokümantasyon
 Home--menu-button = { -profiler-brand-name } menü düğmesini etkinleştir
+Home--menu-button-instructions = Performans kaydetmeye başlamak için { -firefox-brand-name }’ta profilleyici menü düğmesini etkinleştirin, ardından profili analiz edin ve profiler.firefox.com ile paylaşın.
+Home--profile-firefox-android-instructions =
+    { -firefox-android-brand-name }’ta da profilleme yapabilirsiniz. Daha fazla bilgi almak için lütfen bu belgeye bakın:
+    <a>Doğrudan cihaz üzerinde { -firefox-android-brand-name } profilleme</a>.
 # The word WebChannel should not be translated.
 # This message can be seen on https://main--perf-html.netlify.app/ in the tooltip
 # of the "Enable Firefox Profiler menu button" button.
@@ -221,6 +244,11 @@ Home--additional-content-content = Profil dosyasını buraya <strong>sürükleyi
 Home--compare-recordings-info = Ayrıca kayıtları karşılaştırabilirsiniz. <a>Karşılaştırma arayüzünü aç.</a>
 Home--your-recent-uploaded-recordings-title = Son yüklediğiniz kayıtlar
 Home--install-chrome-extension = Chrome uzantısını yükle
+Home--chrome-extension-instructions = Chrome’daki performans profillerini kaydedip { -profiler-brand-name }’da analiz etmek için <a>Chrome { -profiler-brand-name } uzantısını</a> kullanabilirsiniz. Uzantıyı Chrome Web Store'dan yükleyebilirsiniz.
+Home--chrome-extension-recording-instructions =
+    Uzantıyı yükledikten sonra profillemeyi başlatmak ve durdurmak için uzantının
+    araç çubuğu simgesini veya kısayolları kullanabilirsiniz. İsterseniz
+    profilleri dışa aktarabilir ve ayrıntılı analiz için buraya yükleyebilirsiniz.
 
 ## IdleSearchField
 ## The component that is used for all the search inputs in the application.
@@ -327,6 +355,8 @@ MenuButtons--index--profile-info-uploaded-label = Yüklenme tarihi:
 MenuButtons--index--profile-info-uploaded-actions = Sil
 MenuButtons--index--metaInfo-subtitle = Profil Bilgileri
 MenuButtons--metaInfo--symbols = Semboller:
+MenuButtons--metaInfo--profile-symbolicated = Profil sembolleştirilmiştir
+MenuButtons--metaInfo--symbolicate-profile = Profili sembolleştir
 MenuButtons--metaInfo--cpu-model = İşlemci modeli:
 MenuButtons--metaInfo--cpu-cores = İşlemci çekirdekleri:
 MenuButtons--metaInfo--main-memory = Ana bellek:
@@ -424,10 +454,14 @@ MenuButtons--metaOverheadStatistics-max = Maksimum
 MenuButtons--metaOverheadStatistics-min = Minimum
 MenuButtons--metaOverheadStatistics-statkeys-overhead = Ek yük
     .title = Tüm iş parçacıklarını örnekleme süresi.
+MenuButtons--metaOverheadStatistics-statkeys-cleaning = Temizleme
+    .title = Süresi geçmiş verileri temizleme süresi.
 MenuButtons--metaOverheadStatistics-statkeys-counter = Sayaç
     .title = Tüm sayaçları toplama süresi.
 MenuButtons--metaOverheadStatistics-statkeys-interval = Aralık
     .title = İki örnek arasındaki gözlenen aralık.
+MenuButtons--metaOverheadStatistics-statkeys-lockings = Kilitlemeler
+    .title = Örneklemeden önce kilidi elde etme süresi.
 MenuButtons--metaOverheadStatistics-overhead-duration = Ek yük süreleri:
 MenuButtons--metaOverheadStatistics-overhead-percentage = Ek yük yüzdesi:
 MenuButtons--metaOverheadStatistics-profiled-duration = Profillenen süre:
@@ -581,6 +615,10 @@ ServiceWorkerManager--hide-notice-button =
 
 StackSettings--implementation-all-frames = Tüm çerçeveler
     .title = Yığın çerçevelerini filtreleme
+StackSettings--implementation-script = Betik
+    .title = Yalnızca script çalışmasına ilişkin yığın çerçevelerini göster
+StackSettings--implementation-native2 = Yerel
+    .title = Yalnızca yerel kod için yığın çerçevelerini göster
 # This label is displayed in the marker chart and marker table panels only.
 StackSettings--stack-implementation-label = Yığın filtresi:
 StackSettings--use-data-source-label = Veri kaynağı:

@@ -23,7 +23,7 @@
     "build-symbolicator-cli:quiet": "yarn build:clean && cross-env NODE_ENV=production webpack --config src/symbolicator-cli/webpack.config.js",
     "lint": "node bin/output-fixing-commands.js run-p lint-js lint-css prettier-run",
     "lint-fix": "run-p lint-fix-js lint-fix-css prettier-fix",
-    "lint-js": "node bin/output-fixing-commands.js eslint *.js bin src --report-unused-disable-directives --cache --cache-strategy content",
+    "lint-js": "node bin/output-fixing-commands.js eslint . --report-unused-disable-directives --cache --cache-strategy content",
     "lint-fix-js": "yarn lint-js --fix",
     "lint-css": "node bin/output-fixing-commands.js stylelint \"src/**/*.css\" \"res/**/*.css\"",
     "lint-fix-css": "yarn lint-css --fix",
@@ -34,12 +34,12 @@
     "license-check": "devtools-license-check",
     "preinstall": "node bin/pre-install.js",
     "publish": "rimraf public_html && cp -r dist public_html",
-    "serve-static": "ws -d dist/ -s index.html -p 4242",
+    "serve-static": "ws -d dist/ -s index.html -p 4243",
     "start": "yarn build:clean && cross-env NODE_ENV=development node server.js",
     "start-prod": "yarn build-prod && yarn serve-static",
     "start-l10n": "yarn build:clean && cross-env NODE_ENV=development L10N=1 node server.js",
     "start-l10n-prod": "yarn build-l10n-prod && yarn serve-static",
-    "start-examples": "ws -d examples/ -s index.html -p 4242",
+    "start-examples": "ws -d examples/ -s index.html -p 4244",
     "start-docs": "ws -d docs-user/ -p 3000",
     "start-photon": "node res/photon/server",
     "test": "node bin/output-fixing-commands.js cross-env LC_ALL=C TZ=UTC NODE_ENV=test jest",
@@ -76,7 +76,7 @@
     "classnames": "^2.5.1",
     "common-tags": "^1.8.2",
     "copy-to-clipboard": "^3.3.3",
-    "core-js": "^3.45.0",
+    "core-js": "^3.45.1",
     "escape-string-regexp": "^4.0.0",
     "gecko-profiler-demangle": "^0.3.3",
     "idb": "^8.0.3",
@@ -115,15 +115,14 @@
     "@babel/preset-react": "^7.27.1",
     "@babel/preset-typescript": "^7.27.1",
     "@eslint/js": "^9.34.0",
-    "@fetch-mock/jest": "^0.2.16",
     "@testing-library/dom": "^10.4.1",
-    "@testing-library/jest-dom": "^6.6.4",
+    "@testing-library/jest-dom": "^6.8.0",
     "@testing-library/react": "^16.3.0",
     "@types/clamp": "^1.0.3",
     "@types/common-tags": "^1.8.4",
     "@types/jest": "^30.0.0",
     "@types/minimist": "^1.2.5",
-    "@types/node": "^22.17.2",
+    "@types/node": "^22.18.0",
     "@types/query-string": "^6.3.0",
     "@types/react": "^18.3.24",
     "@types/react-dom": "^18.3.1",
@@ -145,7 +144,7 @@
     "copy-webpack-plugin": "^13.0.1",
     "cross-env": "^10.0.0",
     "css-loader": "^7.1.2",
-    "cssnano": "^7.1.0",
+    "cssnano": "^7.1.1",
     "devtools-license-check": "^0.9.0",
     "eslint": "^9.34.0",
     "eslint-config-prettier": "^10.1.8",
@@ -158,6 +157,7 @@
     "eslint-plugin-testing-library": "^7.6.6",
     "espree": "^10.4.0",
     "fake-indexeddb": "^6.1.0",
+    "fetch-mock": "^12.5.3",
     "file-loader": "^6.2.0",
     "glob": "^11.0.3",
     "globals": "^16.3.0",
@@ -207,7 +207,7 @@
       "tsx"
     ],
     "transformIgnorePatterns": [
-      "/node_modules/(?!(query-string|decode-uri-component|iongraph-web|split-on-first|filter-obj|@fetch-mock/jest|fetch-mock)/)"
+      "/node_modules/(?!(query-string|decode-uri-component|iongraph-web|split-on-first|filter-obj|fetch-mock)/)"
     ],
     "moduleNameMapper": {
       "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga|ftl)$": "<rootDir>/src/test/fixtures/mocks/file-mock.ts",

diff --git a/res/gz-worker.js b/res/gz-worker.js
@@ -0,0 +1,62 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+async function readableStreamToBuffer(stream) {
+  const reader = stream.getReader();
+  const chunks = [];
+
+  try {
+    while (true) {
+      const { done, value } = await reader.read();
+      if (done) break;
+      if (value) {
+        chunks.push(value);
+      }
+    }
+  } finally {
+    reader.releaseLock();
+  }
+
+  // Calculate total length and combine chunks
+  const totalLength = chunks.reduce((sum, chunk) => sum + chunk.length, 0);
+  const result = new Uint8Array(totalLength);
+  let offset = 0;
+  for (const chunk of chunks) {
+    result.set(chunk, offset);
+    offset += chunk.length;
+  }
+
+  return result;
+}
+
+onmessage = async (e) => {
+  let data = e.data;
+  if (data.kind === 'compress') {
+    // Create a gzip compression stream
+    const compressionStream = new CompressionStream('gzip');
+
+    // Write the data to the compression stream
+    const writer = compressionStream.writable.getWriter();
+    writer.write(data.arrayData);
+    writer.close();
+
+    // Read the compressed data back into a buffer
+    let result = await readableStreamToBuffer(compressionStream.readable);
+    postMessage(result, [result.buffer]);
+  } else if (data.kind === 'decompress') {
+    // Create a gzip compression stream
+    const decompressionStream = new DecompressionStream('gzip');
+
+    // Write the data to the compression stream
+    const writer = decompressionStream.writable.getWriter();
+    writer.write(data.arrayData);
+    writer.close();
+
+    // Read the compressed data back into a buffer
+    let result = await readableStreamToBuffer(decompressionStream.readable);
+    postMessage(result, [result.buffer]);
+  } else {
+    throw new Error('unknown message');
+  }
+};
diff --git a/res/index.html b/res/index.html
@@ -7,7 +7,7 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="initial-scale=1" />
     <title>Firefox Profiler</title>
-    <link rel="preload" href="locales/en-US/app.ftl" as="fetch" />
+    <link rel="preload" href="/locales/en-US/app.ftl" as="fetch" />
   </head>
   <body style="background-color: #363959; /* ink-70 */">
     <svg id="svg-filters"></svg>

diff --git a/res/zee-worker.js b/res/zee-worker.js
diff --git a/src/actions/receive-profile.ts b/src/actions/receive-profile.ts
@@ -1065,7 +1065,7 @@ async function _extractZipFromResponse(
 async function _extractJsonFromArrayBuffer(
   arrayBuffer: ArrayBuffer
 ): Promise<unknown> {
-  let profileBytes: Uint8Array<ArrayBufferLike> = new Uint8Array(arrayBuffer);
+  let profileBytes = new Uint8Array(arrayBuffer);
   // Check for the gzip magic number in the header.
   if (isGzip(profileBytes)) {
     profileBytes = await decompress(profileBytes);

diff --git a/src/components/app/BottomBox.css b/src/components/app/BottomBox.css
@@ -72,11 +72,11 @@
 }
 
 .bottom-close-button {
-  background-image: url(/res/img/svg/close-dark.svg);
+  background-image: url(firefox-profiler-res/img/svg/close-dark.svg);
 }
 
 .bottom-assembly-button {
-  background-image: url(/res/img/svg/asm-icon.svg);
+  background-image: url(firefox-profiler-res/img/svg/asm-icon.svg);
 }
 
 .codeLoadingOverlay,
@@ -111,7 +111,8 @@
   width: 32px;
   height: 32px;
   flex-shrink: 0;
-  background: url(/res/img/spinner.png) center center / 32px 32px no-repeat;
+  background: url(firefox-profiler-res/img/spinner.png) center center / 32px
+    32px no-repeat;
   content: '';
 }
 
@@ -122,7 +123,8 @@
   width: 50px;
   height: 50px;
   flex-shrink: 0;
-  background: url(/res/img/svg/error.svg) center center / 32px 32px no-repeat;
+  background: url(firefox-profiler-res/img/svg/error.svg) center center / 32px
+    32px no-repeat;
   content: '';
   filter: brightness(70%) drop-shadow(0 1px rgb(255 255 255 / 0.5));
 }

diff --git a/src/components/app/Details.css b/src/components/app/Details.css
@@ -26,9 +26,9 @@
 }
 
 .sidebar-open-close-button-isopen {
-  background-image: url(../../../res/img/svg/pane-collapse.svg);
+  background-image: url(firefox-profiler-res/img/svg/pane-collapse.svg);
 }
 
 .sidebar-open-close-button-isclosed {
-  background-image: url(../../../res/img/svg/pane-expand.svg);
+  background-image: url(firefox-profiler-res/img/svg/pane-expand.svg);
 }
diff --git a/src/components/app/Home.css b/src/components/app/Home.css
@@ -145,7 +145,7 @@
   width: 20px;
   height: 20px;
   margin: 0 10px -4px 3px;
-  background: url(../../../res/img/svg/help-blue.svg);
+  background: url(firefox-profiler-res/img/svg/help-blue.svg);
   background-size: 100% 100%;
 }
 

diff --git a/src/components/app/KeyboardShortcut.css b/src/components/app/KeyboardShortcut.css
@@ -95,8 +95,8 @@
 
   /* Allow for the photon focus ring to fit in the space by using a 4px margin. */
   margin: 4px;
-  background: url(../../../res/img/svg/searchfield-cancel.svg) 10px center
-    no-repeat;
+  background: url(firefox-profiler-res/img/svg/searchfield-cancel.svg) 10px
+    center no-repeat;
   cursor: pointer;
   font-size: inherit;
 }

diff --git a/src/components/app/ProfileDeleteButton.css b/src/components/app/ProfileDeleteButton.css
@@ -6,8 +6,8 @@
   /* Note: 20px is: 16px (icon width) + 4px (distance from the text) */
   padding-left: 20px;
   margin: 0;
-  background: url(../../../res/img/svg/check-dark.svg) no-repeat left / 16px
-    16px;
+  background: url(firefox-profiler-res/img/svg/check-dark.svg) no-repeat left /
+    16px 16px;
   white-space: nowrap;
 }
 
@@ -16,8 +16,8 @@
   padding-left: 24px;
 
   /* The icon is 4px below the top */
-  background: url(../../../res/img/svg/error-red.svg) no-repeat 0 4px / 16px
-    16px;
+  background: url(firefox-profiler-res/img/svg/error-red.svg) no-repeat 0 4px /
+    16px 16px;
   color: var(--red-60);
   overflow-wrap: break-word;
 }

diff --git a/src/components/app/ProfileViewer.css b/src/components/app/ProfileViewer.css
@@ -80,8 +80,8 @@
   margin: 3px 0 3px 3px;
 
   /* Other */
-  background: var(--green-50) url(../../../res/img/svg/back-arrow.svg) center
-    center no-repeat;
+  background: var(--green-50) url(firefox-profiler-res/img/svg/back-arrow.svg)
+    center center no-repeat;
   color: #000;
 }
 

diff --git a/src/components/calltree/CallTree.css b/src/components/calltree/CallTree.css
@@ -32,5 +32,5 @@
 
 .treeBadge.inlined,
 .treeBadge.divergent-inlining {
-  background: url(../../../res/img/svg/inlined-icon.svg);
+  background: url(firefox-profiler-res/img/svg/inlined-icon.svg);
 }