Channel
Interviewed Person
Aurora Scharff
[Applause] okay thank you thank you for that introduction so uh good afternoon I hope you're having a great day here in this beautiful city of Athens and enjoying the conference I'm excited to be speaking today and present the topic of react server components so the topic is react server components why should you care uh obviously react and JavaScript is ever relevant and with RSC we have a
completely new way to build react apps react server components allow us to fade the boundary between the server and the client to create Rich user interfaces with minimal client side code while still maintaining interactivity and performance so my goal today is to introduce motivate and provide resources about RSC so uh this was already pretty much said but I'm from Norway I work as a consultant uh and I'm actually working with RC in my current consultancy project
so the talking points of today is going to be first rendering strategies then we'll get to react server components what they are how they work and the benefits and the drawbacks then we'll go through the nextjs app router onto best practices and patterns when using RC in nextjs afterwards I'm going to show you a demo um with some examples of RZ and then finally I'm going to give my thoughts on the future of react server components so let's begin with rendering strategies you can't have a talk about web development without without
mentioning them is a crucial prerequisite and I'm not going to mention every type of rendering strategy and the history of the web here but uh I'll pick and explain some relevant topics and this might probably be familiar to a lot of you so static website rendering is the most basic rendering pattern where all web pages are assembled beforehand and uploaded as static files to a storage bucket it can be built with plain HTML and CSS or combined with JavaScript it's delivered exactly the way it's stored meaning nothing will change unless the code is
changed uh and although quite simple and efficient it doesn't handle Dynamic data or interactive websites well and it's uh imprac impr practical to maintain a use case could be an informational website for a business and you could say that this is the old way of making websites and it's not used very much anymore the multipage applications on the other hand can handle Dynamic data in npas HTML and data is merged on the server per request and sent as one package to the client the US user will
open the browser and is serve the merge result and the entire page reloads per request or navigation to a new page they can be created with for example the asp.net MVC pattern or with PHP or Ruby on Rails use cases would typically be uh an e-commerce app for example Amazon is an MPA so what are the pros of npas firstly all the page content can be read and indexed by search engines uh because it's rendered HTML allowing them to
appear in search results and be optimized for it then there is no restriction on the number of pages you can add performance will be the same meaning they have unlimited scalability last they can provide more website insights for example Google analytics can create reports for each page and the cons they have slower overall performance because they fetch each page uh as a package of HTML CSS and JavaScript from the server as it's being navigated to they can also require
more effort to create features and they can be harder to maintain because each page needs to be maintained separately then we have the single page application or Spa a spa will typically be a react app of create react app or vit or angular app .js app Etc it's been the most common way to build an application for many years in a spa the bundle.js file includes everything needed to build the app the entire HTML is created on in on the browser as the
