Isograph, GraphQL-powered React apps with great DevEx [video](youtube.com)

3 pointsby rbalicki3 lata temu2 comments

Isograph, GraphQL-powered React apps with great DevEx [video]

https://www.youtube.com/watch?v=gO65JJRqjuc

1 comments

What's the difference between Isograph and the existing tool like Apollo and Relay?

Isograph is very much a work in progress, and more of an experiment to the improve developer experience of building GraphQL-backed apps than a production-ready framework. The other frameworks are production-ready.

It has a lot of similarities to Relay under the hood. The primary difference is that in Relay, you import components, spread fragments and pass down fragment references to the only component that can read that fragment:

  // in your GraphQL fragment:
  user { ...UserName_user }
  // and render it as
  <UserNameRenderer user={data.user} />

Whereas in Isograph, you simply select the component and use it directly.

  // in your isograph fragment
  user { user_name_renderer_component }
  // and, interpolate instead of using JSX syntax:
  {data.user.user_name_renderer_component(additionalProps)}

Because the Isograph compiler knows that only the UserNameRenderer component will read that fragment, it can do all of the plumbing for you. Fragment refs, etc. don't exist.

There are potential, unimplemented performance advantages to this as well, such as defaulting to asynchronously loading the JS for UserNameRenderer if the fragment is deferred, instead of making that separate steps.