Deploy January 27, 2026

.gitignore

@@ -12,3 +12,4 @@ coverage
 webpack.local-config.js
 *.orig
 *.rej
+.idea/

docs-user/guide-filtering-call-trees.md

@@ -74,6 +74,18 @@ Merging takes a call node and removes it from the call tree. Any self time for t
 
 Focusing on a function or call node removes all of the ancestor call nodes—the children call nodes remain. If a stack does not contain that function or node, then it is removed. This effectively focuses on a subtree or a set of subtrees on the call tree.
 
+### Focus on Function Self
+
+Focus on function self is similar to focus on function, but more restrictive: it only keeps samples where the focused function is the innermost implementation-filtered frame. This helps you analyze where within a function the self time is being spent, by removing samples where the function is calling other code.
+
+For example, if you focus-self on a JavaScript function with the JS implementation filter, you'll only see samples where that JS function has self time, and any native (C++) calls below it will be shown as descendants. This is particularly useful for:
+
+- Finding which parts of a function are slow (by looking at the assembly or source lines)
+- Understanding what engine internals are being called by a JS function (by switching implementation filter after focusing)
+- Eliminating noise from code your function calls, to concentrate on the function's own execution
+
+If the same function appears multiple times in a stack (recursion), only the innermost instance is kept as the root.
+
 ### Focus on Category
 
 Focusing on the nodes that belong to the same category as the selected node, thereby merging all nodes that belong to another category.

eslint.config.mjs

@@ -1,6 +1,7 @@
+import { defineConfig } from 'eslint/config';
 import js from '@eslint/js';
+import tseslint from 'typescript-eslint';
 import tsParser from '@typescript-eslint/parser';
-import tsPlugin from '@typescript-eslint/eslint-plugin';
 import babelPlugin from '@babel/eslint-plugin';
 import reactPlugin from 'eslint-plugin-react';
 import importPlugin from 'eslint-plugin-import';
@@ -11,7 +12,7 @@ import jestDomPlugin from 'eslint-plugin-jest-dom';
 import prettierConfig from 'eslint-config-prettier';
 import globals from 'globals';
 
