[Reporting/Dashboard] Use Chromium for print-optimized PDFs #130546

jloleysens · 2022-04-19T11:30:19Z

Summary

It is possible to request a "print-optimized" PDF from dashboard (our most popular app for making print-focussed reports). Today we use a native NPM dependency instead of Chromium for generating the PDF. We can improve performance of generating these PDFs by leveraging the print functionality native to browsers since we are already using headless Chromium.

Screenshots

Note: header and footers are included via puppeteers footerTemplate and headerTemplate (see their docs). Note: header is outdated in screenshot

Samples

(Linux) [Logs] Web Traffic 3 (1).pdf
(Linux) [Logs] Web Traffic 3 (2) with custom logo.pdf

Benchmarks

See #130546 (comment)

Additional notes

Rework of [Screenshotting] PoC print media #128470
~~Needs benchmarks (CC @tsullivan )~~
Current implementation is server-side only, even though this does get us a lot closer to being able to printing client side, we still need to figure out how we want to handle headers/footers there.
Fix for missing time range in print-optimized PDF c3b5500

Checklist

Unit or functional tests were updated or added to match the most common scenarios

Risk Matrix

Risk	Probability	Severity	Mitigation/Notes
Introduce a performance regression.	Low	High	Running benchmarks will help a lot with this. We are also taking fewer logical steps to create a PDF and not cloning/stringifying image buffers which should already greatly increase performance.

For maintainers

This was checked for breaking API changes and was labeled appropriately

…-fix'

jloleysens · 2022-04-19T16:54:56Z

@elasticmachine merge upstream

tsullivan · 2022-04-19T21:55:38Z

Benchmark tests

These results used the three "print layout" tests from elastic/kibana-reporting-benchmarks repo.

The average execution time using the changes in this PR: 12.846 seconds
The average execution time baseline from the latest 8.3.0-SNAPSHOT build: 17.241 seconds.

Take a look at the dashboard set up from the logs of the test runs. The "Execution duration" chart is split by the server UUID: the blue line is the timings with a build of this PR, and the green line is the snapshot build.

The other stats: event loop delay, heap memory size, chromium memory size, etc. look virtually the same.

setup
VM size	8GB
Kibana max old space size	6.4GB

jloleysens · 2022-04-20T12:21:02Z

If the styles of footers and headers is an issue we can consider using something like this: https://www.npmjs.com/package/puppeteer-report

jloleysens · 2022-05-05T08:25:16Z

@elasticmachine merge upstream

jloleysens · 2022-05-05T09:49:37Z

@tsullivan I think I've addressed your feedback:

Enable custom logos (see attached PDF in description)
Added the headless_shell/chromium-70f5d88-locales-linux_arm64.zip and headless_shell/chromium-70f5d88-locales-linux_x64.zip archives that contain the locales we need for the page numbers

we should also merge #131600 but I don't think we need to block this PR.

Would you mind taking another look?

tsullivan · 2022-05-06T02:30:11Z

x-pack/test/reporting_api_integration/services/usage.ts

+      log.info(
+        `expecting all time stats to report ${count} ${jobType} job types (actual: ${actual})`
+      );
+      expect(actual).to.be(count);


Sorry this test was such a pain. It's very old and was made before snapshots were a thing.

tsullivan

LGTM

I have some percolating thoughts about calculating the page numbers of the PDF for telemetry, but let's save those for later.

spalger

Casing changes LGTM

Heenawter

Code owner review - LGTM 👍

