Usage with static generation

[divyanshu013]

Hi, I recently switched to using next-apollo to simplify SSR for my graphql queries. It works perfectly for my SSR but I lose out on automatic static optimization.

Here's a simplified version of my code:

import { withApollo } from 'next-apollo';

// ...

export const withSsr = withApollo(apolloClient);

// then I use it to wrap my pages

function Home(): JSX.Element {
    // some graphql queries here
    return (
        <>
            <Seo />
            <Navbar />
            <Layout>
                <Heading>Featured</Heading>
            </Layout>
        </>
    );
}

export default withSsr({ ssr: true })(Home);

For this page I know the queries at build time so I was thinking of making use of static generation to evaluate my queries ahead of time.

Is there a simpler way to take advantage of next-apollo during build time for this usecase? Or do you think it would be better to do it manually? Thanks.

Dependencies

• next 9.4.4
• apollo-client 2.6.10
• next-apollo 4.0.1

[adamsoffer]

@divyanshu013 yeah if you use SSR on a page it won't automatically be statically generated. If SSG fits the use case of your app go for it. Vercel's with-apollo example has been updated to showcase how to use SSG. If your app is highly dynamic and data is updated very frequently you might want to wait for Next.js to release its on-demand revalidation feature (it currently only supports interval based revalidation.

[divyanshu013]

Thanks for the info Adam. I was earlier on the master branch which is probably why I missed the updated example. Also seems like the current example doesn't uses next-apollo at all.

Also wasn't aware about the upcoming on demand revalidation, will keep an eye out for that.