META: Reduce / eliminate “jank” (layout shifts) within Drupal’s admin UI

This issue is intended to track various issues that reduce the “jankiness” of Drupal’s admin interface.

What is jank?

“Jank” is any stuttering or choppiness that a user experiences when there is motion on the screen—like during scrolling, transitions, or animations. So although a website may look incredible and load quickly, if there’s jank—a noticeable choppiness when using the page—this will negatively affect the user experience—something we all want to avoid.

Specifically within Drupal, a number of admin interfaces are janky on page load. This means that when you initially navigate to the page, it quickly loads looking one way, and then when JavaScript loads, it modifies the page to look another way.

Jank Issues

• #3361315: Dropbutton quickly shows/hides its menu on pageload causing layout shift
• #3404215: Tabledrag creates jank (layout shift) on page load
• #3404217: States API creates jank (layout shift) on page load
• #3404218: Table filter creates jank (layout shift) on page load
• #3441124: Views UI action buttons create janky layout shift on page load
• #3441175: Read only "machine name" field appears and disappears within certain admin pages, causing layout shift
• #3441137: BigPipe injecting Local Actions block creates large janky layout shift in Claro
• #3443559: Regression: Shortcuts menu flickers when the page is loaded
• #3446078: Olivero content shift on page load

Issue to create reusable way to eliminate jank

• #3443834: Investigate possibility of creating API, CSS class, reusable animation to help eliminate page jank