Firebase Hosting is not only used to deploy static websites, it is also used to deploy dynamic Node apps.
Firebase Hosting is backed by a CDN. Hence, there are many cool ways in which we can optimize our page loads.
When a user makes a request, it goes to the server. The server does all the dynamic generation and sends the response back to the user.
Sometimes, the user can be really far away from the server. In that case, it can actually take a long time to make this round trip. So it would be really good if we didn't have to send our content back this far. What if we have a server to cache the results right near the user. Well, this is how a content delivery network works.
You will notice that a cached page loads much faster than a page that is not. Why does this happen?
Imagine a user that makes a request for our website. But with a content delivery network, it is going to stop at the edge server which is close to the user. And the edge server is going to check to see if the content is in its cache. If it's not in it's cache, its going to forward the request off to the origin server. The origin server is going to do the dynamic content generation, and then it's going to send back to the edge server. The edge server is going to cache this content, which will be controlled by the cache control header that you set. It will then send that content back to the user.
Now, let's say there is another user in that same area that makes a request for the website. That request will go out to the edge server, and the edge server will recognize that it has this content in the cache. So rather than going out to the origin and doing the new dynamic generation of the page, it's going to send back the content to the user and that response time is going to be much, much faster, because it is local to the user.
Also, the other users in this area can make requests for this content, and it doesn't have to go out to the origin server. It goes right back from there local edge server for really fast page load.
After the cache process expires, the whole process will begin again, where we go out to the edge server, the edge server recognizes that the content has expired, so goes out to the origin. Origin dynamically generates, sends it back, caches it according to your cache control headers, and then back to the user, where it's cached.
You can now host Node apps on Firebase Hosting and you can take that generated result and store it into a CDN for a huge perf benefit.
What about JavaScript Frameworks?
With JavaScript frameworks, all of your content in your render is held up in JavaScript. Modern JavaScript frameworks have tooling around server-side rendering. So you can take that same client-side app, render it out on the server for a fast first paint.
Thank You!
Top comments (0)