Giter Site home page Giter Site logo

About SSG support about relay-nextjs HOT 5 CLOSED

reverecre avatar reverecre commented on August 29, 2024
About SSG support

from relay-nextjs.

Comments (5)

rrdelaney avatar rrdelaney commented on August 29, 2024

This library doesn't support SSG. I don't think it makes much sense to use Relay with traditional SSG sites because you miss out on much of what makes Relay so great including the normalized store for mutations, built-in pagination, and seamlessly lazy-loading part of the page. If you're building a SSG site that does fetch data and commit mutations I'd recommend using Next.js as a server-rendered app.

from relay-nextjs.

chrbala avatar chrbala commented on August 29, 2024

Can you reconsider this? There is a valid use case for some pages, or some parts of pages, to be SSG, and other parts could be SSR or lazily loaded. An example might be a static website (SSG) with an admin view on the same page (lazily loaded) for edits that push changes to the backend and rebuild the SSG side. In that case, the SSG data can be used to hydrate the cache in the editor view.

Basically, if all the preloaded information does not get stale quickly, and is not customized for a page, there are good reasons to prefer an SSG app.

from relay-nextjs.

rrdelaney avatar rrdelaney commented on August 29, 2024

@chrbala It's possible to use Relay in a client-side only fashion there without using this library. The admin page can be wrapped in a RelayEnvironmentProvider and use useLazyLoadQuery. There would only be a performance difference when the admin page is the initial navigation.

As far as populating the cache from the SSG data, there are several issues:

  • The page transition is blocked on the SSG data. One of the reasons this library exists is to get around that and let the page navigation happen immediately, made better by using Suspense.
  • Inserting the SSG data into the cache only to used on that page would require modifications to your Relay network layer, something this library stays away from.

Also to note: this library requires modifications to _app.ts that ensures Relay is loaded on every single page load. This will incur a performance cost on every other non-admin page in your app I would not recommend taking.

from relay-nextjs.

petrbela avatar petrbela commented on August 29, 2024

Does this also mean ISG is not supported? Unlike SSG, where the content doesn't change, in ISG you want to update the content periodically, sort of like a cached version of SSR. (Previously I used Apollo which worked both for SSR and ISG.) Do you have any pointers on how Relay could be used for ISG, either with or without this library?

from relay-nextjs.

rrdelaney avatar rrdelaney commented on August 29, 2024

@petrbela relay-nextjs uses getInitialProps internally for data loading so it's not possible to use with ISG. Additionally, Relay is probably not the library you want to use for statically generated pages. Although the API is nice, it's quite heavy on the page and contributes a significant amount to bundle size.

from relay-nextjs.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.