[Lens] Add lens editor performance metrics #163089

drewdaemon · 2023-08-03T15:08:15Z

Summary

This PR instruments the code to track a few key editor performance metrics. This is to prepare for adding a Lens editor performance journey.

Metrics

initial load of main chart
- time to load data
- time to render
time to initially load and render all suggestions

For this PR, each metric is reported to the console (commented out to pass the linter). When the journey is added, the console statements will be converted to analytics service calls so that they show up as metrics in the journey dashboard.

I made a few changes to increase the accuracy of the metrics.

wrapping render-complete callbacks in requestAnimationFrame calls as a temporary solution to Render reported before complete elastic-charts#2124
fixing a multiple-subscription issue in the workspace panel

drewdaemon · 2023-08-03T15:30:12Z

...ck/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel.tsx

+  const onRenderHandler = useCallback(() => {
+    setIsRenderComplete(true);
+    onRender$();
+  }, [setIsRenderComplete, onRender$]);


Important to memoize—multiple subscriptions in useExpressionRenderer hook were being created which led to multiple calls to onRender$.

drewdaemon · 2023-08-03T16:55:33Z

x-pack/plugins/lens/public/editor_frame_service/editor_frame/suggestion_panel.tsx

+      // console.log(
+      //   'time to fetch data and perform initial render for all suggestions',
+      //   performance.now() - startTime.current
+      // );


uncomment for review

drewdaemon · 2023-08-03T16:56:10Z

...ck/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel.tsx

@@ -138,6 +138,10 @@ export const WorkspacePanel = React.memo(function WorkspacePanel(props: Workspac
  );
 });

