search

YardWill / fontend-question

This is a project to answer and communicate question.
5 stars 2 forks source link

When we use SSR and how? #1

Open YardWill opened 5 years ago

YardWill commented 5 years ago

The purpose we use SSR is for first screen time. I use SSR for our activity project, because it always be a page toward C-end users. There is many SSR framework to save your life.Such as NextJS(react), NuxtJS(Vue). And I will show you first screen time when using SSR(based on React). Elk APM provide the data to analyze the first screen time.

  1. without SSR: 1300+ms
  2. with SSR: 400+ms

It's a big optimization.

But there is a question: server side render need CPU and Memory.

  1. without SSR TTFB: 1ms
  2. with SSR TTFB: 30+ms

So the server maybe get down by the too many user access. How resolve it? The most easily solution is to use a server side cache.

We will cache all the server side render html by router path, so the server will not repeat render the same page again and again.

There is the data we use server cache

  1. without SSR TTFB: 1ms
  2. with SSR TTFB: 30+ms
  3. with SSR and cache TTFB: 2ms
YardWill commented 5 years ago

And another question: If we use micro service on our server, how can we decide the cache part between server side render html and server side data fetch?

YardWill commented 5 years ago

https://github.com/alibaba/beidou/blob/master/packages/beidou-docs/articles/high-performance-isomorphic-app.md#%E7%BB%84%E4%BB%B6%E7%BA%A7%E7%BC%93%E5%AD%98

To cache the component from all the page.