Sven van Straalen

on YouTube ↗20m

" summary

Compare client-side Angular to Angular Universal server-side rendering by example: a toy bank app that renders full HTML + metadata on the server so pages visibly load faster and show previews on Twitter/WhatsApp, with commands like build:ssr / serve:ssr added by the schematic. Implementation uses the Express engine, Webpack/tsconfig for CommonJS, Bootstrap for styles, deploys as a ZIP to Elastic Beanstalk and caches with CloudFront/Firebase. Watch for issues: no window/document, slow setTimeouts, extra server load and responsiveness quirks on SSR.

AI-written summary · about

" chapters (8)

1. 0:00Start
2. 3:16Critical render path
3. 3:46Render timeline CSR
4. 4:41Render timeline SSR
5. 5:46Bankular SSR
6. 8:18Some new files
7. 11:58CSR VS SSR SEO
8. 14:07Good to know

" related talks

• 26mServer Side Rendering with Angular UniversalNir Kaufman · AngularUP 2016
• 19mAngular Universal & Our New PrerendererWagner Maciel · ng-conf 2020: Hardwired
• 51mThe Jedi Path to Angular UniversalMichel Murabito · Angular Day 2018
• 28mServer-side rendering with Angular 2Wassim Chegham · NG Poland 2016
• 21mStrategies for Server Side Rendering Angular ApplicationsVikram Subramanian · NGConf 2018
• 24mAngular 2 Server Side RenderingWassim Chegham · Angular Camp 2016
• 42mUniversally SpeakingCraig Spence · ComponentsConf 2019
• 31mAngular Universal in the Real WorldCraig Spence · AngularUP 2019