Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make Amsterdam an opt-in theme #212787

Merged
merged 5 commits into from
Mar 4, 2025

Conversation

tkajtoch
Copy link
Member

@tkajtoch tkajtoch commented Feb 28, 2025

Summary

This PR updates DEFAULT_THEME_TAGS used to determine what theme tags are bundled in Kibana by default to only include the Borealis theme, specifically borealislight and borealisdark theme tags. This change is expected to decrease bundle sizes significantly and get back to bundling a single theme, not two (4 → 2 theme tags).

Now that Serverless, 9.0, and main all run with Borealis, there's no risk in removing Amsterdam from the bundle and decreasing Kibana bundle sizes.

We need to keep the feature flag in code for the time being to easily test future Borealis iterations.

Amsterdam will still be available as an opt-in theme and is meant to be used locally when testing changes to be backported to 8.x versions that use Amsterdam. To do so, Kibana needs to be started/built with KBN_OPTIMIZER_THEMES environment variable set and the feature flag overridden in kibana.dev.yml.

# config/kibana.dev.yml
feature_flags.overrides.coreRendering.defaultThemeName: amsterdam
# Run dev server with both borealis and Amsterdam theme tags
KBN_OPTIMIZER_THEMES="borealislight,borealisdark,v8light,v8dark" yarn start

Checklist

Check the PR satisfies following conditions.

Reviewers should verify this PR satisfies this list as well.

@tkajtoch tkajtoch added the release_note:skip Skip the PR/issue when compiling release notes label Feb 28, 2025
@tkajtoch tkajtoch self-assigned this Feb 28, 2025
@tkajtoch tkajtoch added v9.1.0 v9.0.0 backport:prev-minor Backport to (9.0) the previous minor version (i.e. one version back from main) labels Feb 28, 2025
@tkajtoch tkajtoch marked this pull request as ready for review February 28, 2025 20:45
@tkajtoch tkajtoch requested review from a team as code owners February 28, 2025 20:45
@elasticmachine
Copy link
Contributor

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id before after diff
aiops 615 603 -12
alerting 237 229 -8
apm 1661 1653 -8
banners 30 26 -4
canvas 1220 1212 -8
cases 1021 1013 -8
cloudSecurityPosture 705 661 -44
console 226 218 -8
controls 369 349 -20
core 401 397 -4
dashboard 654 642 -12
data 546 534 -12
datasetQuality 289 285 -4
dataViewEditor 89 81 -8
dataViewFieldEditor 172 156 -16
dataViewManagement 217 209 -8
dataVisualizer 763 747 -16
devTools 30 26 -4
discover 1020 944 -76
enterpriseSearch 1399 1331 -68
esqlDataGrid 443 399 -44
eventAnnotationListing 623 591 -32
expressionError 36 32 -4
expressions 190 186 -4
expressionXY 285 273 -12
fieldFormats 74 70 -4
fleet 1201 1197 -4
globalSearchBar 47 43 -4
graph 281 273 -8
home 228 224 -4
imageEmbeddable 137 133 -4
indexLifecycleManagement 280 248 -32
indexManagement 690 662 -28
ingestPipelines 381 337 -44
inputControlVis 98 90 -8
inspector 78 70 -8
interactiveSetup 55 51 -4
kibanaOverview 97 93 -4
kibanaReact 255 247 -8
lens 1696 1512 -184
licenseManagement 111 107 -4
management 90 86 -4
maps 1258 1246 -12
ml 2337 2293 -44
observability 1317 1273 -44
osquery 302 298 -4
painlessLab 42 38 -4
presentationUtil 155 143 -12
reporting 156 148 -8
rollup 132 128 -4
savedObjects 33 29 -4
savedObjectsManagement 117 105 -12
savedObjectsTagging 109 101 -8
screenshotting 27 23 -4
searchIndices 338 334 -4
searchPlayground 294 290 -4
searchprofiler 76 72 -4
security 648 604 -44
securitySolution 7106 7050 -56
serverlessSearch 431 411 -20
share 89 85 -4
slo 918 874 -44
snapshotRestore 198 194 -4
spaces 360 300 -60
stackAlerts 184 172 -12
streamsApp 316 312 -4
transform 486 478 -8
triggersActionsUi 919 847 -72
uiActionsEnhanced 171 163 -8
unifiedDocViewer 297 277 -20
unifiedHistogram 199 195 -4
unifiedSearch 394 366 -28
upgradeAssistant 193 177 -16
visDefaultEditor 241 237 -4
visTypeMarkdown 68 64 -4
visTypeTable 47 43 -4
visTypeTimelion 67 59 -8
visTypeTimeseries 552 496 -56
visTypeVega 550 538 -12
visTypeVislib 186 182 -4
visualizations 506 466 -40
watcher 176 172 -4
total -1512

Async chunks

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

