Cathrin Möller
The Illusion of a Performant Web Application
#1about 3 minutes
The psychology of perceived application speed
Understanding the human perception of time delays from 100 milliseconds to 10 seconds is key to building applications that feel fast.
#2about 3 minutes
Why enterprise teams choose the Angular framework
Angular is often selected for large applications because it provides an all-in-one package with a standardized architecture, despite common concerns about its bundle size.
#3about 3 minutes
How to measure web performance with browser tools
Use tools like Chrome DevTools and Google Lighthouse to diagnose performance bottlenecks and measure key metrics, but avoid over-optimizing for a perfect score.
#4about 2 minutes
Fixing layout shifts with a simple CSS trick
Prevent the common header-footer collapse and improve your layout shift score by setting a minimum height of 100vh on the body and HTML elements.
#5about 6 minutes
Improving initial load with shimmer animations
Combat the blank screen during initial load by adding a shimmer or skeleton animation directly into your index.html for a better perceived waiting experience.
#6about 5 minutes
Avoiding blocking JavaScript during app bootstrap
Prevent blocking the application's startup process by moving runtime configuration and localization out of the initial JavaScript execution path, favoring deploy-time or build-time alternatives.
#7about 2 minutes
Using non-blocking app initializers in Angular
Ensure tasks like analytics setup don't delay your application's launch by changing the return type of your Angular APP_INITIALIZER from a promise to void.
#8about 3 minutes
Enhancing runtime performance with CSS and UX
Mask slow backend operations by using CSS transitions on interactive elements, providing clear user feedback, and implementing optimistic updates.
#9about 1 minute
Loading costly data with parallel requests
Improve initial screen usability by loading essential data first and fetching computationally expensive or slow data in a separate, parallel request.
#10about 1 minute
Conclusion and key performance takeaways
Focus on perceived waiting time, customize your index.html with animations, avoid blocking JavaScript, and use optimistic updates to create the illusion of a faster application.
Related jobs
Jobs that call for the skills explored in this talk.
Matching moments
04:56 MIN
Key Angular features for building robust applications
Differential Loading
00:02 MIN
The web performance problem with modern frameworks
Interactive server side components
00:17 MIN
The challenges of large frontend frameworks like Angular
On tour with heroes == Moving from Angular to WebComponents
49:26 MIN
Applying key performance optimization techniques
Angular Unleashed: Mastering Modern Web Development with Angular
09:42 MIN
Why frontend performance is critical for users
Measure and improve frontend performance by using test automation
07:09 MIN
The performance problem with modern web applications
Qwik: Making sure that easy is same as performant
03:58 MIN
The two primary approaches for improving frontend performance
To New Frontiers: The Future of Frontend Development
00:38 MIN
Understanding Angular's foundation and role at Google
State of Angular
Featured Partners
Related Videos
Catching up on the basics you don't really need that much code
Chris Heilmann
Angular tips/tricks you can use from tomorrow on
Benedikt Starzengruber
Sleek, Swift, and Sustainable: Optimizations every web developer should consider
Andreas Taranetz
Snappy UI needs no Single-Page Application
Clemens Helm
Next.js Unleashed: Optimizing Web Vitals for superior User Experience
Eileen Fürstenau
The Lean Web
Chris Ferdinandi
Angular Features You Should be Using
Sani Yusuf
Differential Loading
Sani Yusuf
Related Articles
View all articles



From learning to earning
Jobs that call for the skills explored in this talk.


Webentwickler*in Angular Berlin / Hybrid
Tech Solutions Gmbh
Berlin, Germany
€60-75K
CSS
JIRA
Angular
Confluence
+2

Frontend Web Developer - JavaScript | React | Angular | Vue.js | Bootstrap | Tailwind | HTML | CSS
Tech Solutions Gmbh
Berlin, Germany
API
CSS
GIT
HTML
Scrum
+5

Frontend Web Developer - JavaScript | React | Angular | Vue.js | Bootstrap | Tailwind | HTML | CSS
Tech Solutions Gmbh
Brandenburg an der Havel, Germany
API
CSS
GIT
HTML
Scrum
+5

Frontend Web Developer - JavaScript | React | Angular | Vue.js | Bootstrap | Tailwind | HTML | CSS
Tech Solutions Gmbh
Bremen, Germany
API
CSS
GIT
HTML
Scrum
+5

Frontend Web Developer - JavaScript | React | Angular | Vue.js | Bootstrap | Tailwind | HTML | CSS
Tech Solutions Gmbh
Illingen, Germany
API
CSS
GIT
HTML
Scrum
+5

Softwareentwickler Angular
4k analytics
4k analytics
Leipzig, Germany
DevOps
Python
Gitlab
Docker
Angular
+2


Frontend Entwickler TypeScript, Angular
engelhardt softwareentwicklung
Ditzingen, Germany
API
GIT
Angular
TypeScript