Skip to content

Instantly share code, notes, and snippets.

@craigtaub

craigtaub/ssr architecture

Last active May 18, 2020 14:52
Show Gist options
  • Save craigtaub/295197c8e400e45a2c3d31e33409e6f6 to your computer and use it in GitHub Desktop.
Save craigtaub/295197c8e400e45a2c3d31e33409e6f6 to your computer and use it in GitHub Desktop.
Download ZIP
SSR architecture
Raw
ssr architecture
1. User requests (dns lookup etc)
2. Server receives request
- Express
- Returns below in 0.25ms.
<html>
<script google-analytics>
<body>
<div>hey there</div>
<script app.js>
</body>
</html>
3. User receives response
<html>
<script google-analytics> -> 1. BLOCKED..download/parse/execute...1s
<body>
<div>hey there</div> -> 2. RENDER THIS...react app, server-side..not interactive (no clicks)
<script app.js> -> 3. download/parse/execute ...react app, client-side...now interactive..1.5s
</body>
</html>
OVERALL
- User SEES content after 1.5s vs 3s
- ONLY initial page load...both now SPA
- SEO?
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment