@parca/profile 0.19.79 → 0.19.81

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.19.81](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.80...@parca/profile@0.19.81) (2025-11-24)
+
+**Note:** Version bump only for package @parca/profile
+
+## [0.19.80](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.79...@parca/profile@0.19.80) (2025-11-20)
+
+**Note:** Version bump only for package @parca/profile
+
 ## [0.19.79](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.78...@parca/profile@0.19.79) (2025-11-19)
 
 **Note:** Version bump only for package @parca/profile

package/dist/MetricsGraph/UtilizationMetrics/Throughput.js

@@ -170,6 +170,6 @@ const AreaChart = ({ transmitData, receiveData, addLabelMatcher, setTimeRange, u
     const contextMenuItems = useMemo(() => {
         return createThroughputContextMenuItems(addLabelMatcher, transmitData, receiveData);
     }, [addLabelMatcher, transmitData, receiveData]);
-    return (_jsx(AnimatePresence, { children: _jsx(motion.div, { className: "w-full relative", initial: { display: 'none', opacity: 0 }, animate: { display: 'block', opacity: 1 }, transition: { duration: 0.5 }, children: utilizationMetricsLoading === true ? (_jsx(MetricsGraphSkeleton, { heightStyle: heightStyle, isDarkMode: isDarkMode, isMini: true })) : (_jsx(RawAreaChart, { transmitData: transmitData, receiveData: receiveData, transformedData: transformedData, addLabelMatcher: addLabelMatcher, setTimeRange: setTimeRange, width: width, height: height, margin: margin, name: name, humanReadableName: humanReadableName, from: from, to: to, selectedSeries: selectedSeries, onSeriesClick: onSeriesClick, contextMenuItems: contextMenuItems })) }, "area-chart-graph-loaded") }));
+    return (_jsx(AnimatePresence, { children: _jsx(motion.div, { className: "w-full relative", initial: false, animate: { display: 'block', opacity: 1 }, transition: { duration: 0.5 }, children: utilizationMetricsLoading === true ? (_jsx(MetricsGraphSkeleton, { heightStyle: heightStyle, isDarkMode: isDarkMode, isMini: true })) : (_jsx(RawAreaChart, { transmitData: transmitData, receiveData: receiveData, transformedData: transformedData, addLabelMatcher: addLabelMatcher, setTimeRange: setTimeRange, width: width, height: height, margin: margin, name: name, humanReadableName: humanReadableName, from: from, to: to, selectedSeries: selectedSeries, onSeriesClick: onSeriesClick, contextMenuItems: contextMenuItems })) }, "area-chart-graph-loaded") }));
 };
 export default AreaChart;

package/dist/MetricsGraph/UtilizationMetrics/index.js

@@ -181,6 +181,6 @@ const UtilizationMetrics = ({ data, setTimeRange, utilizationMetricsLoading, hum
     const contextMenuItems = useMemo(() => {
         return addLabelMatcher != null ? createUtilizationContextMenuItems(addLabelMatcher, data) : [];
     }, [addLabelMatcher, data]);
-    return (_jsx(AnimatePresence, { children: _jsx(motion.div, { className: "w-full relative", initial: { display: 'none', opacity: 0 }, animate: { display: 'block', opacity: 1 }, transition: { duration: 0.5 }, children: utilizationMetricsLoading === true ? (_jsx(MetricsGraphSkeleton, { heightStyle: heightStyle, isDarkMode: isDarkMode, isMini: true })) : (_jsx(RawUtilizationMetrics, { data: transformedData, originalData: data, setTimeRange: setTimeRange, width: width, height: height, margin: margin, humanReadableName: humanReadableName, from: from, to: to, yAxisUnit: yAxisUnit, contextMenuItems: contextMenuItems, onSeriesClick: onSeriesClick })) }, "utilization-metrics-graph-loaded") }));
+    return (_jsx(AnimatePresence, { children: _jsx(motion.div, { className: "w-full relative", initial: false, animate: { display: 'block', opacity: 1 }, transition: { duration: 0.5 }, children: utilizationMetricsLoading === true ? (_jsx(MetricsGraphSkeleton, { heightStyle: heightStyle, isDarkMode: isDarkMode, isMini: true })) : (_jsx(RawUtilizationMetrics, { data: transformedData, originalData: data, setTimeRange: setTimeRange, width: width, height: height, margin: margin, humanReadableName: humanReadableName, from: from, to: to, yAxisUnit: yAxisUnit, contextMenuItems: contextMenuItems, onSeriesClick: onSeriesClick })) }, "utilization-metrics-graph-loaded") }));
 };
 export default UtilizationMetrics;

package/dist/ProfileMetricsGraph/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileMetricsGraph/index.tsx"],"names":[],"mappings":"AAkBA,OAAO,EACL,KAAK,EAGL,kBAAkB,EACnB,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,aAAa,EAId,MAAM,mBAAmB,CAAC;AAK3B,OAAO,EAAyB,gBAAgB,EAAC,MAAM,IAAI,CAAC;AAqH5D,UAAU,6BAA6B;IACrC,OAAO,EAAE,MAAM,CAAC;CACjB;AAaD,eAAO,MAAM,wBAAwB,GAAI,aAAW,6BAA6B,KAAG,GAAG,CAAC,OAMvF,CAAC;AAEF,UAAU,wBAAwB;IAChC,WAAW,EAAE,kBAAkB,CAAC;IAChC,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,OAAO,CAAC;IACtB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,YAAY,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC7C,eAAe,EAAE,CACf,MAAM,EAAE;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,KAAK,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAC,KACvE,IAAI,CAAC;IACV,YAAY,EAAE,CACZ,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,KAAK,EAAE,EACf,eAAe,EAAE,MAAM,EACvB,QAAQ,EAAE,MAAM,KACb,IAAI,CAAC;IACV,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,mBAAmB,GAAI,qHAW1B,wBAAwB,KAAG,GAAG,CAAC,OA+YjC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileMetricsGraph/index.tsx"],"names":[],"mappings":"AAkBA,OAAO,EACL,KAAK,EAGL,kBAAkB,EACnB,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,aAAa,EAId,MAAM,mBAAmB,CAAC;AAK3B,OAAO,EAAyB,gBAAgB,EAAC,MAAM,IAAI,CAAC;AAqH5D,UAAU,6BAA6B;IACrC,OAAO,EAAE,MAAM,CAAC;CACjB;AAaD,eAAO,MAAM,wBAAwB,GAAI,aAAW,6BAA6B,KAAG,GAAG,CAAC,OAMvF,CAAC;AAEF,UAAU,wBAAwB;IAChC,WAAW,EAAE,kBAAkB,CAAC;IAChC,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,OAAO,CAAC;IACtB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,YAAY,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC7C,eAAe,EAAE,CACf,MAAM,EAAE;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,KAAK,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAC,KACvE,IAAI,CAAC;IACV,YAAY,EAAE,CACZ,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,KAAK,EAAE,EACf,eAAe,EAAE,MAAM,EACvB,QAAQ,EAAE,MAAM,KACb,IAAI,CAAC;IACV,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,mBAAmB,GAAI,qHAW1B,wBAAwB,KAAG,GAAG,CAAC,OA+ZjC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/ProfileMetricsGraph/index.js

@@ -142,11 +142,25 @@ const ProfileMetricsGraph = ({ queryClient, queryExpression, profile, from, to,
         if (response?.series != null) {
             // Check if user wants ALL series for THIS specific response
             const userWantsAllForThisResponse = showAllSeriesForResponse === response;
-            // Limit the number of series to 100 to avoid performance issues (unless user opts to show all)
-            if (response.series.length > 100 && !userWantsAllForThisResponse) {
+            const maxSeriesLimit = 100;
+            // Limit the number of series to maxSeriesLimit to avoid performance issues (unless user opts to show all)
+            if (response.series.length > maxSeriesLimit && !userWantsAllForThisResponse) {
+                // Select top `maxSeriesLimit` series based on their max value (to catch series with large spikes)
+                const seriesWithMaxValue = response.series.map(series => {
+                    const maxValue = series.samples.reduce((max, sample) => {
+                        const value = sample.valuePerSecond ?? 0;
+                        return value > max ? value : max;
+                    }, 0);
+                    return { series, maxValue };
+                });
+                // Sort by max value descending and take top `maxSeriesLimit` series
+                const topSeries = seriesWithMaxValue
+                    .sort((a, b) => b.maxValue - a.maxValue)
+                    .slice(0, maxSeriesLimit)
+                    .map(item => item.series);
                 return [
-                    response.series.slice(0, 100),
-                    { isTrimmed: true, beforeTrim: response.series.length, afterTrim: 100 },
+                    topSeries,
+                    { isTrimmed: true, beforeTrim: response.series.length, afterTrim: maxSeriesLimit },
                 ];
             }
             return [response.series, { isTrimmed: false, beforeTrim: 0, afterTrim: 0 }];

package/dist/ProfileSelector/MetricsGraphSection.js

@@ -103,7 +103,7 @@ export function MetricsGraphSection({ showMetricsGraph, setDisplayHideMetricsGra
                             } }, name));
                     }
                     return null;
-                }), throughputMetrics.length > 0 && (_jsx(AreaChart, { transmitData: transmitData, receiveData: receiveData, addLabelMatcher: addLabelMatcher, setTimeRange: handleTimeRangeChange, name: throughputMetrics[0].name, humanReadableName: throughputMetrics[0].humanReadableName, from: querySelection.from, to: querySelection.to, utilizationMetricsLoading: utilizationMetricsLoading, selectedSeries: undefined, onSeriesClick: (name, seriesIndex) => {
+                }), throughputMetrics.length > 0 && (_jsx(AreaChart, { transmitData: transmitData, receiveData: receiveData, addLabelMatcher: addLabelMatcher, setTimeRange: handleTimeRangeChange, name: throughputMetrics[0].name, humanReadableName: throughputMetrics[0].humanReadableName, from: querySelection.from, to: querySelection.to, utilizationMetricsLoading: utilizationMetricsLoading, selectedSeries: undefined, onSeriesClick: (_, seriesIndex) => {
                         // For throughput metrics, just pass the series index
                         if (onUtilizationSeriesSelect != null) {
                             let name = 'gpu_pcie_throughput_transmit_bytes';

package/dist/ProfileView/components/ProfileFilters/filterPresets.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"filterPresets.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ProfileFilters/filterPresets.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAEvD,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC,CAAC;IAC1C,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;CAChC;AAED,eAAO,MAAM,aAAa,EAAE,YAAY,EA6IvC,CAAC;AAIF,eAAO,MAAM,WAAW,GAAI,KAAK,MAAM,KAAG,OAEzC,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,KAAK,MAAM,KAAG,YAAY,GAAG,SAE3D,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAI,cAAc,MAAM,KAAG,YAAY,EAO3E,CAAC"}
+{"version":3,"file":"filterPresets.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ProfileFilters/filterPresets.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAEvD,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC,CAAC;IAC1C,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;CAChC;AAED,eAAO,MAAM,aAAa,EAAE,YAAY,EAyJvC,CAAC;AAIF,eAAO,MAAM,WAAW,GAAI,KAAK,MAAM,KAAG,OAEzC,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,KAAK,MAAM,KAAG,YAAY,GAAG,SAE3D,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAI,cAAc,MAAM,KAAG,YAAY,EAO3E,CAAC"}

package/dist/ProfileView/components/ProfileFilters/filterPresets.js

@@ -97,19 +97,31 @@ export const filterPresets = [
                 type: 'frame',
                 field: 'binary',
                 matchType: 'not_contains',
-                value: 'libparcgpcupti.so',
+                value: 'libcudart.so',
             },
             {
                 type: 'frame',
                 field: 'binary',
                 matchType: 'not_contains',
-                value: 'libcudart.so',
+                value: 'libcuda.so',
             },
             {
                 type: 'frame',
                 field: 'binary',
                 matchType: 'not_contains',
-                value: 'libcuda.so',
+                value: 'libcudnn.so',
+            },
+            {
+                type: 'frame',
+                field: 'binary',
+                matchType: 'not_contains',
+                value: 'libcudnn_graph.so',
+            },
+            {
+                type: 'frame',
+                field: 'binary',
+                matchType: 'not_contains',
+                value: 'libparcagpucupti.so',
             },
         ],
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parca/profile",
-  "version": "0.19.79",
+  "version": "0.19.81",
   "description": "Profile viewing libraries",
   "dependencies": {
     "@floating-ui/react": "^0.27.12",
@@ -79,5 +79,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "a16568e3b3edb645958372f4e0e4d76fa4fc5408"
+  "gitHead": "13b76b4d7b3667414d84855eb7ba55cab034a3e1"
 }

package/src/MetricsGraph/UtilizationMetrics/Throughput.tsx

@@ -372,7 +372,7 @@ const AreaChart = ({
       <motion.div
         className="w-full relative"
         key="area-chart-graph-loaded"
-        initial={{display: 'none', opacity: 0}}
+        initial={false}
         animate={{display: 'block', opacity: 1}}
         transition={{duration: 0.5}}
       >

package/src/MetricsGraph/UtilizationMetrics/index.tsx

@@ -396,7 +396,7 @@ const UtilizationMetrics = ({
       <motion.div
         className="w-full relative"
         key="utilization-metrics-graph-loaded"
-        initial={{display: 'none', opacity: 0}}
+        initial={false}
         animate={{display: 'block', opacity: 1}}
         transition={{duration: 0.5}}
       >

package/src/ProfileMetricsGraph/index.tsx

@@ -239,12 +239,28 @@ const ProfileMetricsGraph = ({
     if (response?.series != null) {
       // Check if user wants ALL series for THIS specific response
       const userWantsAllForThisResponse = showAllSeriesForResponse === response;
+      const maxSeriesLimit = 100;
+
+      // Limit the number of series to maxSeriesLimit to avoid performance issues (unless user opts to show all)
+      if (response.series.length > maxSeriesLimit && !userWantsAllForThisResponse) {
+        // Select top `maxSeriesLimit` series based on their max value (to catch series with large spikes)
+        const seriesWithMaxValue = response.series.map(series => {
+          const maxValue = series.samples.reduce((max, sample) => {
+            const value = sample.valuePerSecond ?? 0;
+            return value > max ? value : max;
+          }, 0);
+          return {series, maxValue};
+        });
+
+        // Sort by max value descending and take top `maxSeriesLimit` series
+        const topSeries = seriesWithMaxValue
+          .sort((a, b) => b.maxValue - a.maxValue)
+          .slice(0, maxSeriesLimit)
+          .map(item => item.series);
 
-      // Limit the number of series to 100 to avoid performance issues (unless user opts to show all)
-      if (response.series.length > 100 && !userWantsAllForThisResponse) {
         return [
-          response.series.slice(0, 100),
-          {isTrimmed: true, beforeTrim: response.series.length, afterTrim: 100},
+          topSeries,
+          {isTrimmed: true, beforeTrim: response.series.length, afterTrim: maxSeriesLimit},
         ];
       }
       return [response.series, {isTrimmed: false, beforeTrim: 0, afterTrim: 0}];

package/src/ProfileSelector/MetricsGraphSection.tsx

@@ -213,7 +213,7 @@ export function MetricsGraphSection({
             to={querySelection.to}
             utilizationMetricsLoading={utilizationMetricsLoading}
             selectedSeries={undefined}
-            onSeriesClick={(name, seriesIndex) => {
+            onSeriesClick={(_, seriesIndex) => {
               // For throughput metrics, just pass the series index
               if (onUtilizationSeriesSelect != null) {
                 let name = 'gpu_pcie_throughput_transmit_bytes';

package/src/ProfileView/components/ProfileFilters/filterPresets.ts

@@ -108,19 +108,31 @@ export const filterPresets: FilterPreset[] = [
         type: 'frame',
         field: 'binary',
         matchType: 'not_contains',
-        value: 'libparcgpcupti.so',
+        value: 'libcudart.so',
       },
       {
         type: 'frame',
         field: 'binary',
         matchType: 'not_contains',
-        value: 'libcudart.so',
+        value: 'libcuda.so',
       },
       {
         type: 'frame',
         field: 'binary',
         matchType: 'not_contains',
-        value: 'libcuda.so',
+        value: 'libcudnn.so',
+      },
+      {
+        type: 'frame',
+        field: 'binary',
+        matchType: 'not_contains',
+        value: 'libcudnn_graph.so',
+      },
+      {
+        type: 'frame',
+        field: 'binary',
+        matchType: 'not_contains',
+        value: 'libparcagpucupti.so',
       },
     ],
   },