Make It Seem Like Everything Loads Fast
summary
Frontend techniques to make a slow-loading web app feel faster without changing the backend API. Covers “perceived performance” tricks (fake loaders/placeholder overlays, progressive content rendering, skeleton screens and other deceptive accelerations) and practical, measurable methods the team used over a 5-year project to surface usable content earlier and verify the improvements.
AI-written summary · about
chapters (21)
- 0:00Introduction
- 1:06Why apps feel slow
- 7:19User perception of time
- 10:14Load types demo
- 16:13User load ratings
- 17:18Luke Wroblewski’s tone studies
- 20:12Skeleton screens methods
- 22:43Wave animation with CSS
- 29:12HTML/CSS skeleton implementation
- 35:23Skeleton formats comparison
- 36:51Hide skeleton after load
- 39:40Skeleton tools and debugging
- 43:59Skeletons in dynamic layouts
- 44:39Responsive layouts and skeletons
- 45:23Choosing skeleton types
- 46:28Tone styles for images
- 53:05Q&A
- 1:04:01When to use skeletons
- 1:06:57Spinner to skeleton trend
- 1:08:23Skeletons with spinners
- 1:11:16Summary
related talks
26mFetching Data and the Perception of Speed
13mImprove the illusion of speed - Optimize your web experience to perfection!
29mClient Says Your Awesome Web App Works Slowly. Now What?
23mOptimizing page load speed on front end side
26mDesigning for speed and hacking users perception
01h 23mWhy Slow?
39mFrom make it work to make it fast: quick wins to boost your application
33mPerceived faster Angular applications