Stack Overflow
Stack Overflow

Questions tagged [server-side-rendering]

Serverside rendering is a technique for rendering a client-side app on the server.

Rendering a client application on the server results in a faster experience for end users since they do not have to wait for assets to load before they can see and interact with an app. This is accomplished by using isomorphic code: code which is used on both the server and the client.

4406 questions
10
votes
4 answers

How to prevent css animation to reoccur when angular SSR bootstraps the app

I built a landing site using Angular. To make it SEO friendly, I had to do prerender it. The landing page starts with an intro animation (using CSS' animation). When I first load the page/full reload, the animation starts, and in the middle the app…
Eliya Cohen
  • 10,716
  • 13
  • 59
  • 116
10
votes
2 answers

Server side rendering React in Java Springboot

I'm new to server side rendering & I want to render React components on server side and pass down it in html. I followed this tutorial on https://spring.io/guides/tutorials/react-and-spring-data-rest/. It is still rendering on client. I cannot find…
yogupta
  • 188
  • 1
  • 3
  • 9
10
votes
1 answer

Webpack 4 for SSR, How to solve this ReferenceError: window is not defined?

I have 3 webpack.config files to enable Server-Sive-Rendering. webpack.base.js webpack.client.js webpack.server.js Build Script "scripts": { "dev": "npm-run-all --parallel dev:*", "dev:bundle": "nodemon --watch build --exec \"node…
Shawn Baek
  • 1,928
  • 3
  • 20
  • 34
10
votes
3 answers

Next.js: How to dynamically import external client-side only React components into Server-Side-Rendering apps developed?

I know this question has been asked multiple times before but none of the solution seems to work. I'm trying to use the library 'react-chat-popup' which only renders on client side in a SSR app.(built using next.js framework) The normal way to use…
Lew Wei Hao
  • 763
  • 1
  • 13
  • 25
10
votes
2 answers

How can I use style-loader in react SSR (Server Side Rendering)?

As you know, we can easily use style-loader to add our styles to our react project, but the window is not available in Server Side Rendering, so how I can use style-loader (or something instead of that in SSR project)? When I use style-loader, it…
Pouya Jabbarisani
  • 1,084
  • 3
  • 16
  • 29
10
votes
1 answer

React SSR, NextJS vs Chrome headless prerendering

For server-side rendering I found 2 approaches: next.js chrome headless prerendering (ex react-snap) NextJs has a lot of stars on GitHub and a great community but the other approach (chrome headless prerendering) seems cleaner and need nearly…
Saman Mohamadi
  • 4,454
  • 4
  • 38
  • 58
10
votes
3 answers

React app with Server-side rendering crashes with load

I'm using react-boilerplate (with react-router, sagas, express.js) for my React app and on top of it I've added SSR logic so that once it receives an HTTP request it renders react components to string based on URL and sends HTML string back to the…
George Borunov
  • 1,562
  • 1
  • 15
  • 14
10
votes
1 answer

Why react server side rendering strips event handlers?

I have a React Server Side rendered component with img tag. I want to attach an onload event listener on the image tag and made the component like below: render () { return ( { console.log('Image loaded'); }}…
Aditya Singh
  • 15,810
  • 15
  • 45
  • 67
10
votes
1 answer

Keeping session alive after page refresh with server side rendering using react.js

Although not being exactly sure if this is a react specific question: We are developing and application using react/redux stack with server side rendering. After user logs in we receive two cookies one for identity and one for session in the browser…
ralzaul
  • 4,280
  • 6
  • 32
  • 51
9
votes
2 answers

Next.js 13 and next-auth issues with useSession and SessionProvider

I'm trying to make a login page. on my page.tsx file I get either of two errors depending on if I include "use client"; at the top of my code. If I don't have "use client"; I get this error: Error: React Context is unavailable in Server…
atomic-ag
  • 109
  • 1
  • 4
9
votes
7 answers

Next/image component gives error "missing required "width" property." when running it with npm run dev

When i run my NextJS app using npm run dev the Image component gives the error "missing required "width" property" To make the app work, i need to set width and height as inline attributes for all Image components in the project. **NOTE: I tried…
Shareef Dweikat
  • 361
  • 2
  • 13
9
votes
4 answers

Pass props to page.jsx child from root layout (next.js 13)

How do you pass props to the the page.jsx of layout? (NEXT 13) //app/blog/layout.jsx export default function RootLayout({ children }) { return (
{/*How do I pass any props from this root layout…
Vivaan Kumar
  • 457
  • 3
  • 4
  • 9
9
votes
1 answer

Next.js getServerSideProps (throw Error) results in 404 instead of 500

I have very basic setup, of getServerSideProps with Sentry error logging in Production on Vercel export const getServerSideProps = async () => { // some api call if(error) { throw new Error("Something went wrong") } return { props: { …
duskandawn
  • 646
  • 1
  • 10
  • 19
9
votes
3 answers

How to use SSR with Stencil in a Nuxt 3 Vite project?

In Nuxt 2 I could use server-side rendered Stencil components by leveraging the renderToString() method provided in the Stencil package in combination with a Nuxt hook, like this: import { renderToString } from '[my-components]/dist-hydrate' export…
Thijs
  • 568
  • 6
  • 16
9
votes
1 answer

Why is blazor HeadOutlet rendering after the App

I'm using a HeadOutlet on a server side pre-rendered net6.0 app to set some header tags such as meta description but the server renders the app first and then the headers which makes search engines ignore it. @page "/" @namespace…
user3713080
  • 399
  • 4
  • 17
1 2 3
…
99 100