mirror of
https://github.com/facebookarchive/prepack.git
synced 2024-10-26 23:32:02 +03:00
b0fe89e863
Summary: Release notes: React components can have their props modelled via `__optimizeReactComponentTree` This extends the current shape modelling functionality added for InstantRender (great work by hotsnr ) and provides the same powers to the React compiler. An example of usage: ```js var React = require("React"); function App(props) { return <div> <h1>{props.header.toString()}</h1> <ul> { props.items && props.items.map(item => <li key={item.id}>{item.title.toString()}</li> ) } </ul> </div>; } App.getTrials = function(renderer, Root) { var items = [{ id: 0, title: "Item 1" }, { id: 1, title: "Item 2" }, { id: 2, title: "Item 3" }]; renderer.update(<Root items={items} header={"Hello world!"} />); return [["render simple with props model", renderer.toJSON()]]; }; if (this.__optimizeReactComponentTree) { let universe = { Item: { kind: "object", jsType: "object", properties: { id: { shape: { kind: "scalar", jsType: "integral", }, optional: false, }, title: { shape: { kind: "scalar", jsType: "string", }, optional: false, }, }, }, Props: { kind: "object", jsType: "object", properties: { header: { shape: { kind: "scalar", jsType: "string", }, optional: false, }, items: { shape: { kind: "array", jsType: "array", elementShape: { shape: { kind: "link", shapeName: "Item", }, optional: false, }, }, optional: true, }, }, }, }; let appModel = { component: { props: "Props", }, universe, }; __optimizeReactComponentTree(App, { model: JSON.stringify(appModel), }); } module.exports = App; ``` Pull Request resolved: https://github.com/facebook/prepack/pull/2320 Differential Revision: D8996429 Pulled By: trueadm fbshipit-source-id: 31eb4b42fcfab4aec785492ed0baecfb5533a0e2 |
||
---|---|---|
.. | ||
__snapshots__ | ||
AssignSpread | ||
ClassComponents | ||
FactoryComponents | ||
FBMocks | ||
FirstRenderOnly | ||
FunctionalComponents | ||
ReactDOM | ||
ReactNative | ||
Reconciliation | ||
RenderProps | ||
ServerRendering | ||
AssignSpread-test.js | ||
ClassComponents-test.js | ||
FactoryComponents-test.js | ||
FBMocks-test.js | ||
FirstRenderOnly-test.js | ||
FunctionalComponents-test.js | ||
ReactDOM-test.js | ||
ReactNative-test.js | ||
Reconciliation-test.js | ||
RenderProps-test.js | ||
ServerRendering-test.js | ||
setupReactTests.js |