Does using `getInitialProps ` in custom _app component in next.js disable client-side rendering?

Question

According to next.js official documentation:

import React from 'react'
import App from 'next/app'

class MyApp extends App {
  // Only uncomment this method if you have blocking data requirements for
  // every single page in your application. This disables the ability to
  // perform automatic static optimization, causing every page in your app to
  // be server-side rendered.
  //
  // static async getInitialProps(appContext) {
  //   // calls page's `getInitialProps` and fills `appProps.pageProps`
  //   const appProps = await App.getInitialProps(appContext);
  //
  //   return { ...appProps }
  // }

  render() {
    const { Component, pageProps } = this.props
    return <Component {...pageProps} />
  }
}

export default MyApp

As far as I understand if I use getInitialProps in my _app.js file this will cause my pages to be server-side rendered. But does this mean that client-side rendering will not work (navigation etc.)? If not what exactly is meant by

causing every page in your app to be server-side rendered.

?

Answer 1

You are not got it correctly, only Automatic Static Optimization will be disabled, cause if you are using getInitailProps that means the page is not static (requires additional data from the server in order to render), so Next can't generate a static html file for it.