rust-lang/rust
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

rustdoc: optimize loading of source sidebar

Browse Source 
The source sidebar has a setting to remember whether it should be open or
closed. Previously, this setting was handled in source-script.js, which
is loaded with `defer`, meaning it is often run after the document is rendered.
Since CSS renders the source sidebar as closed by default, changing this
after the initial render results in a relayout.

Instead, handle the setting in storage.js, which is the first script to load
and is the only script that blocks render. This avoids a relayout and means
navigating between files with the sidebar open is faster.
This commit is contained in:
Jacob Hoffman-Andrews
2022-06-20 12:41:11 -07:00
parent bb8c2f4117
commit b37a05bd01
5 changed files with 42 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
src/librustdoc/html/static/css/rustdoc.css
View File

@@ -387,16 +387,20 @@ nav.sub {
overflow-y: hidden;
}
.rustdoc.source .sidebar .sidebar-logo {
display: none;
}
.source .sidebar > *:not(#sidebar-toggle) {
opacity: 0;
visibility: hidden;
}
.source .sidebar.expanded {
.source-sidebar-expanded .source .sidebar {
overflow-y: auto;
}
.source .sidebar.expanded > *:not(#sidebar-toggle) {
.source-sidebar-expanded .source .sidebar > *:not(#sidebar-toggle) {
opacity: 1;
visibility: visible;
}
@@ -1682,11 +1686,11 @@ details.rustdoc-toggle[open] > summary.hideme::after {
/* When we expand the sidebar on the source code page, we hide the logo on the left of the
search bar to have more space. */
.sidebar.expanded + main .width-limiter .sub-logo-container.rust-logo {
.source-sidebar-expanded .source .sidebar + main .width-limiter .sub-logo-container.rust-logo {
display: none;
}
.source .sidebar.expanded {
.source-sidebar-expanded .source .sidebar {
width: 300px;
}
}
@@ -1766,7 +1770,7 @@ details.rustdoc-toggle[open] > summary.hideme::after {
}
.sidebar.shown,
.sidebar.expanded,
.source-sidebar-expanded .source .sidebar,
.sidebar:focus-within {
left: 0;
}
@@ -1889,11 +1893,7 @@ details.rustdoc-toggle[open] > summary.hideme::after {
left: -11px;
}
.sidebar.expanded #sidebar-toggle {
font-size: 1.5rem;
}
.sidebar:not(.expanded) #sidebar-toggle {
#sidebar-toggle {
position: fixed;
left: 1px;
top: 100px;
@@ -1910,6 +1910,14 @@ details.rustdoc-toggle[open] > summary.hideme::after {
border-left: 0;
}
.source-sidebar-expanded #sidebar-toggle {
left: unset;
top: unset;
width: unset;
border-top-right-radius: unset;
border-bottom-right-radius: unset;
}
#source-sidebar {
z-index: 11;
}
@@ -1952,7 +1960,7 @@ details.rustdoc-toggle[open] > summary.hideme::after {
padding-left: 2em;
}
.source .sidebar.expanded {
.source-sidebar-expanded .source .sidebar {
max-width: 100vw;
width: 100vw;
}
@@ -2010,9 +2018,12 @@ details.rustdoc-toggle[open] > summary.hideme::after {
width: 35px;
}
.sidebar:not(.expanded) #sidebar-toggle {
#sidebar-toggle {
top: 10px;
}
.source-sidebar-expanded #sidebar-toggle {
top: unset;
}
}
.method-toggle summary,