Graceful degradation - is when you develop for modern browsers first and for less modern browsers (category which also includes browsers with disabled JS) you provide less features, but still it is decent experience, not something broken.
SSR - server side rendering. React components kind of decoupled from render implementation, so you can use rect-dom in the browser and it will generate DOM nodes, but it will generate strings on the server. This decoupling allows you to render React applications on the server. Please tell me if I failed to explain. Side note: there are also renderers for native applications, for Canvas, for terminal.
I'm ashamed that you feel like that. I didn't try to sound smart, it's just how I call it at work. Please don't feel like that. I will try to explain some of those, feel free to ask questions. This post was more like I thought out loud about pros and cons. I guess this type of posts are not beginner friendly
Thanks for the thorough follow up! I'm not really huge into the JS ecosystem so SSR is still hazy. So let's say I built a React implementation of a shopping cart and stuff it into a shopping-cart.js. If a client issues a GET request to /shop, I build a template, include the relevant HTML and CSS and of course the JS file, and return that to the client. How is SSR different from that?
You know how typical React based website looks like - there is html with header, scripts, styles but without actual content, like it has <div id="main"></div> where React will be mounted as soon as application loads in the browser. With SSR this div will be prefilled with HTML, the same one as React would generate in the browser, but now it is done on the server. Make sense?
Oh yeah I get it now. "rendering" in this context pertains to the ReactDOM.render(document.getElementById('root'), <ShoppingCart />); which happens on the server as opposed to being done once the client loads the page.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
I'm quite ashamed that there's a lot of terms here that I don't fully understand. Oh btw, that cover photo is spooky once your post reached the top :/
Graceful degradation - is when you develop for modern browsers first and for less modern browsers (category which also includes browsers with disabled JS) you provide less features, but still it is decent experience, not something broken.
SSR - server side rendering. React components kind of decoupled from render implementation, so you can use
rect-domin the browser and it will generate DOM nodes, but it will generate strings on the server. This decoupling allows you to render React applications on the server. Please tell me if I failed to explain. Side note: there are also renderers for native applications, for Canvas, for terminal.First Meaningful Paint - see this image
source
I'm ashamed that you feel like that. I didn't try to sound smart, it's just how I call it at work. Please don't feel like that. I will try to explain some of those, feel free to ask questions. This post was more like I thought out loud about pros and cons. I guess this type of posts are not beginner friendly
Thanks for the thorough follow up! I'm not really huge into the JS ecosystem so SSR is still hazy. So let's say I built a React implementation of a shopping cart and stuff it into a
shopping-cart.js. If a client issues a GET request to/shop, I build a template, include the relevant HTML and CSS and of course the JS file, and return that to the client. How is SSR different from that?You know how typical React based website looks like - there is html with header, scripts, styles but without actual content, like it has
<div id="main"></div>where React will be mounted as soon as application loads in the browser. With SSR thisdivwill be prefilled with HTML, the same one as React would generate in the browser, but now it is done on the server. Make sense?Oh yeah I get it now. "rendering" in this context pertains to the
ReactDOM.render(document.getElementById('root'), <ShoppingCart />);which happens on the server as opposed to being done once the client loads the page.