React Fiber - React Fiber Architecture

React Fiber , React-. .

React Fiber Architecture https://github.com/acdlite/react-fiber-architecture

React Fiber React .

React Fiber React , . .

React Fiber: , , , .

Fiber , . , Fiber React. , , .

, , , .

, , React . . React .

, Fiber . Fiber . .

Fiber , , , , React.

, :

• React Components, Elements, and Instances. , , .
• Reconciliation. .
• React Basic Theoretical Concepts. React . - , .
• React Design Principles. , React Fiber.

, , .

, .

?

, React-, , .

. , setState. .

API React- . , , , .

, , . React , , . .

DOM. : React , . , , DOM. ( - setState), . , , .

Fiber , React . :

• , . React , .
• . , .

vs

DOM React, , iOS Android, React Native. DOM .

React , , React . , , , .

, React DOM React Native , React.

Fiber . , , .

.

, . (, setState).

React , :

React . , React , .
React. push-, . React pull-, , .
React , . , React , , , .
- , . , , . , (, ), (, ).

:

• .
• , . , , , .
• Push- ( ) , . Pull- (React) .

React . . React , Fiber.

Fiber. , , . , , .

?

React Fiber. (fiber) , . , . . ( , , .)

!

, Fiber React . , :

• .
• .
• .
• , .

, . , . .

, React- , v = f(d).

, React- , . .

, . , . , .

, , , . , , . UI , , .

( React Native) API, : requestIdleCallback , requestAnimationFrame . , API . , .

, , ? , ?

React Fiber. , React-. .

, . .

, . .

.

, JS-, , .

, . ( ):

type key

type key , React-. , , .

type . , type . - (div, span ), type .

, type ( v = f(d)), .

type, key , .

child sibling

.

child () , render . :

function Parent() {    return <Child />}

, Child - Parent.

sibling ( ) , render :

function Parent() {    return [<Child1 />, <Child2 />]}

child . , Child1 - Parent, Child2 - (sibling) Child1.

, - .

return

return , . , , . .

, return . , Child1 Child2 return Parent.

pendingProps memoizedProps

, (props) . pendingProps , memoizedProps .

pendingProps memoizedProps, , , .

pendingWorkPriority

. ReactPriorityLevel , .

NoWork, , . , , , :

function matchesPriority(fiber, priority) {    return fiber.pendingWorkPriority !== 0 &&        fiber.pendingWorkPriority <= priority} 

, . .

alternate,

.

. , .

: , .

(alternate) , .

cloneFiber. , , cloneFiber , , .

, , .

output,

-

- . - (, div, span ). JSX, .

, .

, -. , .

, , . .

, , . . :

• .
• .
• , .
• .
• ( ).
• .

What's Next for React (ReactNext 2016)