{"action":"created","issue":{"url":"https://api.github.com/repos/facebook/relay/issues/1369","repository_url":"https://api.github.com/repos/facebook/relay","labels_url":"https://api.github.com/repos/facebook/relay/issues/1369/labels{/name}","comments_url":"https://api.github.com/repos/facebook/relay/issues/1369/comments","events_url":"https://api.github.com/repos/facebook/relay/issues/1369/events","html_url":"https://github.com/facebook/relay/issues/1369","id":174918158,"number":1369,"title":"[meta] New Relay APIs (previously codenamed \"Relay 2\")","user":{"login":"josephsavona","id":6425824,"avatar_url":"https://avatars.githubusercontent.com/u/6425824?v=3","gravatar_id":"","url":"https://api.github.com/users/josephsavona","html_url":"https://github.com/josephsavona","followers_url":"https://api.github.com/users/josephsavona/followers","following_url":"https://api.github.com/users/josephsavona/following{/other_user}","gists_url":"https://api.github.com/users/josephsavona/gists{/gist_id}","starred_url":"https://api.github.com/users/josephsavona/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/josephsavona/subscriptions","organizations_url":"https://api.github.com/users/josephsavona/orgs","repos_url":"https://api.github.com/users/josephsavona/repos","events_url":"https://api.github.com/users/josephsavona/events{/privacy}","received_events_url":"https://api.github.com/users/josephsavona/received_events","type":"User","site_admin":false},"labels":[{"id":435841279,"url":"https://api.github.com/repos/facebook/relay/labels/new-core-api","name":"new-core-api","color":"d4c5f9","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":50,"created_at":"2016-09-03T21:27:19Z","updated_at":"2017-02-06T18:10:46Z","closed_at":null,"body":"# New Relay APIs\r\n\r\nThe core team is currently focused on developing the next major version of Relay, which we have been referring to as \"Relay 2\" as a working title, but which will ultimately be just a new set of APIs within the existing Relay. The new APIs are the best parts of Relay today - co-located GraphQL and React components and a declarative API - but is simpler, faster, and more predictable. This issue is to track our overall progress and give us a place to point people toward information.\r\n## More Information\r\n- Check out our recent [blog post](https://facebook.github.io/react/blog/2016/08/05/relay-state-of-the-state.html) on the state of the project and our goals/plan going forward.\r\n- @wincent's [deep dive](https://facebook.github.io/relay/docs/videos.html#relay-2-simpler-faster-more-predictable-slides-https-speakerdeck-com-wincent-relay-2-simpler-faster-more-predictable) explains how Relay 2 works from a technical perspective; check this out if you're curious about the implementation and how it differs from current Relay.\r\n- @josephsavona's [React Rally talk](https://speakerdeck.com/josephsavona/reintroducing-relay) provides an overview of the new APIs from a product developer's perspective, including the types of performance enhancements and API simplifications it unlocks.\r\n\r\n## FAQs\r\n### Do I have to relearn everything?\r\n\r\nThe core concepts of Relay continue to apply: co-located GraphQL and render logic, a declarative API that lets you specify what data you need, not how to fetch it. If you're familiar with Relay today, the updated Relay should feel familiar, with some rough edges removed (no more Routes, for example, just queries and variables). If you're _new_ to Relay, there will less concepts to learn and, we hope, it should be easier to get started.\r\n\r\nThere are definite API differences, but the core concepts are the same and the API changes serve to make Relay simpler and more predictable.\r\n\r\n### What is the upgrade path?\r\n\r\nNote that _we will continue to support the current API for the foreseeable future_ - we're using it too! Where possible, we will provide tools to help the community upgrade their own apps. We're currently exploring a limited interoperability API as well as codemods and other tools.\r\n\r\n### How can I prepare for the new API? \r\n\r\nIn general, the main theme is to reduce dynamic APIs that can prevent Relay from understanding the structure of a query statically (i.e. at build time). Examples of such dynamic APIs in current Relay are:\r\n\r\n- `RelayMutation` and fat/tracked queries. Future releases will deprecate this API in favor of a static mutation API. We recommend using [`RelayGraphQLMutation`](https://facebook.github.io/relay/docs/api-reference-relay-graphql-mutation.html) to ease the transition to new mutations.\r\n- `RelayContainer#prepareVariables()`. Future releases will deprecate support for this function; the workaround is to use (global) query variables and prepare dynamic values at the Renderer.\r\n- `RelayContainer#initialVariables()` with *runtime function calls* specifically (inline constants/literals such as `initialVariables: {count: 10}` are static, runtime function calls such as `initialVariables: {count: getRuntimeValue()}` are not). Future releases will deprecate support for dynamically assigned initial variables. Similar to `prepareVariables`, a workaround will be to use (global) query variables.\r\n\r\n### When will the updates to Relay be released?\r\n\r\nWe open source tools that we have proven in production. We're working to refine the product developer experience, finish/polish some features, and ship the first apps using it. \r\n\r\n### Where can I learn more / follow progress?\r\n\r\n**The best way to follow our progress is to [read our meeting notes](https://github.com/facebook/relay/tree/master/meta/meeting-notes)**. We publish these semi-weekly, and are exploring a new format with more detailed status updates about sub-projects. We cannot guarantee that we can always keep this issue up to date, so always see the meeting notes for updates.\r\n\r\n## High-Level Tasks\r\n\r\nBelow is a high-level overview of the work remaining to release the new APIs and core:\r\n\r\n- [x] Introduce a static mutation API: [`Relay.GraphQLMutation`](https://facebook.github.io/relay/docs/api-reference-relay-graphql-mutation.html#content)\r\n- [x] Poly-fill the new core's public API via the legacy core.\r\n- [ ] Introduce static query APIs (new Renderer and Container variants)\r\n- [ ] Deprecate old query APIs (`Relay.RootContainer`, `Relay.Renderer`, `Relay.Container`)\r\n- [ ] Introduce the new core."},"comment":{"url":"https://api.github.com/repos/facebook/relay/issues/comments/277764664","html_url":"https://github.com/facebook/relay/issues/1369#issuecomment-277764664","issue_url":"https://api.github.com/repos/facebook/relay/issues/1369","id":277764664,"user":{"login":"wincent","id":7074,"avatar_url":"https://avatars.githubusercontent.com/u/7074?v=3","gravatar_id":"","url":"https://api.github.com/users/wincent","html_url":"https://github.com/wincent","followers_url":"https://api.github.com/users/wincent/followers","following_url":"https://api.github.com/users/wincent/following{/other_user}","gists_url":"https://api.github.com/users/wincent/gists{/gist_id}","starred_url":"https://api.github.com/users/wincent/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/wincent/subscriptions","organizations_url":"https://api.github.com/users/wincent/orgs","repos_url":"https://api.github.com/users/wincent/repos","events_url":"https://api.github.com/users/wincent/events{/privacy}","received_events_url":"https://api.github.com/users/wincent/received_events","type":"User","site_admin":false},"created_at":"2017-02-06T18:10:46Z","updated_at":"2017-02-06T18:10:46Z","body":"Very hard to give a quantitative answer about \"how much work\" is involved in migrating. In our experience porting products at Facebook, many components can be ported by an automated codemod (and we'll share the jscodeshift scripts that we used for this purpose).\r\n\r\nFor example:\r\n\r\n```\r\nclass LikeButton extends React.Component {\r\n  render() {\r\n    var {page} = this.props;\r\n    return <Button label={'Like ' + page.name} />;\r\n  }\r\n}\r\n\r\nmodule.exports = Relay.createContainer(\r\n  LikeButton,\r\n {\r\n    fragments: {\r\n      page: () => Relay.QL`\r\n        fragment on Page {\r\n          name\r\n        }\r\n      `,\r\n    },\r\n  }\r\n);\r\n```\r\n\r\nwould become something like:\r\n\r\n```\r\nclass LikeButton extends React.Component {\r\n  render() {\r\n    var {page} = this.props;\r\n    return <Button label={'Like ' + page.name} />;\r\n  }\r\n}\r\n\r\nmodule.exports = createFragmentContainer(\r\n  LikeButton,\r\n  graphql`\r\n    fragment LikeButton_page on Page {\r\n      name\r\n    }\r\n  `\r\n);\r\n```\r\n\r\n(Usual disclaimers apply: API subject to change and all that; hold off on questions about the specific details here as we'll be documenting it all with the release.)\r\n\r\nI include this merely as an illustrative example of the simple case. More complex cases involving variables will require a little more work, but only incrementally so. Our goal is that the performance benefits of moving to the new APIs and core should make this migration cost worthwhile. Sorry that I can't be more specific, but it's hard to give a precise sense for the cost of a migration other than to broadly call it \"reasonable\"."}}
{"actor":{"display_login":"wincent"}}