spring-projects
Inline CSS for default login and logout page
Inline CSS for default login/logout pages
Context: gh-15302
Remove the dependency on Bootstrap CSS. Results in faster load times, no failures in air-gapped or offline scenarios, and no dependency on an external CDN that may go away some day.
Open questions / feedback / changes
- While we're touching the CSS, if you would like to update the colors (e.g. Spring green or something), now is the time.
- I have not introduced a feature flag, even to revert to the old page. Is that ok?
Design details
Goals:
- Remove the dependency on Bootstrap
- Keep existing general behavior
- Keep the page structure: elements and IDs
Anti-goals:
- Make a pixel-perfect copy of the current layout
- Keep all the class names
Performance and accessibility benchmarks
Using Chrome's embedded Lighthouse test suites, configured for mobile. This implementation shows stable performance, accessibility and best practices scores. The time to First Contentful Paint improves a lot, and drops from 1.5s to 0.7s.
Before / after HTML pages:
If you want to see the HTML pages live, and check their usage in a browser, I have an export of the pages available ; those are not running Spring Boot apps but rather an HTML export.
Before / after screenshots:
Login page:
Login page, with error:
Login page, with logout message:
Logout page:
Login page in a "phone emulator":
