questions about client/server rendering
Unanswered
Horse guard wasp posted this in #help-forum
Horse guard waspOP
if i have some pages that are entirely client side, for example something like this:
===================================
"use client";
import { useEffect } from "react";
export default function CsrPublicPage() {
useEffect(() => {
console.log("helloooo 2");
}, []);
return (
<div className="flex justify-center align-middle pt-10">
CSR Public Page
</div>
);
}
===================================
does this always get rendered on the server, even if i already loaded the app and i'm navigating from another page? because in my mind there are some pages which are entirely client related, they dont need to be server rendered, and if this happens then i'm going to send more requests to my nextjs server with no reason, these pages dont need to be SEO friendly. and this will drive the cost of my server hosting up. am i wrong?
dont take this example too specifically btw, it could be an internal page that doesnt need SEO, and is fetching data on its own
===================================
"use client";
import { useEffect } from "react";
export default function CsrPublicPage() {
useEffect(() => {
console.log("helloooo 2");
}, []);
return (
<div className="flex justify-center align-middle pt-10">
CSR Public Page
</div>
);
}
===================================
does this always get rendered on the server, even if i already loaded the app and i'm navigating from another page? because in my mind there are some pages which are entirely client related, they dont need to be server rendered, and if this happens then i'm going to send more requests to my nextjs server with no reason, these pages dont need to be SEO friendly. and this will drive the cost of my server hosting up. am i wrong?
dont take this example too specifically btw, it could be an internal page that doesnt need SEO, and is fetching data on its own
5 Replies
yeah, even it's a client component, it's still rendered on the server
Horse guard waspOP
so if i have a separate backend, and i'm building an internal app which has no need for SEO, it would mean a normal react app would be better in cost and performance no?
instead of sending a request to the nextjs server on every route change, i only have to send 1 request when the user first accesses the app, and then only have to fetch required data from backend. also considering nextjs has to verify the user is authorized to access the page on every route change, when in comparison in a react app you just save the auth state locally when you first log in.
another example, if i have an app that requires SEO only on certain pages, for example a landing page, an about page, and certain static pages like those, can i just create those pages in the public folder of my react app and not have to use Nextjs?
from what i've gathered, Nextjs is useful if you have something like an ecommerce or blog app, that requires good SEO and also has public pages that fetch dynamic data.
instead of sending a request to the nextjs server on every route change, i only have to send 1 request when the user first accesses the app, and then only have to fetch required data from backend. also considering nextjs has to verify the user is authorized to access the page on every route change, when in comparison in a react app you just save the auth state locally when you first log in.
another example, if i have an app that requires SEO only on certain pages, for example a landing page, an about page, and certain static pages like those, can i just create those pages in the public folder of my react app and not have to use Nextjs?
from what i've gathered, Nextjs is useful if you have something like an ecommerce or blog app, that requires good SEO and also has public pages that fetch dynamic data.
it's correct, mostly they use normal react.js for their internal app that doesn't require SEO
for those landing pages, and other static pages, go with Next.js