-
Notifications
You must be signed in to change notification settings - Fork 58
Add session storage keys for branding assets caching #1438
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
Conversation
Add BRANDING_LOGO_PATH and BRANDING_FAVICON keys to SessionStorageKey enum for caching branding assets between page loads. Signed-off-by: Oleksii Orel <oorel@redhat.com>
Problem: - Logo loader makes multiple 404 HEAD requests on every page load while detecting the correct image format (jpg, jpeg, png, gif, webp, svg) - Favicon update is delayed until cluster config API responds Solution: - Cache detected logo format path in session storage to skip format detection on subsequent page loads - Cache favicon in session storage and load it immediately during preload phase before React bootstrap starts - Move favicon update logic from bootstrap to brandingLoader with exported updateFavicon function for bootstrap to cache new values This eliminates redundant network requests and provides immediate logo and favicon display on subsequent page loads within the same session. Signed-off-by: Oleksii Orel <oorel@redhat.com>
|
Docker image build succeeded: quay.io/eclipse/che-dashboard:pr-1438 kubectl patch commandkubectl patch -n eclipse-che "checluster/eclipse-che" --type=json -p="[{"op": "replace", "path": "/spec/components/dashboard/deployment", "value": {containers: [{image: "quay.io/eclipse/che-dashboard:pr-1438", name: che-dashboard}]}}]" |
1 similar comment
|
Docker image build succeeded: quay.io/eclipse/che-dashboard:pr-1438 kubectl patch commandkubectl patch -n eclipse-che "checluster/eclipse-che" --type=json -p="[{"op": "replace", "path": "/spec/components/dashboard/deployment", "value": {containers: [{image: "quay.io/eclipse/che-dashboard:pr-1438", name: che-dashboard}]}}]" |
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #1438 +/- ##
==========================================
+ Coverage 92.59% 92.79% +0.19%
==========================================
Files 520 520
Lines 48819 48943 +124
Branches 3621 3645 +24
==========================================
+ Hits 45206 45415 +209
+ Misses 3575 3490 -85
Partials 38 38 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
svor
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
|
[APPROVALNOTIFIER] This PR is NOT APPROVED This pull-request has been approved by: olexii4, svor The full list of commands accepted by this bot can be found here. DetailsNeeds approval from an approver in each of these files:Approvers can indicate their approval by writing |

What does this PR do?
This PR fixes the branding logo loader performance issue by adding session storage caching for logo path and favicon. Previously, the loader made multiple 404 HTTP requests sequentially on every page load while detecting the correct image format, and the favicon update was delayed until the cluster config API responded.
Key Changes:
Session Storage Caching - Added local constants
branding-logo-pathandbranding-faviconinbrandingLoader.tsfor caching branding assets between page loads using directwindow.sessionStorageaccessParallel Logo Format Detection - All image formats (jpg, jpeg, png, gif, webp, svg) are checked in parallel using
Promise.all. The first successful format (by priority order) is cached immediatelyPlaceholder Favicon in HTML - Changed
index.htmlto use a 1x1 transparent GIF placeholder instead of referencingfavicon.ico. Removed theidattribute, now usinglink[rel="shortcut icon"]selectorFavicon Preload Caching - Favicon is loaded from session storage cache immediately during the preload phase (in
brandingLoader.ts) before React bootstrap startsupdateFaviconFunction - Exported frombrandingLoader.ts, acceptsDashboardFavicon | undefined:dashboardFaviconis provided, uses itsbase64dataandmediatypeundefined, fetches/dashboard/assets/branding/favicon.icoand converts to data URLcheckFaviconMethod - Simplified inbootstrap/index.tsto call the importedupdateFaviconfunction with the dashboard favicon from Redux stateScreenshot/screencast of this PR
What issues does this PR fix or reference?
fixes eclipse-che/che#23690
Is it tested? How?
Release Notes
Docs PR