One time rendered layout

[hi-rad]

Hi everyone,
I am not sure if this is a bug or its the normal behavior.
When a page renders getInitialProps is called. Every time you go to that page, the getInitialProps will do whatever it has to do.
I was struggling to have a one time rendered layout for my pages and I came across with-app-layout. I mixed this example with, with-redux example. When reading about using _app to define a global layout, I thought that _app will be rendered only once. However, when I added a console.log statement in the render function of my layout, on every page change, I could have seen the result of the console.log statement and basically it was being rendered over and over again. Is this normal (intended)? Also, my original question is related to #88 (comment)
Imagine we have a layout with a dynamic menu, when and how can we use redux to fetch menu items? When using _app getInitialProps, on every request the items are beign fetched. Is this normal? Should we have an if statement in the getInitialProps to check, whether the items have been fetched or not?
Also this comment points out the same issue #88 (comment)

Next Version: 6.0.2

[dihmeetree]

Was wondering this myself tbh.. i've been playing around with the new _app.js file and for right now.. i'm just checking to see if the current request is being made by the server or not.. so that the function isn't run every time a user goes to a new page.

For example:

 static async getInitialProps({ Component, ctx }, apolloClient) {
    const isServer = !!ctx.req

    if (isServer) {
      // Redirect user based on authorization.
      await checkRedirect(ctx, apolloClient)
    }

    const pageProps = Component.getInitialProps
      ? await Component.getInitialProps(ctx)
      : {}

    return { pageProps }
  }

Note: It would be nice if we had some way to only render Components once.. for example with layouts 😸

[timneutkens]

I thought that _app will be rendered only once.

This is not the case. Like any React Component render will be called whenever new props are passed / state is set. That you see it re-render could be related to react-hot-loader in development though.

When using _app getInitialProps, on every request the items are being fetched. Is this normal?

getInitialProps in _app.js implements getInitialProps of the page. So yes, it's called on every page change.

Should we have an if statement in the getInitialProps to check, whether the items have been fetched or not?

If you're using global state like Redux you should always check if items you need are already there, otherwise you're doing unneeded fetching.