…hromium-to-print-pdf-part-1 * 'main' of github.com:elastic/kibana: (59 commits) [Cloud Posture] Enabled findings group by feature (elastic#131780) [EBT] Fix `userId` generation (elastic#131701) [RAM] Add shareable rule tag filter (elastic#130710) Optimize package installation performance, phase 2 (elastic#131627) [Screenshotting] instrument for benchmark tests using new EventLogger class (elastic#130356) [Connector] Adding internal route for requesting ad-hoc ServiceNow access token (elastic#131171) [ci] bump kibana-buildkite-library (elastic#131754) [Synthetics] UI clean up (elastic#131598) [RsponseOps] Fix flaky rules list test (elastic#131567) [Cases] Add severity field to create case (elastic#131626) [Discover] Monospace font in Document Explorer (elastic#131513) Sessions tab improvements (elastic#131583) Add cloud icon "ess-icon" at the end of the config keys in "alerting" documentation (elastic#131735) [DOCS] Updates deprecation text for legacy APIs (elastic#131741) [ci] break out skip patterns so they can change without triggering CI (elastic#131726) Adjust search session management page font size (elastic#131291) [Unified search] Fix uptime css problem (elastic#131730) [Actionable Observability] Link to filtered rules page (elastic#131629) Add openAPI specifications for cases endpoint (elastic#131275) Display rule API key owner to users who can manage API keys (elastic#131662) ... # Conflicts: # x-pack/plugins/screenshotting/server/formats/pdf/index.ts # x-pack/plugins/screenshotting/server/screenshots/observable.ts

jloleysens · 2022-05-09T10:11:47Z

@elasticmachine merge upstream

jloleysens · 2022-05-09T18:59:39Z

@elasticmachine merge upstream

…ed an issue; need to figure out what exactly the issue was...

kibana-ci · 2022-05-09T23:37:13Z

💚 Build Succeeded

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
`dashboard`	302.2KB	304.2KB	+2.0KB
`unifiedSearch`	166.9KB	167.2KB	+308.0B
total			+2.3KB

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
`maps`	70.1KB	70.2KB	+90.0B
`navigation`	9.4KB	9.6KB	+147.0B
`unifiedSearch`	48.5KB	48.6KB	+120.0B
total			+357.0B

History

💔 Build #43441 failed 7d5ac9e
💔 Build #43276 failed a320172
💔 Build #43265 failed 4e1c83f
💔 Build #43249 failed 18f3bee
💚 Build #42753 succeeded 0530b6a

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

jloleysens added 15 commits April 19, 2022 12:11

first version of semi-sane results

bc8439b

getting a bit more sophisticated

340daa6

wip on footer, page numbers not working, but logo working

3180772

re-work PoC for readability, added a lot of comments

4d0c0eb

change up formatting for readability

da4789d

added comment

7744c26

remove some comments and remove HACK

3fde026

use page.pdf function

2a6f0f2

remove controls from shared PoC ui

036346f

preserveDrawingBuffer fix for maps, needs review

52d0c1b

minor clean up

2f59cf7

update sass

6c08a1c

clean up experimental code

285a213

moved a few files around to get this ready for review

fb461fd

added appservices as print media code owners

9f32cba

jloleysens added (Deprecated) Feature:Reporting Use Reporting:Screenshot, Reporting:CSV, or Reporting:Framework instead release_note:skip Skip the PR/issue when compiling release notes Team:Reporting Services v8.3.0 labels Apr 19, 2022

[CI] Auto-commit changed files from 'node scripts/eslint --no-cache -…

3eb2002

…-fix'

Merge branch 'main' into reporting/use-chromium-to-print-pdf-part-1

21f99d6

jloleysens mentioned this pull request Apr 19, 2022

[Screenshotting] PoC print media #128470

Closed

added PDFJS to get num pages

da4f4e9

jloleysens changed the title ~~[Reporting/Dashboard] Use Chromium to for print-optimized PDFs~~ [Reporting/Dashboard] Use Chromium for print-optimized PDFs Apr 20, 2022

fix getting page number using pdfjs-dist

3ca4e21

update inline snapshot

eb41323

kibanamachine and others added 3 commits May 5, 2022 03:25

Merge branch 'main' into reporting/use-chromium-to-print-pdf-part-1

efe61c3

fix tests and update sizing of logos

a0cf2ca

use locales version for arm64 too

b7e64e9

fix jest test

0530b6a

tsullivan reviewed May 6, 2022

View reviewed changes

tsullivan approved these changes May 6, 2022

View reviewed changes

spalger approved these changes May 6, 2022

View reviewed changes

Heenawter approved these changes May 6, 2022

View reviewed changes

jloleysens and others added 2 commits May 9, 2022 11:04

fix types

4e1c83f

jloleysens removed the ci:deploy-cloud label May 9, 2022

Merge branch 'main' into reporting/use-chromium-to-print-pdf-part-1

a320172

kibanamachine and others added 3 commits May 9, 2022 13:59

Merge branch 'main' into reporting/use-chromium-to-print-pdf-part-1

7d5ac9e

made pdf capture check stricter

dbcfc90

fix PDF generation issue due to query bar rendering content that caus…

688b1b8

…ed an issue; need to figure out what exactly the issue was...

jloleysens merged commit 9a78d3d into elastic:main May 10, 2022

kibanamachine added the backport:skip This commit does not require backporting label May 10, 2022

jloleysens deleted the reporting/use-chromium-to-print-pdf-part-1 branch May 10, 2022 08:16

jloleysens mentioned this pull request May 10, 2022

[Screenshotting] Added workaround for webgl driven canvases #131907

Merged

jloleysens mentioned this pull request May 31, 2022

[Dashboard/Reporting] Control should (probably) not be visible on print-optimized reports #133182

Closed

tsullivan mentioned this pull request Jun 2, 2022

[Dashboard] Clicking the print dialog crashes the tab #133451

Closed

jloleysens mentioned this pull request Jun 13, 2022

[Reporting] Remove the "print layout" from dashboard #134209

Open

jloleysens mentioned this pull request Jun 27, 2022

[Screenshotting] Clean up legacy print-optimized code #135185

Open

jloleysens mentioned this pull request Jul 28, 2022

[Screenshotting] Remove the concept of "groups" from layouts #137438

Merged

1 task

tsullivan mentioned this pull request Sep 14, 2022

Upgrade screenshotting Chromium and Puppeteer to v15 #140072

Closed

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Reporting/Dashboard] Use Chromium for print-optimized PDFs #130546

