What is Server-Side Rendering? (Server-side Rendering with JavaScript Frameworks)
HTML-код
- Опубликовано: 4 июл 2024
- Server Side Rendering (SSR) is the process of taking a client-side JavaScript Framework website and rendering it to static HTML and CSS on the server. Why is this important? We all want fast loading websites and SSR is a tool to help you get your website rendered faster.
SSR flips the process of rendering a JavaScript framework app and when done right can give your users a better page load.
Watch more Server-Side Rendering with Javascript Frameworks: goo.gl/yaYkHX
Subscribe to the Firebase Channel to never miss a Server-Side Rendering episode: goo.gl/9giPHG 
Наука
Great job David! As always, on the point and putting a smile on the viewers' faces.
I feel like I never get to say how much I love these kids of videos.
Mint video David and co! Keen for the profiling comparison!
Best explanation about SSR that I found online. Thank you so much!!!
From: a Front End Developer
This was a really clear explanation of SSR
Already waiting for the next week's video! :)
crystal clear explanation, thank you David!
Glad you enjoyed it!
This is awesome!! Thanks David :)
I love you Firebase.
This introduction got me so hype!
Good video and much needed content !!
Hello,
Riot for sure should be one of the libraries you guys should cover and thank you guys for implementing cloud functions to firebase. That was the last missing peace for web app developers on your platform to be the best in the market!
Thanks David. Nice graphics.
Thank you for sharing this informative video! 😺🖐
This was awesome!
Thanks for the explanation
Also good video, easy to watch.
Thank you for this video. It answers several questions I had about SSR. In addition to the process, the benefits and costs are also well-explained.
I love Angular and now ... Firebase!!!
How firebase server side rendering can be used for SEO?
Million thanks 😊
I was waiting since 8 months for firebase to bring this server side rendering feature.
Please do forecasts 3 times a week. You are my favourite firecast anchor 😊
You guys should make a tutorial on Authentication with a Social Media account with Node and Express. It's so confusing and I think it's a critical step to building a website / web app with a user database.
ErraticFox which part are you struggling with? Perhaps I can help.
Will if you have Discord which would be easier to message back and forth add me ErraticFox#1742 I'd really appreciate it. :)
Right now I'm having an awful time making a route to authenticate a Facebook login and then storing it in the session. Though, I can't even make it past the route part as it keeps giving me a "location.protocol" error even though it's through the firebase serve command with hosting and functions. Thanks for the reply :)
Well, this is the Firebase RUclips channel, so obviously they'd like you to use Firebase for the Backend & Auth instead of doing it yourself with Node+Express. Which, btw., is totally what I would recommend, because it makes it real easy.
Dennis Martin Herbers they even have a tutorial to set up a node + express app. Why would they not want you use Node + Express, but have a tutorial to set that up?
Passport.js implements authentication perfectly for Node.js so you dont need to reinvent the wheel here.
Various startegies for Social Media authentications are also supported. you can check it out here passportjs.org/docs
Just thumbed you up!
Dude you saved my college essay
Wow it will be enjoying
Hey Firebase! Thank you for the video. I would also like to see some videos on SSR with Polymer.
Please include polymer 2.0 too
More more more!
Can we get a tutorial on how to do this with vanilla jJavaScript custom elements? It seems weird to cover server side rendering g of component driven frameworks without doing vanilla custom elements.
So which one is getting rendered first? server-side, or client-side?
I like Thumps Up and here is one for you
Is there place I can buy this wooden Firebase logo like on David's macbook?
Ivan Kuznetsov hahahah
I thought it was a Google FireBook
Could you yeah about anything that needs to be done with ionic3 and angular
is there a way to use ssr without frameworks, just plain vanilla js, css and html?
I only see solutions for react, next nuxt etc. and I dont like excess crap for a simple blog or a few page website
I just wondering if this "Server-Side Rendering" can help to solve the dynamic generation of Open Graph meta tags problem faced by social media crawler like Facebook?
i´m started develop my app using framework7+vuejs+webpack+cordova and i has get a simple exemple of SSR, but i abandoned the project and restart using only framework7+cordova, because the sintaxe of vuejs is totaly diferent for me, please begin the next video showing a vuejs exemple. thanks
what I can do for fix in xcode9 I can't connect (enable)???
How can I know if my server (website host) allows me to give a service to my users where I let them download a pdf based on the text/spacing options selected by them on a HTML form. Is there any free service which can be installed on the webserver?
Hi, In my angular app ,I am facing the issue that on home page there are lot of external libraries(hosted in cdn) which needs to load ,so it takes a lot of time in initial page rendering, So is SSR an solution to it?? Is there any other possibility to solve this i.e minimize initial page load time ??
Hello, please tell me, is server rendering too important thing to know? will all web applications in future work with server side rendering?
can we use withRouter HOC from React-router-dom in server side rendering as well?
Angular/React would be good for next video.
I found this video from the Angular Gitter chatroom
Is there any benchmarking on how much SSR improves the first load latency?
Also, it almost seems that SSR is solely beneficial for the first load use case, can it be useful elsewhere?
Yeah... SSR is also useful for search engine crawlers(bots), for SEO. You can learn more about it if you google.
great
Show how to use Next,js and React.js
What will you say about BUN?
how do you explain this to a customer
NUXT please
How to host a password protected page/PDF/asset with server side rendering?
Vue and Nuxt!
Ionic Framework ?
Angular is working client side
So it is nun sense to connect database from client directly
I think we don't need database connection in client side
What about Thymeleaf?
NEXT !
Flutter, baby.
Please add Marko framework. It's fast and easy to learn.
Me: can we take Colt Steele's courses?
Mom: no, we have Colt Steele at home
Colt Steele at home:
How is this different to things like Django or other server side 'full stack' frameworks? Isn't rails doing that? I thought we were past this point...?
Am I misunderstanding anything? We're basically sending a prerendered html as a response right?
Not exactly, but your comment make sense. The think you've missed is that it's "applicable only to the first render". Treat this as "those cards in facebook, while waiting for the site to load", but instead of a dummy preloader -> it's a preloader with a real content of user site, until JS kicks-in))))
Can Polymer Elements be used in SSR?
Daniel Gherard good question, what about Polymer and Web Components?
Yes.
Ok. Thanks. I'll check it out.
Lets call it Isomorphic javascript to confuse all the new kids
Holy man I just read that thing of Isomorphic but still with some confusing things
I read it, says it's like SSR where it is rendered on server and sent to the client while in the background the JS bundle for the SPA downloads. The difference? No idea. But that's okay, will see about it.
Waiting for a room with a vue.
NodeJs please !
ssr 4 angular please!
NEXT FIRST !
Svelte.js would be a good contender I believe to be included.
Thanks
Vue Js please
Nuxt first please!
the BGM!!!!!!!!!!!!!!!!!!
waiting for vue.js
NEXT first.
Hi please add nuxt.js, It is similar to vue js.
As far as I know, they are in fact _so_ similar, that the techniques for VueJS can be applied to NuxtJS.
Express JS?
Hudson Taylor
VueJS baby
I don't know dude, i have a feeling that this video is a firehost ad :v
Angular first PLZ :)
Angular first pls !
riotjs please.
Reaaact first pls. 👍
Riot.js please!!
Yeeeaaa!
React on meteor!
React please
Julian Klumpers i have an example with nextjs here => github.com/Bolket/next-firebase-functions
Senks
No polymer? :/
If you live in germany you dont have to simulate a slow internet connection ;-)
So basically SSR is what we always had automatically before SPAs? Like PHP, or cshtml? Why nobody compares SSR with these?
Vue js
react
Node js
I'd like to see a video on Aurelia. I've build an app with Aurelia and Firebase (isopro.solutions) and I'd like to get SSR working.
Thanks!
Please cover React first.
Still a Mac Book bro.. 😂
The sound effects are distracting and sound like a phone noise
soydev
Firebase les falta un canal en español 😭
Use vanilla JS in place of the slow and heavy frameworks, and you have no need for server side rendering.
jQuery please
just kidding
Haha
It's promotion video, not useful
Why should one use these js frameworks in the first place, use good server side language like PHP, JAVA, C#,Ruby to generate the desired HTML
NEXT !
Vue Js please