{"commit":{"authoredAt":"2017-03-27T11:46:59-07:00","authorEmail":"acdlite@fb.com","authorName":"Andrew Clark","revision":"ef9dac518f9a3ce1bedc184e65796b97d19b1ec5","shortRevision":"ef9dac518f","subject":"Merge branch 'add_toggle_to_fiber_triangle_demo' of https:\/\/github.com\/giamir\/react into giamir-add_toggle_to_fiber_triangle_demo"},"files":[{"status":"M","path":"examples\/fiber\/index.html"}],"patch":"diff --git a\/examples\/fiber\/index.html b\/examples\/fiber\/index.html\nindex 7a56ca0b9d..a62f2bfcaf 100644\n--- a\/examples\/fiber\/index.html\n+++ b\/examples\/fiber\/index.html\n@@ -126,16 +126,29 @@\n class ExampleApplication extends React.Component {\n constructor() {\n super();\n- this.state = { seconds: 0 };\n+ this.state = {\n+ seconds: 0,\n+ useTimeSlicing: true\n+ };\n this.tick = this.tick.bind(this);\n+ this.toogleTimeSlicing = this.toogleTimeSlicing.bind(this);\n }\n componentDidMount() {\n this.intervalID = setInterval(this.tick, 1000);\n }\n tick() {\n- ReactDOMFiber.unstable_deferredUpdates(() =>\n- this.setState(state => ({ seconds: (state.seconds % 10) + 1 }))\n- );\n+ if (this.state.useTimeSlicing) {\n+ \/\/ Update is time-sliced.\n+ ReactDOMFiber.unstable_deferredUpdates(() => {\n+ this.setState(state => ({ ...state, seconds: (state.seconds % 10) + 1 }));\n+ });\n+ } else {\n+ \/\/ Update is not time-sliced. Causes demo to stutter.\n+ this.setState(state => ({ ...state, seconds: (state.seconds % 10) + 1 }));\n+ }\n+ }\n+ toogleTimeSlicing() {\n+ this.setState(state => ({ ...state, useTimeSlicing: !state.useTimeSlicing}));\n }\n componentWillUnmount() {\n clearInterval(this.intervalID);\n@@ -147,11 +160,14 @@\n const scale = 1 + (t > 5 ? 10 - t : t) \/ 10;\n const transform = 'scaleX(' + (scale \/ 2.1) + ') scaleY(0.7) translateZ(0.1px)';\n return (\n-

\n-

\n- \n- {this.state.seconds}\n- <\/SierpinskiTriangle>\n+

\n+

dillon1000/react

Files changed