All 5 Server-Side Rendering with Angular Universal questions
More in Server-Side Rendering with Angular Universal
What is server side rendering in Angular, and why would a team enable it using Angular Universal? What is hydration in the context of Angular server side rendering, and why is it necessary? How do you fetch data on the server before rendering a page with Angular Universal? What browser specific APIs commonly cause problems when running Angular code on the server, and how do you handle them safely?
Advertisement
Back to results for “Project Structure”
Angular › Server-Side Rendering with Angular Universal

What are the main benefits of adding server side rendering to an Angular app?

Beginner

Answer

Server side rendering improves how quickly visitors see meaningful content, since the browser receives already built HTML instead of an empty shell. It also improves how well search engines can read and index your content, and it can improve the experience for visitors on slower devices or networks, since less work needs to happen in the browser before the page becomes usable.
// Without SSR: visitors see a blank page until JavaScript finishes loading and running
// With SSR: visitors immediately see fully rendered content, even before JavaScript finishes loading
Real-world example A company's marketing website adopts Angular Universal specifically to improve their search engine rankings, since search engines can now easily read the fully rendered page content without needing to execute JavaScript first.

Common follow-ups: Does every Angular app actually benefit from server side rendering, or only certain kinds?;What is the tradeoff in server infrastructure cost when adding server side rendering?

Angular CLI & Project Structure;Performance & Lazy Loading
All 5 Server-Side Rendering with Angular Universal questions