Project

General

Profile

Actions

Feature #22360

open

Use "skeleton" style pulsers for data table contents during load

Added by Stephen Smith 4 months ago. Updated 1 day ago.

Status:
New
Priority:
Normal
Assigned To:
Category:
Workbench2
Target version:
Story points:
-

Description

When the data table filter has changed, such as navigating between projects, it is confusing when it continues to show the old contents.

Improve the data table so that it uses "skeleton" pulsers as stand-in contents in this case.

Note that we want to distinguish between cases where the filter changed (so we expect different contents) and cases when we are just refreshing the contents with the same filter to bring the contents up to date -- this often happens automatically on a timer so it would be very distracting if it kept flickering between the pulsers and the contents.


Subtasks 1 (1 open0 closed)

Task #22715: Review NewLisa KnoxActions
Actions #1

Updated by Peter Amstutz 4 months ago

  • Target version changed from Development 2024-12-04 to Development 2025-01-08
Actions #2

Updated by Stephen Smith 4 months ago

  • Subject changed from Use "skeleton" style pulsers for lazy loaded fields to Use "skeleton" style pulsers for lazy loaded fields and other UI elements with loading placeholders
Actions #4

Updated by Peter Amstutz 4 months ago

  • Target version changed from Development 2025-01-08 to Development 2025-01-29
Actions #5

Updated by Peter Amstutz 3 months ago

  • Target version changed from Development 2025-01-29 to Development 2025-02-12
Actions #6

Updated by Peter Amstutz 3 months ago

  • Target version changed from Development 2025-02-12 to Development 2025-02-26
Actions #7

Updated by Moritz Gilsdorf 2 months ago

Hi,

This would be an important improvement for us. We are frequently getting strong feedback about the the perceived slowness of the workbench and this would be a big improvement. So please prioritise this if possible.

Actions #8

Updated by Peter Amstutz 2 months ago

Moritz Gilsdorf wrote in #note-7:

Hi,

This would be an important improvement for us. We are frequently getting strong feedback about the the perceived slowness of the workbench and this would be a big improvement. So please prioritise this if possible.

Hi Moritz,

We have some pretty significant workbench 2 performance improvements pending in #22127.

Actions #9

Updated by Peter Amstutz 2 months ago

The idea with skeletons is that the elements of the control are rendered as either horizontal bars (for text), boxes or circles (for images). These elements may get a subtle throbbing effect to indicate something is happening.

One point that comes to mind -- when rendering skeleton components we don't know exactly how many items there will be, e.g. the data table could have 3 items or 13, or the breadcrumbs can be several levels deep. However, we want to minimize flicker.

Tentatively, I think it should work like this:

  • If the component is loading for the first time, use an arbitrary small number (like 3)
  • If the component has been loaded before, use the previous number of items -- this way, the items that were already there are replaced by skeleton components, then replaced by new content. The idea is we don't show the old content while loading (which is confusing) but we don't completely blank it out (which creates flicker).

I'm open to other suggestions, though.

Actions #10

Updated by Peter Amstutz about 2 months ago

  • Target version changed from Development 2025-02-26 to Development 2025-03-19
Actions #11

Updated by Peter Amstutz about 1 month ago

  • Target version changed from Development 2025-03-19 to Development 2025-04-02
Actions #12

Updated by Peter Amstutz 17 days ago

  • Target version changed from Development 2025-04-02 to Development 2025-04-16
Actions #13

Updated by Peter Amstutz 16 days ago

  • Target version changed from Development 2025-04-16 to Future
Actions #14

Updated by Peter Amstutz 1 day ago

  • Target version changed from Future to Development 2025-04-16
Actions #15

Updated by Peter Amstutz 1 day ago

  • Description updated (diff)
  • Subject changed from Use "skeleton" style pulsers for lazy loaded fields and other UI elements with loading placeholders to Use "skeleton" style pulsers for data table contents during load
Actions #16

Updated by Peter Amstutz 1 day ago

  • Assigned To set to Stephen Smith
Actions #17

Updated by Peter Amstutz 1 day ago

  • Subtask #22715 added
Actions

Also available in: Atom PDF