Server Side Rendering with Angular Universal

on YouTube ↗26m

" summary

Angular Universal renders Angular apps to static HTML on the server for better SEO, faster first paint and correct social previews, then boots the client app and rehydrates the view while preserving interim user input with the preboot record-and-playback library. The demo uses an Express server and Express createEngine wiring to render the main Angular module, caches API responses so the client skips duplicate data fetches, and recommends inlining templates/styles and avoiding direct DOM calls. Node and .NET renderers exist; production maturity is still progressing.

AI-written summary · about

" chapters (17)

1. 0:00Intro
2. 1:04What is Server Side Rendering
3. 1:50Classic Server Side Rendering
4. 2:38SEO
5. 3:52Site Preview
6. 4:36Shell Architecture
7. 7:02Server Side Rendering
8. 7:43Angular Universal
9. 9:05Getting Started
10. 9:36Single Page Application
11. 10:46Reboot
12. 12:09Reboot Library
13. 12:34Recap
14. 13:14Best Practices
15. 16:31Future of Universal
16. 17:19Angular CLI
17. 18:12Demo

" related talks

• 28mServer-side rendering with Angular 2Wassim Chegham · NG Poland 2016
• 51mThe Jedi Path to Angular UniversalMichel Murabito · Angular Day 2018
• 24mAngular 2 Server Side RenderingWassim Chegham · Angular Camp 2016
• 21mStrategies for Server Side Rendering Angular ApplicationsVikram Subramanian · NGConf 2018
• 19mAngular Universal & Our New PrerendererWagner Maciel · ng-conf 2020: Hardwired
• 20mSven van StraalenSven van Straalen · AngularNL 2019
• 31mAngular Universal in the Real WorldCraig Spence · AngularUP 2019
• 41mServer-side rendering with Angular—be faster and more SEO, CDN and user-friendly!Maciej Treder · JavaScript fwdays'19