Pre-Rendering Strategies

on YouTube ↗23m

" summary

Angular server-side rendering uses Angular/platform-server and renderModuleFactory to output HTML ahead of bootstrap, improving time to first meaningful paint while avoiding large hits to time to interactive. Options are app-shell, critical content, or full session rendering; timing choices are build-time, request-time, lazy/cron with caching. Example: 100,000 products × 10 locales would be ~10 billion pages at build time, reducible to a million by skipping user-specific widgets. Event-replay libraries (Jeff Whelply et al.) record and replay interactions during bootstrap.

AI-written summary · about

" chapters (9)

1. 0:00Introduction
2. 0:31Jeffs background
3. 1:43What is prerendering
4. 7:12Prerendering process
5. 9:34Replaying user events
6. 11:40Prerendering strategies
7. 13:36Content strategy
8. 17:37User strategy
9. 18:31Use cases

" related talks

• 21mStrategies for Server Side Rendering Angular ApplicationsVikram Subramanian · NGConf 2018
• 22mAngular Pre Rendering for SEO, Speed, and Happy UsersJeff Cross · ng-conf 2017
• 19mA plethora of rendering ideasMateusz Do Duc · NG Poland 2022
• 28mServer-side rendering with Angular 2Wassim Chegham · NG Poland 2016
• 41mServer-side rendering with Angular—be faster and more SEO, CDN and user-friendly!Maciej Treder · JavaScript fwdays'19
• 24mAngular 2 Server Side RenderingWassim Chegham · Angular Camp 2016
• 15mPersonalization, Performance, and Probably Dynamic ContentJeff Cross, Kaitlyn Ekdahl · ng-conf 2019
• 26mServer Side Rendering with Angular UniversalNir Kaufman · AngularUP 2016