+const log = (...messages: Array<string | number>) => {
+  // console.log(...messages);


uncomment for review

elasticmachine · 2023-08-04T01:08:42Z

Pinging @elastic/kibana-visualizations @elastic/kibana-visualizations-external (Team:Visualizations)

stratoula

This looks great Drew, LGTM!

mbondyra

Amazing work! That's a great start, thanks!

kibana-ci · 2023-08-07T17:18:29Z

💚 Build Succeeded

Buildkite Build
Commit: 23ee3ad

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
`expressionGauge`	18.7KB	18.8KB	+38.0B
`expressionHeatmap`	26.5KB	26.6KB	+38.0B
`expressionMetricVis`	4.6KB	4.6KB	+38.0B
`expressionPartitionVis`	31.2KB	31.2KB	+36.0B
`expressionTagcloud`	15.1KB	15.2KB	+38.0B
`expressionXY`	121.6KB	121.6KB	+38.0B
`lens`	1.4MB	1.4MB	+614.0B
total			+840.0B

Unknown metric groups

ESLint disabled line counts

id	before	after	diff
`lens`	15	16	+1

Total ESLint disabled count

id	before	after	diff
`lens`	16	17	+1

History

💚 Build #147776 succeeded 83b09a9
💚 Build #147384 succeeded f19dd13
💔 Build #147275 failed bff8f62

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

ninoslavmiskovic · 2023-08-08T06:49:59Z

This is great 👍 can't wait to see the performance and set a baseline.

## Summary This PR instruments the code to track a few key editor performance metrics. This is to prepare for adding a Lens editor performance journey. Metrics - initial load of main chart - time to load data - time to render - time to initially load and render all suggestions For this PR, each metric is reported to the console (commented out to pass the linter). When the journey is added, the console statements will be converted to analytics service calls so that they show up as metrics in the journey dashboard. I made a few changes to increase the accuracy of the metrics. - wrapping render-complete callbacks in `requestAnimationFrame` calls as a temporary solution to elastic/elastic-charts#2124 - fixing a multiple-subscription issue in the workspace panel --------- Co-authored-by: Stratoula Kalafateli <[email protected]>

…zation and suggestions panel (#163412) ## Summary Related to #163089 Adding the first performance journey for the Lens Editor. It simulated loading existing Lens visualisation with data view having 10k fields. We collect the following metrics: - `fetchFieldsExistenceInfo` reports time it takes to fetch fields in Data Panel - `lensVisualizationRenderTime` reports both time it takes to fetch the data (`time_to_data`) and render the main visualization (`time_to_render`) - `lensSuggestionsRenderTime` reports time it takes to render suggestions panel Metrics consistency <img width="568" alt="image" src="https://github.com/elastic/kibana/assets/10977896/3384bb8e-6152-4bae-93dc-4f7f4167ed07"> Run locally with ``` node scripts/functional_tests --config x-pack/performance/journeys/many_fields_lens_editor.ts ``` Metrics will be available here https://telemetry-v2-staging.elastic.dev/s/kibana-performance/app/dashboards#/view/dd0473ac-826f-5621-9a10-25319700326e?_g=h@61c5ac8 --------- Co-authored-by: Drew Tate <[email protected]>

…zation and suggestions panel (elastic#163412) ## Summary Related to elastic#163089 Adding the first performance journey for the Lens Editor. It simulated loading existing Lens visualisation with data view having 10k fields. We collect the following metrics: - `fetchFieldsExistenceInfo` reports time it takes to fetch fields in Data Panel - `lensVisualizationRenderTime` reports both time it takes to fetch the data (`time_to_data`) and render the main visualization (`time_to_render`) - `lensSuggestionsRenderTime` reports time it takes to render suggestions panel Metrics consistency <img width="568" alt="image" src="https://github.com/elastic/kibana/assets/10977896/3384bb8e-6152-4bae-93dc-4f7f4167ed07"> Run locally with ``` node scripts/functional_tests --config x-pack/performance/journeys/many_fields_lens_editor.ts ``` Metrics will be available here https://telemetry-v2-staging.elastic.dev/s/kibana-performance/app/dashboards#/view/dd0473ac-826f-5621-9a10-25319700326e?_g=h@61c5ac8 --------- Co-authored-by: Drew Tate <[email protected]> (cherry picked from commit 15b118c)

…visualization and suggestions panel (#163412) (#164153) # Backport This will backport the following commits from `main` to `8.10`: - [[Lens] add performance journey to track rendering time for XY visualization and suggestions panel (#163412)](#163412)  ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport)  Co-authored-by: Dzmitry Lemechko <[email protected]>

drewdaemon added 6 commits August 3, 2023 08:18

measure main visualization data and render times

230a39c

improve main visualization metrics

52f5b7f

measure suggestion loading time

478bc14

improve render measurement

b7d903e

wait a tick to report render

d7095c2

update messaging

77b1065

drewdaemon changed the title ~~Add lens editor performance metrics~~ [Lens] Add lens editor performance metrics Aug 3, 2023

drewdaemon commented Aug 3, 2023

View reviewed changes

drewdaemon added Team:Visualizations Visualization editors, elastic-charts and infrastructure Feature:Lens performance labels Aug 3, 2023

drewdaemon added 3 commits August 3, 2023 10:04

remove suggestion loading improvement

aeafebe

only report the metrics once

bfb92f4

fix type error

7bfd784

drewdaemon commented Aug 3, 2023

View reviewed changes

Update workspace_panel.tsx

84c0ec8

elastic deleted a comment from kibana-ci Aug 3, 2023

drewdaemon added 2 commits August 3, 2023 11:14

make visualization metric work when vis created from empty workspace

bff8f62

fix failing test

f19dd13

drewdaemon marked this pull request as ready for review August 4, 2023 01:08

drewdaemon requested review from a team as code owners August 4, 2023 01:08

drewdaemon added the release_note:skip Skip the PR/issue when compiling release notes label Aug 4, 2023

Merge branch 'main' into add-lens-editor-performance-metrics

83b09a9

stratoula approved these changes Aug 7, 2023

View reviewed changes

mbondyra approved these changes Aug 7, 2023

View reviewed changes

Update suggestion_panel.scss

23ee3ad

drewdaemon removed the request for review from a team August 7, 2023 16:12

mistic merged commit c6df737 into elastic:main Aug 7, 2023
19 of 20 checks passed

kibanamachine added v8.10.0 backport:skip This commit does not require backporting labels Aug 7, 2023

dmlemeshko mentioned this pull request Aug 8, 2023

[Lens] add performance journey to track rendering time for XY visualization and suggestions panel #163412

Merged

dmlemeshko mentioned this pull request Dec 29, 2023

[infra] hosts table metrics #173708

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Lens] Add lens editor performance metrics #163089

[Lens] Add lens editor performance metrics #163089

drewdaemon commented Aug 3, 2023 •

edited

Loading

drewdaemon Aug 3, 2023

drewdaemon Aug 3, 2023

drewdaemon Aug 3, 2023

elasticmachine commented Aug 4, 2023

stratoula left a comment

mbondyra left a comment

kibana-ci commented Aug 7, 2023

ESLint disabled line counts

Total ESLint disabled count

ninoslavmiskovic commented Aug 8, 2023

[Lens] Add lens editor performance metrics #163089

[Lens] Add lens editor performance metrics #163089

Conversation

drewdaemon commented Aug 3, 2023 • edited Loading

Summary

drewdaemon Aug 3, 2023

Choose a reason for hiding this comment

drewdaemon Aug 3, 2023

Choose a reason for hiding this comment

drewdaemon Aug 3, 2023

Choose a reason for hiding this comment

elasticmachine commented Aug 4, 2023

stratoula left a comment

Choose a reason for hiding this comment

mbondyra left a comment

Choose a reason for hiding this comment

kibana-ci commented Aug 7, 2023

💚 Build Succeeded

Metrics [docs]

Async chunks

ESLint disabled line counts

Total ESLint disabled count

History

ninoslavmiskovic commented Aug 8, 2023

drewdaemon commented Aug 3, 2023 •

edited

Loading