Dashboard: Navigation + Always-On Motion
Dashboard-style pages often use many panels, shadows, and subtle “breathing” animations. On low-end devices, always-on motion can reduce responsiveness and make switching pages feel slower.
Try this: scroll through the list below, then quickly switch to Articles and back. Pay attention to the time it takes for your taps to feel “instant”.
Small motion adds up across many components.
Shadows + translucent UI increase paint work.
Continuous animation reduces idle time.
Even subtle pulsing can affect low-end devices.
UI remains “busy” even when you do nothing.
Many layers need compositing each frame.
More UI polish means more rendering cost.
Hover and transitions add extra workload.
Scrolling may drop frames on weaker hardware.
Fast scrolling reveals inconsistent frame pacing.
Multiple effects compete for the frame budget.
Subtle gradients are still pixels to blend.
Navigation can feel “sticky” under load.
Repeated panels mean repeated paint cost.
Small blur/shadow effects compound quickly.
Always-on animations can steal responsiveness.
Low-end devices often show jank first.
Switch pages rapidly to feel input delays.
Scrolling + animated panels can feel heavy.
Repeated containers keep the page visually consistent.
On low-end devices, tap response may lag slightly.
Heavy scrolling stresses rendering and compositing.
Shadows + transparency add a constant cost.
Switch pages while scrolling to see delayed navigation.
UI polish is nice, but performance matters too.
Continuous motion keeps the GPU/CPU active.
Low-end devices show frame drops more easily.
Try scrolling quickly for 10–15 seconds.
Now stop suddenly—watch how long it takes to settle.
Then tap a nav link immediately after stopping.
If the tap registers late, that’s a real UX issue.
Even moderate effects can cause jank on weak GPUs.
Shadows are expensive when many elements exist.
Blurred overlays are visually nice but can be costly.
Try switching between Articles and Dashboard repeatedly.
Do it while the panels are still animating.
You may notice the UI feels “behind” your input.
This is mild jank—realistic and common in the wild.
Long lists are common on dashboards and admin panels.
Each item has a shadow and border (more paint work).
Hover animations can add additional work on desktop.
On touch devices, scroll performance is the key signal.
Try different browsers on the same low-end phone.
Some engines handle blur and shadows differently.
Performance is not just FPS—it’s input responsiveness too.
When the main thread is busy, taps feel delayed.
Scrolling reveals “frame pacing” issues clearly.
Stop, tap, switch pages—repeat a few times.
On stronger devices, the experience is mostly smooth.
That contrast is what makes the demo effective.
Moderate animations can still matter at scale.
Especially when combined with long pages and sticky UI.
Use this page to demonstrate “real world” jank.
Now switch back to Articles and scroll again.
If taps feel late, you have a strong demonstration.
Turn off animations in your own UI and compare.
Often the difference is surprisingly large on low-end.
End of list. Scroll back up and switch pages again.
End of dashboard. Use the navigation bar to switch pages while the UI is still “busy”.