id before after diff
aiops 454.5KB 452.1KB -2.5KB
alerting 101.4KB 97.2KB -4.2KB
apm 2.3MB 2.3MB -1.2KB
canvas 1.0MB 1001.1KB -55.2KB
cases 1.3MB 1.3MB -4.2KB
cloudSecurityPosture 503.7KB 487.3KB -16.4KB
console 201.8KB 184.5KB -17.3KB
controls 427.9KB 408.6KB -19.2KB
dashboard 543.3KB 532.5KB -10.9KB
data 54.7KB 52.3KB -2.4KB
dataViewEditor 44.5KB 42.2KB -2.3KB
dataViewFieldEditor 113.8KB 159.7KB +46.0KB
dataViewManagement 128.5KB 126.6KB -1.9KB
dataVisualizer 616.1KB 613.1KB -3.0KB
discover 810.8KB 751.4KB -59.3KB
enterpriseSearch 1.3MB 1.3MB -23.6KB
esqlDataGrid 174.0KB 157.6KB -16.4KB
eventAnnotationListing 219.9KB 207.7KB -12.2KB
expressionError 11.3KB 15.1KB +3.7KB
expressionXY 122.3KB 115.8KB -6.5KB
fleet 1.7MB 1.7MB -1.1KB
graph 405.9KB 394.5KB -11.4KB
home 139.0KB 132.9KB -6.1KB
imageEmbeddable 57.2KB 56.0KB -1.2KB
indexLifecycleManagement 172.5KB 161.2KB -11.3KB
indexManagement 713.3KB 695.2KB -18.2KB
ingestPipelines 418.4KB 399.8KB -18.7KB
inputControlVis 53.3KB 50.1KB -3.2KB
kibanaOverview 54.5KB 47.6KB -6.9KB
kibanaReact 203.6KB 194.0KB -9.6KB
lens 1.6MB 1.5MB -119.8KB
management 32.6KB 31.6KB -1.1KB
maps 2.9MB 2.9MB -31.9KB
ml 5.2MB 5.2MB -28.7KB
observability 1.3MB 1.3MB -6.6KB
presentationUtil 90.6KB 86.8KB -3.8KB
reporting 63.9KB 61.7KB -2.2KB
rollup 109.3KB 108.3KB -1.1KB
savedObjectsManagement 85.4KB 81.7KB -3.8KB
savedObjectsTagging 49.0KB 46.3KB -2.8KB
searchIndices 180.8KB 178.4KB -2.4KB
searchPlayground 187.6KB 185.2KB -2.4KB
security 549.9KB 521.8KB -28.1KB
securitySolution 8.9MB 8.8MB -54.2KB
serverlessSearch 351.7KB 344.4KB -7.3KB
share 3.9KB 3.9KB -19.0B
slo 795.6KB 756.3KB -39.3KB
spaces 270.6KB 248.9KB -21.7KB
stackAlerts 75.3KB 73.0KB -2.3KB
triggersActionsUi 1.5MB 1.5MB -24.1KB
uiActionsEnhanced 138.1KB 135.8KB -2.3KB
unifiedDocViewer 208.5KB 202.8KB -5.7KB
unifiedSearch 358.9KB 347.2KB -11.7KB
upgradeAssistant 176.6KB 171.4KB -5.3KB
visDefaultEditor 104.2KB 93.6KB -10.6KB
visTypeMarkdown 9.5KB 7.8KB -1.7KB
visTypeTable 21.6KB 19.1KB -2.5KB
visTypeTimelion 43.2KB 39.6KB -3.6KB
visTypeTimeseries 510.9KB 484.5KB -26.4KB
visTypeVega 1.9MB 1.9MB -4.8KB
visTypeVislib 380.3KB 365.7KB -14.6KB
visualizations 364.6KB 342.2KB -22.4KB
total -791.5KB

Page load bundle

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

id before after diff
banners 9.6KB 8.4KB -1.2KB
core 474.7KB 430.3KB -44.4KB
data 398.6KB 397.4KB -1.3KB
dataViewEditor 13.2KB 11.9KB -1.3KB
dataViewFieldEditor 23.6KB 23.3KB -264.0B
devTools 13.4KB 11.9KB -1.4KB
enterpriseSearch 38.8KB 38.7KB -91.0B
expressionError 5.4KB 5.4KB -22.0B
expressions 99.1KB 97.4KB -1.6KB
fieldFormats 63.0KB 61.8KB -1.2KB
globalSearchBar 30.3KB 27.9KB -2.4KB
inputControlVis 8.6KB 8.6KB -36.0B
inspector 26.5KB 23.4KB -3.0KB
interactiveSetup 60.1KB 56.7KB -3.4KB
kibanaReact 30.1KB 28.6KB -1.5KB
licenseManagement 13.3KB 12.0KB -1.2KB
painlessLab 13.0KB 11.0KB -2.0KB
savedObjects 16.5KB 15.3KB -1.1KB
screenshotting 8.8KB 7.5KB -1.3KB
searchprofiler 23.7KB 16.4KB -7.3KB
share 60.1KB 58.9KB -1.2KB
snapshotRestore 27.6KB 25.3KB -2.3KB
transform 21.0KB 19.0KB -2.0KB
triggersActionsUi 115.0KB 110.8KB -4.2KB
unifiedSearch 45.8KB 36.4KB -9.4KB
visDefaultEditor 29.4KB 29.4KB -58.0B
watcher 15.7KB 14.2KB -1.5KB
total -96.7KB
Unknown metric groups