[Reporting/Dashboard] Use Chromium for print-optimized PDFs #130546

jloleysens commented Apr 19, 2022 •

edited

Loading

jloleysens commented Apr 19, 2022

tsullivan commented Apr 19, 2022 •

edited

Loading

jloleysens commented Apr 20, 2022

jloleysens commented May 5, 2022

jloleysens commented May 5, 2022 •

edited

Loading

tsullivan May 6, 2022

tsullivan left a comment

spalger left a comment

Heenawter left a comment

jloleysens commented May 9, 2022

jloleysens commented May 9, 2022

kibana-ci commented May 9, 2022

[Reporting/Dashboard] Use Chromium for print-optimized PDFs #130546

[Reporting/Dashboard] Use Chromium for print-optimized PDFs #130546

Conversation

jloleysens commented Apr 19, 2022 • edited Loading

Summary

Screenshots

Samples

Benchmarks

Additional notes

Checklist

Risk Matrix

For maintainers

jloleysens commented Apr 19, 2022

tsullivan commented Apr 19, 2022 • edited Loading

Benchmark tests

jloleysens commented Apr 20, 2022

jloleysens commented May 5, 2022

jloleysens commented May 5, 2022 • edited Loading

tsullivan May 6, 2022

Choose a reason for hiding this comment

tsullivan left a comment

Choose a reason for hiding this comment

spalger left a comment

Choose a reason for hiding this comment

Heenawter left a comment

Choose a reason for hiding this comment

jloleysens commented May 9, 2022

jloleysens commented May 9, 2022

kibana-ci commented May 9, 2022

💚 Build Succeeded

Metrics [docs]

Async chunks

Page load bundle

History

jloleysens commented Apr 19, 2022 •

edited

Loading

tsullivan commented Apr 19, 2022 •

edited

Loading

jloleysens commented May 5, 2022 •

edited

Loading