Angular server-side rendering with @ng-toolkit/universal
Introduce server-side rendering with @ng-toolkit/universal, and make it readable for search engine robots.
4 min readMay 27, 2018
SPA pitfall — SEO
Most of the Single Page Applications have one big problem. They are rendering and working on the client side. Now you can shout at me: “Hey! This is an advantage, not pitfall!”. And you are completely right. The problem starts when your application renders ONLY on the client side.
How crawlers explores the web?
The problem is that search engine robots/crawlers work similar to the curl command. Why? Launching browser and executing JavaScript is an expensive task. There is no time and resources to do that when you need to search thousands of pages.
Let’s create an angular app and check, how robots see it:
ng new myApp
cd myApp
ng serveNow in the other terminal window execute curl command and take a look at the output:
$ curl localhost:4200<!doctype html><html lang="en"><head><meta charset="utf-8"><title>MyApp</title><base href="/"><meta name="viewport" content="width=device-width, initial-scale=1">