async chunk count

id before after diff
dataViewFieldEditor 15 14 -1
unifiedDocViewer 9 10 +1
total -0

History

cc @tkajtoch

Copy link
Contributor

@gsoldevila gsoldevila left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

Just out of curiosity, what is this themeVersion used for?

@tkajtoch
Copy link
Member Author

tkajtoch commented Mar 4, 2025

@gsoldevila It's a legacy way themes were toggled back in Kibana 7 era. We plan to remove it and clean up the theming logic across Kibana, probably around the time we get rid of the remaining SCSS styles

@tkajtoch tkajtoch merged commit 4dd8de8 into elastic:main Mar 4, 2025
10 checks passed
@kibanamachine
Copy link
Contributor

Starting backport for target branches: 9.0

https://github.com/elastic/kibana/actions/runs/13653915433

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Mar 4, 2025
## Summary

This PR updates `DEFAULT_THEME_TAGS` used to determine what theme tags
are bundled in Kibana by default to only include the Borealis theme,
specifically `borealislight` and `borealisdark` theme tags. This change
is expected to decrease bundle sizes significantly and get back to
bundling a single theme, not two (4 → 2 theme tags).

Now that Serverless, `9.0`, and `main` all run with Borealis, there's no
risk in removing Amsterdam from the bundle and decreasing Kibana bundle
sizes.

We need to keep the feature flag in code for the time being to easily
test future Borealis iterations.

Amsterdam will still be available as an opt-in theme and is meant to be
used locally when testing changes to be backported to 8.x versions that
use Amsterdam. To do so, Kibana needs to be started/built with
`KBN_OPTIMIZER_THEMES` environment variable set and the feature flag
overridden in `kibana.dev.yml`.

```yml
# config/kibana.dev.yml
feature_flags.overrides.coreRendering.defaultThemeName: amsterdam
```

```shell
# Run dev server with both borealis and Amsterdam theme tags
KBN_OPTIMIZER_THEMES="borealislight,borealisdark,v8light,v8dark" yarn start
```

### Checklist

Check the PR satisfies following conditions.

Reviewers should verify this PR satisfies this list as well.

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

---------

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
(cherry picked from commit 4dd8de8)
@kibanamachine
Copy link
Contributor

💚 All backports created successfully

Status Branch Result
9.0

Note: Successful backport PRs will be merged automatically after passing CI.

Questions ?

Please refer to the Backport tool documentation

kibanamachine added a commit that referenced this pull request Mar 4, 2025
# Backport

