Next.js Discord

Discord Forum

Are Client Components/Motion.div bad

Unanswered
Blue orchard bee posted this in #help-forum
Open in Discord
Blue orchard beeOP
so I was trying out framer motion and works great for simple animations, but when I want to do an animation based on the hover state, I have to import the motion client component rather than server component, and have my component using it be a client component. I can understand why framer-motion would be making it a client component, and the additional functionality it brings for other types of hooks.

But I thought the whole mentality behind next was to have as few client components as possible, and you should be able to do that in a server component with basic css so I am a bit confused if client components are not that bad or motion.div is not with nextjs design philosophy

3 Replies

if server components give u enough benefit for nextjs to always be telling u to use them over client components, it just seems unnecessary to change my components into client components just for hover animation but idk too much exactly how nextjs client components work
motion components are fully compatible with server-side rendering.
client components are not that bad, they are needed for interactive UI, just don't make the entire page client component, the important part is to fetch data on the server and then you pass the data to client components.
client components are also pre-rendered on the server, so they don't kill your seo or performance