-export default [
+export default defineConfig(
   // Global ignores
   {
     ignores: [
@@ -27,8 +28,8 @@ export default [
   // Base JavaScript config
   js.configs.recommended,
 
-  // TypeScript config
-  ...tsPlugin.configs['flat/recommended'],
+  // TypeScript config with type checking
+  ...tseslint.configs.recommendedTypeChecked,
 
   // React config
   reactPlugin.configs.flat.recommended,
@@ -50,6 +51,7 @@ export default [
         ecmaFeatures: {
           jsx: true,
         },
+        // Note: projectService is enabled for TypeScript files only, below
       },
     },
     plugins: {
@@ -178,6 +180,32 @@ export default [
         },
       ],
       '@typescript-eslint/no-require-imports': 'off',
+
+      // Disable "no-unsafe" checks which complain about using "any" freely.
+      '@typescript-eslint/no-unsafe-member-access': 'off',
+      '@typescript-eslint/no-unsafe-assignment': 'off',
+      '@typescript-eslint/no-unsafe-call': 'off',
+      '@typescript-eslint/no-unsafe-argument': 'off',
+      '@typescript-eslint/no-unsafe-return': 'off',
+
+      // Disable this one due to false positives when narrowing return types,
+      // see https://github.com/typescript-eslint/typescript-eslint/issues/6951
+      // (it can make `yarn ts` fail after `yarn lint-fix`)
+      '@typescript-eslint/no-unnecessary-type-assertion': 'off',
+
+      // Consider enabling these in the future
+      '@typescript-eslint/unbound-method': 'off',
+      '@typescript-eslint/only-throw-error': 'off',
+      '@typescript-eslint/no-floating-promises': 'off',
+      '@typescript-eslint/require-await': 'off',
+      '@typescript-eslint/no-redundant-type-constituents': 'off',
+      '@typescript-eslint/no-misused-promises': 'off',
+      '@typescript-eslint/await-thenable': 'off',
+      '@typescript-eslint/restrict-plus-operands': 'off',
+      '@typescript-eslint/no-base-to-string': 'off',
+      '@typescript-eslint/restrict-template-expressions': 'off',
+      '@typescript-eslint/prefer-promise-reject-errors': 'off',
+      '@typescript-eslint/no-array-delete': 'off',
     },
     linterOptions: {
       // This property is specified both here in addition to the command line in
@@ -189,7 +217,27 @@ export default [
     },
   },
 
-  // Source files - enable stricter TypeScript rules
+  // Enable type-aware lints for TypeScript files.
+  {
+    files: ['**/*.ts', '**/*.tsx'],
+    languageOptions: {
+      parserOptions: {
+        projectService: true,
+        tsconfigRootDir: import.meta.dirname,
+      },
+    },
+  },
+
+  // Explicitly disable type-aware rules for JS files, to avoid the following error:
+  // > You have used a rule which requires type information, but don't have
+  // > parserOptions set to generate type information for this file.
+  {
+    files: ['**/*.js', '**/*.mjs', '**/*.cjs'],
+    ...tseslint.configs.disableTypeChecked,
+  },
+
+  // For non-test files, only allow import, no require(). (For test files we
+  // allow require() because we use it for JSON fixtures.)
   {
     files: ['src/**/*.ts', 'src/**/*.tsx'],
     rules: {
@@ -266,5 +314,5 @@ export default [
   },
 
   // Prettier config (must be last to override other formatting rules)
-  prettierConfig,
-];
+  prettierConfig
+);

jest-resolver.js

@@ -0,0 +1,57 @@
+/* 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/. */
+
+// Custom Jest resolver that respects the "browser" field in package.json
+// This allows tests to use browser implementations instead of Node.js implementations
+//
+// Set JEST_ENVIRONMENT=node to use Node.js implementations (default: browser)
+
+const fs = require('fs');
+const path = require('path');
+
+// Determine environment mode: "browser" or "node"
+const USE_BROWSER = process.env.JEST_ENVIRONMENT !== 'node';
+
+// Read package.json once at module load time
+const PROJECT_ROOT = __dirname;
+const BROWSER_MAPPINGS = parseBrowserMappingsFromPackageJson(PROJECT_ROOT);
+
+module.exports = (request, options) => {
+  const resolved = options.defaultResolver(request, options);
+
+  if (USE_BROWSER) {
+    return BROWSER_MAPPINGS[resolved] ?? resolved;
+  }
+
+  return resolved;
+};
+
+function parseBrowserMappingsFromPackageJson(projectRoot) {
+  const browserMappings = {};
+  const packageJsonPath = path.join(projectRoot, 'package.json');
+  try {
+    const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
+    const browserField = packageJson.browser;
+
+    if (browserField && typeof browserField === 'object') {
+      // Pre-validate all browser mappings and convert to absolute paths
+      for (const [source, target] of Object.entries(browserField)) {
+        const absoluteSource = path.resolve(projectRoot, source);
+        const absoluteTarget = path.resolve(projectRoot, target);
+
+        if (!fs.existsSync(absoluteTarget)) {
+          console.warn(
+            `Warning: Browser mapping target does not exist: ${target}`
+          );
+          continue;
+        }
+
+        browserMappings[absoluteSource] = absoluteTarget;
+      }
+    }
+  } catch (error) {
+    console.error(`Error reading package.json for browser field: ${error}`);
+  }
+  return browserMappings;
+}

jest.config.js

@@ -6,6 +6,9 @@ module.exports = {
   testMatch: ['<rootDir>/src/**/*.test.{js,jsx,ts,tsx}'],
   moduleFileExtensions: ['js', 'jsx', 'ts', 'tsx'],
 
+  // Use custom resolver that respects the "browser" field in package.json
+  resolver: './jest-resolver.js',
+
   testEnvironment: './src/test/custom-environment',
   setupFilesAfterEnv: ['jest-extended/all', './src/test/setup.ts'],
 

locales/be/app.ftl

@@ -407,6 +407,13 @@ MarkerContextMenu--select-the-sender-thread = Выберыце паток-адп
 #   $filter (String) - Search string that will be used to filter the markers.
 MarkerFiltersContextMenu--drop-samples-outside-of-markers-matching = Адкідваць сэмплы па-за межамі маркераў, якія адпавядаюць «<strong>{ $filter }</strong>»
 
+## MarkerCopyTableContextMenu
+## This is the menu when the copy icon is clicked in Marker Chart and Marker
+## Table panels.
+
+MarkerCopyTableContextMenu--copy-table-as-plain = Скапіяваць табліцу маркераў як звычайны тэкст
+MarkerCopyTableContextMenu--copy-table-as-markdown = Скапіяваць табліцу маркераў як Markdown
+
 ## MarkerSettings
 ## This is used in all panels related to markers.
 
@@ -415,6 +422,14 @@ MarkerSettings--panel-search =
     .title = Паказваць толькі маркеры, якія адпавядаюць пэўнаму імені
 MarkerSettings--marker-filters =
     .title = Фільтры маркераў
+MarkerSettings--copy-table =
+    .title = Скапіяваць табліцу як тэкст
+# This string is used when the user tries to copy a marker table with
+# more than 10000 rows.
+# Variable:
+#   $rows (Number) - Number of rows the marker table has
+#   $maxRows (Number) - Number of maximum rows that can be copied
+MarkerSettings--copy-table-exceeed-max-rows = Колькасць радкоў перавышае ліміт: { $rows } > { $maxRows }. Будуць скапіяваныя толькі першыя ({ $maxRows }) радкі.
 
 ## MarkerSidebar
 ## This is the sidebar component that is used in Marker Table panel.
@@ -535,6 +550,8 @@ MenuButtons--metaInfo--profiling-started = Запіс пачаўся:
 MenuButtons--metaInfo--profiling-session = Працягласць запісу:
 MenuButtons--metaInfo--main-process-started = Асноўны працэс пачаўся:
 MenuButtons--metaInfo--main-process-ended = Асноўны працэс скончыўся:
+MenuButtons--metaInfo--file-name = Назва файла:
+MenuButtons--metaInfo--file-size = Памер файла:
 MenuButtons--metaInfo--interval = Інтэрвал:
 MenuButtons--metaInfo--buffer-capacity = Ёмістасць буфера:
 MenuButtons--metaInfo--buffer-duration = Працягласць буфера:

locales/de/app.ftl

@@ -315,6 +315,7 @@ Home--additional-content-title = Bestehende Profile laden
 Home--additional-content-content = Sie können eine Profildatei per <strong>Ziehen und Ablegen</strong> hierher bewegen, um sie zu laden, oder:
 Home--compare-recordings-info = Sie können auch Aufnahmen vergleichen. <a>Öffnen Sie die Vergleichsschnittstelle.</a>
 Home--your-recent-uploaded-recordings-title = Ihre kürzlich hochgeladenen Aufzeichnungen
+Home--dark-mode-title = Dunkler Modus
 # We replace the elements such as <perf> and <simpleperf> with links to the
 # documentation to use these tools.
 Home--load-files-from-other-tools2 =
@@ -405,6 +406,13 @@ MarkerContextMenu--select-the-sender-thread = Absender-Thread „<strong>{ $thre
 #   $filter (String) - Search string that will be used to filter the markers.
 MarkerFiltersContextMenu--drop-samples-outside-of-markers-matching = Stichproben außerhalb der Markierungen verwerfen, die mit „<strong>{ $filter }</strong>“ übereinstimmen
 
+## MarkerCopyTableContextMenu
+## This is the menu when the copy icon is clicked in Marker Chart and Marker
+## Table panels.
+
+MarkerCopyTableContextMenu--copy-table-as-plain = Markierungstabelle als Reintext kopieren
+MarkerCopyTableContextMenu--copy-table-as-markdown = Markierungstabelle als Markdown kopieren
+
 ## MarkerSettings
 ## This is used in all panels related to markers.
 
@@ -413,6 +421,14 @@ MarkerSettings--panel-search =
     .title = Nur Markierungen anzeigen, die zu einem bestimmten Namen passen
 MarkerSettings--marker-filters =
     .title = Filter für Markierungen
+MarkerSettings--copy-table =
+    .title = Tabelle als Text kopieren
+# This string is used when the user tries to copy a marker table with
+# more than 10000 rows.
+# Variable:
+#   $rows (Number) - Number of rows the marker table has
+#   $maxRows (Number) - Number of maximum rows that can be copied
+MarkerSettings--copy-table-exceeed-max-rows = Die Anzahl der Zeilen überschreitet das Limit: { $rows } > { $maxRows }. Nur die ersten { $maxRows } Zeilen werden kopiert.
 
 ## MarkerSidebar
 ## This is the sidebar component that is used in Marker Table panel.
@@ -1139,6 +1155,17 @@ AssemblyView--show-button =
 # Assembly refers to the low-level programming language.
 AssemblyView--hide-button =
     .title = Assembly-Ansicht ausblenden
+# The "◀" button above the assembly view.
+AssemblyView--prev-button =
+    .title = Zurück
+# The "▶" button above the assembly view.
+AssemblyView--next-button =
+    .title = Weiter
+# 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 } von { $total }
 
 ## UploadedRecordingsHome
 ## This is the page that displays all the profiles that user has uploaded.

locales/el/app.ftl

@@ -432,6 +432,8 @@ MarkerSettings--panel-search =
     .title = Εμφάνιση μόνο των σημαδιών που αντιστοιχούν σε ένα συγκεκριμένο όνομα
 MarkerSettings--marker-filters =
     .title = Φίλτρα δείκτη
+MarkerSettings--copy-table =
+    .title = Αντιγραφή πίνακα ως κειμένου
 
 ## MarkerSidebar
 ## This is the sidebar component that is used in Marker Table panel.

locales/en-CA/app.ftl

@@ -337,6 +337,7 @@ Home--additional-content-title = Load existing profiles
 Home--additional-content-content = You can <strong>drag and drop</strong> a profile file here to load it, or:
 Home--compare-recordings-info = You can also compare recordings. <a>Open the comparing interface.</a>
 Home--your-recent-uploaded-recordings-title = Your recent uploaded recordings
+Home--dark-mode-title = Dark mode
 # We replace the elements such as <perf> and <simpleperf> with links to the
 # documentation to use these tools.
 Home--load-files-from-other-tools2 =
@@ -429,6 +430,13 @@ MarkerContextMenu--select-the-sender-thread = Select the sender thread “<stron
 #   $filter (String) - Search string that will be used to filter the markers.
 MarkerFiltersContextMenu--drop-samples-outside-of-markers-matching = Drop samples outside of markers matching “<strong>{ $filter }</strong>”
 
+## MarkerCopyTableContextMenu
+## This is the menu when the copy icon is clicked in Marker Chart and Marker
+## Table panels.
+
+MarkerCopyTableContextMenu--copy-table-as-plain = Copy marker table as plain text
+MarkerCopyTableContextMenu--copy-table-as-markdown = Copy marker table as Markdown
+
 ## MarkerSettings
 ## This is used in all panels related to markers.
 
@@ -437,6 +445,14 @@ MarkerSettings--panel-search =
     .title = Only display markers that match a certain name
 MarkerSettings--marker-filters =
     .title = Marker Filters
+MarkerSettings--copy-table =
+    .title = Copy table as text
+# This string is used when the user tries to copy a marker table with
+# more than 10000 rows.
+# Variable:
+#   $rows (Number) - Number of rows the marker table has
+#   $maxRows (Number) - Number of maximum rows that can be copied
+MarkerSettings--copy-table-exceeed-max-rows = The number of rows exceeds the limit: { $rows } > { $maxRows }. Only the first { $maxRows } rows will be copied.
 
 ## MarkerSidebar
 ## This is the sidebar component that is used in Marker Table panel.

locales/en-GB/app.ftl

@@ -337,6 +337,7 @@ Home--additional-content-title = Load existing profiles
 Home--additional-content-content = You can <strong>drag and drop</strong> a profile file here to load it, or:
 Home--compare-recordings-info = You can also compare recordings. <a>Open the comparing interface.</a>
 Home--your-recent-uploaded-recordings-title = Your recent uploaded recordings
+Home--dark-mode-title = Dark mode
 # We replace the elements such as <perf> and <simpleperf> with links to the
 # documentation to use these tools.
 Home--load-files-from-other-tools2 =
@@ -429,6 +430,13 @@ MarkerContextMenu--select-the-sender-thread = Select the sender thread “<stron
 #   $filter (String) - Search string that will be used to filter the markers.
 MarkerFiltersContextMenu--drop-samples-outside-of-markers-matching = Drop samples outside of markers matching “<strong>{ $filter }</strong>”
 
+## MarkerCopyTableContextMenu
+## This is the menu when the copy icon is clicked in Marker Chart and Marker
+## Table panels.
+
+MarkerCopyTableContextMenu--copy-table-as-plain = Copy marker table as plain text
+MarkerCopyTableContextMenu--copy-table-as-markdown = Copy marker table as Markdown
+
 ## MarkerSettings
 ## This is used in all panels related to markers.
 
@@ -437,6 +445,14 @@ MarkerSettings--panel-search =
     .title = Only display markers that match a certain name
 MarkerSettings--marker-filters =
     .title = Marker Filters
+MarkerSettings--copy-table =
+    .title = Copy table as text
+# This string is used when the user tries to copy a marker table with
+# more than 10000 rows.
+# Variable:
+#   $rows (Number) - Number of rows the marker table has
+#   $maxRows (Number) - Number of maximum rows that can be copied
+MarkerSettings--copy-table-exceeed-max-rows = The number of rows exceeds the limit: { $rows } > { $maxRows }. Only the first { $maxRows } rows will be copied.
 
 ## MarkerSidebar
 ## This is the sidebar component that is used in Marker Table panel.
@@ -1163,6 +1179,17 @@ AssemblyView--show-button =
 # Assembly refers to the low-level programming language.
 AssemblyView--hide-button =
     .title = Hide the assembly view
+# The "◀" button above the assembly view.
+AssemblyView--prev-button =
+    .title = Previous
+# The "▶" button above the assembly view.
+AssemblyView--next-button =
+    .title = Next
+# 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 } of { $total }
 
 ## UploadedRecordingsHome
 ## This is the page that displays all the profiles that user has uploaded.