This will backport the following commits from `main` to `9.0`:
- [Make Amsterdam an opt-in theme
(#212787)](#212787)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Tomasz
Kajtoch","email":"tomasz.kajtoch@elastic.co"},"sourceCommit":{"committedDate":"2025-03-04T12:40:06Z","message":"Make
Amsterdam an opt-in theme (#212787)\n\n## Summary\n\nThis PR updates
`DEFAULT_THEME_TAGS` used to determine what theme tags\nare bundled in
Kibana by default to only include the Borealis theme,\nspecifically
`borealislight` and `borealisdark` theme tags. This change\nis expected
to decrease bundle sizes significantly and get back to\nbundling a
single theme, not two (4 → 2 theme tags).\n\nNow that Serverless, `9.0`,
and `main` all run with Borealis, there's no\nrisk in removing Amsterdam
from the bundle and decreasing Kibana bundle\nsizes.\n\nWe need to keep
the feature flag in code for the time being to easily\ntest future
Borealis iterations.\n\nAmsterdam will still be available as an opt-in
theme and is meant to be\nused locally when testing changes to be
backported to 8.x versions that\nuse Amsterdam. To do so, Kibana needs
to be started/built with\n`KBN_OPTIMIZER_THEMES` environment variable
set and the feature flag\noverridden in `kibana.dev.yml`.\n\n```yml\n#
config/kibana.dev.yml\nfeature_flags.overrides.coreRendering.defaultThemeName:
amsterdam\n```\n\n```shell\n# Run dev server with both borealis and
Amsterdam theme
tags\nKBN_OPTIMIZER_THEMES=\"borealislight,borealisdark,v8light,v8dark\"
yarn start\n```\n\n### Checklist\n\nCheck the PR satisfies following
conditions. \n\nReviewers should verify this PR satisfies this list as
well.\n\n- [x] [Unit or
functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere
updated or added to match the most common
scenarios\n\n---------\n\nCo-authored-by: Elastic Machine
<elasticmachine@users.noreply.github.com>","sha":"4dd8de807ae8a9d1b00a2a99c98510f7a21382db","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","v9.0.0","backport:prev-minor","v9.1.0"],"title":"Make
Amsterdam an opt-in
theme","number":212787,"url":"https://github.com/elastic/kibana/pull/212787","mergeCommit":{"message":"Make
Amsterdam an opt-in theme (#212787)\n\n## Summary\n\nThis PR updates
`DEFAULT_THEME_TAGS` used to determine what theme tags\nare bundled in
Kibana by default to only include the Borealis theme,\nspecifically
`borealislight` and `borealisdark` theme tags. This change\nis expected
to decrease bundle sizes significantly and get back to\nbundling a
single theme, not two (4 → 2 theme tags).\n\nNow that Serverless, `9.0`,
and `main` all run with Borealis, there's no\nrisk in removing Amsterdam
from the bundle and decreasing Kibana bundle\nsizes.\n\nWe need to keep
the feature flag in code for the time being to easily\ntest future
Borealis iterations.\n\nAmsterdam will still be available as an opt-in
theme and is meant to be\nused locally when testing changes to be
backported to 8.x versions that\nuse Amsterdam. To do so, Kibana needs
to be started/built with\n`KBN_OPTIMIZER_THEMES` environment variable
set and the feature flag\noverridden in `kibana.dev.yml`.\n\n```yml\n#
config/kibana.dev.yml\nfeature_flags.overrides.coreRendering.defaultThemeName:
amsterdam\n```\n\n```shell\n# Run dev server with both borealis and
Amsterdam theme
tags\nKBN_OPTIMIZER_THEMES=\"borealislight,borealisdark,v8light,v8dark\"
yarn start\n```\n\n### Checklist\n\nCheck the PR satisfies following
conditions. \n\nReviewers should verify this PR satisfies this list as
well.\n\n- [x] [Unit or
functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere
updated or added to match the most common
scenarios\n\n---------\n\nCo-authored-by: Elastic Machine
<elasticmachine@users.noreply.github.com>","sha":"4dd8de807ae8a9d1b00a2a99c98510f7a21382db"}},"sourceBranch":"main","suggestedTargetBranches":["9.0"],"targetPullRequestStates":[{"branch":"9.0","label":"v9.0.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/212787","number":212787,"mergeCommit":{"message":"Make
Amsterdam an opt-in theme (#212787)\n\n## Summary\n\nThis PR updates
`DEFAULT_THEME_TAGS` used to determine what theme tags\nare bundled in
Kibana by default to only include the Borealis theme,\nspecifically
`borealislight` and `borealisdark` theme tags. This change\nis expected
to decrease bundle sizes significantly and get back to\nbundling a
single theme, not two (4 → 2 theme tags).\n\nNow that Serverless, `9.0`,
and `main` all run with Borealis, there's no\nrisk in removing Amsterdam
from the bundle and decreasing Kibana bundle\nsizes.\n\nWe need to keep
the feature flag in code for the time being to easily\ntest future
Borealis iterations.\n\nAmsterdam will still be available as an opt-in
theme and is meant to be\nused locally when testing changes to be
backported to 8.x versions that\nuse Amsterdam. To do so, Kibana needs
to be started/built with\n`KBN_OPTIMIZER_THEMES` environment variable
set and the feature flag\noverridden in `kibana.dev.yml`.\n\n```yml\n#
config/kibana.dev.yml\nfeature_flags.overrides.coreRendering.defaultThemeName:
amsterdam\n```\n\n```shell\n# Run dev server with both borealis and
Amsterdam theme
tags\nKBN_OPTIMIZER_THEMES=\"borealislight,borealisdark,v8light,v8dark\"
yarn start\n```\n\n### Checklist\n\nCheck the PR satisfies following
conditions. \n\nReviewers should verify this PR satisfies this list as
well.\n\n- [x] [Unit or
functional\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\nwere
updated or added to match the most common
scenarios\n\n---------\n\nCo-authored-by: Elastic Machine
<elasticmachine@users.noreply.github.com>","sha":"4dd8de807ae8a9d1b00a2a99c98510f7a21382db"}}]}]
BACKPORT-->

Co-authored-by: Tomasz Kajtoch <tomasz.kajtoch@elastic.co>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
backport:prev-minor Backport to (9.0) the previous minor version (i.e. one version back from main) release_note:skip Skip the PR/issue when compiling release notes v9.0.0 v9.1.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants