Commit Graph

14 Commits

Author SHA1 Message Date
Sebastian Markbåge
64d4b84204
Rename Flight to Transport (#18808)
* Rename Flight to Transport

Flight is still the codename for the implementation details (like Fiber).

However, now the public package is react-transport-... which is only
intended to be used directly by integrators.

* Rename names
2020-05-03 11:33:48 -07:00
Sebastian Markbåge
e2dd30898e
[Flight] Lazily parse models and allow any value to suspend (#18476)
* Lazily initialize models as they're read intead of eagerly when received

This ensures that we don't spend CPU cycles processing models that we're
not going to end up rendering.

This model will also allow us to suspend during this initialization if
data is not yet available to satisfy the model.

* Refactoring carefully to ensure bundles still compile to something optimal

* Remove generic from Response

The root model needs to be cast at one point or another same as othe
chunks. So we can parameterize the read instead of the whole Response.

* Read roots from the 0 key of the map

The special case to read the root isn't worth the field and code.

* Store response on each Chunk

Instead of storing it on the data tuple which is kind of dynamic, we store
it on each Chunk. This uses more memory. Especially compared to just making
initializeBlock a closure, but overall is simpler.

* Rename private fields to underscores

Response objects are exposed.

* Encode server components as delayed references

This allows us to stream in server components one after another over the
wire. It also allows parallelizing their fetches and resuming only the
server component instead of the whole parent block.

This doesn't yet allow us to suspend deeper while waiting on this content
because we don't have "lazy elements".
2020-04-03 14:58:02 -07:00
Sebastian Markbåge
3e94bce765
Enable prefer-const lint rules (#18451)
* Enable prefer-const rule

Stylistically I don't like this but Closure Compiler takes advantage of
this information.

* Auto-fix lints

* Manually fix the remaining callsites
2020-04-01 12:35:52 -07:00
Sebastian Markbåge
ce6fe50b01
Add server-runtime to create Server Blocks (#18392)
This is equivalent to the jsx-runtime in that this is what the compiled
output on the server is supposed to target.

It's really just the same code for all the different Flights, but they
have different types in their arguments so each one gets their own entry
point. We might use this to add runtime warnings per entry point.

Unlike the client-side React.block call this doesn't provide the factory
function that curries the load function. The compiler is expected to wrap
this call in the currying factory.
2020-03-25 19:03:31 -07:00
Sebastian Markbåge
64ed221c3d
Formalize the Wakeable and Thenable types (#18391)
* Formalize the Wakeable and Thenable types

We use two subsets of Promises throughout React APIs. This introduces
the smallest subset - Wakeable. It's the thing that you can throw to
suspend. It's something that can ping.

I also use a shared type for Thenable in the cases where we expect a value
so we can be a bit more rigid with our us of them.

* Make Chunks into Wakeables instead of using native Promises

This value is just going from here to React so we can keep it a lighter
abstraction throughout.

* Renamed thenable to wakeable in variable names
2020-03-25 16:49:37 -07:00
Sebastian Markbåge
a6924d77b1
Change .model getter to .readRoot method (#18382)
Originally the idea was to hide all suspending behind getters or proxies.
However, this has some issues with perf on hot code like React elements.

It also makes it too easy to accidentally access it the first time in an
effect or callback where things aren't allowed to suspend. Making it
an explicit method call avoids this issue.

All other suspending has moved to explicit lazy blocks (and soon elements).
The only thing remaining is the root. We could require the root to be an
element or block but that creates an unfortunate indirection unnecessarily.

Instead, I expose a readRoot method on the response. Typically we try to
avoid virtual dispatch but in this case, it's meant that you build
abstractions on top of a Flight response so passing it a round is useful.
2020-03-25 11:47:55 -07:00
Sebastian Markbåge
a317bd033f
Flip the arguments of Blocks and make the query optional (#18374)
* Flip the arguments of Blocks and make the query optional

* Rename Query to Load
2020-03-24 10:58:23 -07:00
Sebastian Markbåge
a56309fb88
[Flight] Integrate Blocks into Flight (#18371)
* Resolve Server-side Blocks instead of Components

React elements should no longer be used to extract arbitrary data but only
for prerendering trees.

Blocks are used to create asynchronous behavior.

* Resolve Blocks in the Client

* Tests

* Bug fix relay JSON traversal

It's supposed to pass the original object and not the new one.

* Lint

* Move Noop Module Test Helpers to top level entry points

This module has shared state. It needs to be external from builds.

This lets us test the built versions of the Noop renderer.
2020-03-23 17:53:45 -07:00
Sebastian Markbåge
c0cd1be908
[Flight] Move bundler configs to use Suspense instead of returning thenable (#18367)
* Move bundler configs to use suspense instead of returning thenable

* Fix some Flow types
2020-03-21 22:28:36 -07:00
Sebastian Markbåge
fc91508c1f
Follow ups to bundler configs (#18352)
Follow ups from https://github.com/facebook/react/pull/18334

I also introduced the concept of a module reference on the client too.
We don't need this for webpack so that gets compiled out but we need it
for www. Similarly I also need a difference between preload and load.
2020-03-19 17:49:40 -07:00
Sebastian Markbåge
8206b4b864
Wire up bundler configs (#18334)
This allows different flight server and clients to have different configs
depending on bundler to serialize and resolve modules.
2020-03-18 12:18:34 -07:00
Sebastian Markbåge
dc7eedae3c
Encode server rendered host components as array tuples (#18273)
This replaces the HTML renderer with instead resolving host elements into
arrays tagged with the react.element symbol. These turn into proper
React Elements on the client.

The symbol is encoded as the magical value "$". This has security implications
so this special value needs to remain escaped for other strings.

We could just encode the element as {$$typeof: "$", key: key props: props}
but that's a lot more bytes. So instead I encode it as:
["$", key, props] and then convert it back.

It would be nicer if React's reconciler could just accept these tuples.
2020-03-11 09:48:02 -07:00
Sebastian Markbåge
99d7371863
[Flight] Split Streaming from Relay Implemenation (#18260)
* Add ReactFlightServerConfig intermediate

This just forwards to the stream version of Flight which is itself forked
between Node and W3C streams.

The dom-relay goes directly to the Relay config though which allows it to
avoid the stream part of Flight.

* Separate streaming protocol into the Stream config

* Split streaming parts into the ReactFlightServerConfigStream

This decouples it so that the Relay implementation doesn't have to encode
the JSON to strings. Instead it can be fed the values as JSON objects and
do its own encoding.

* Split FlightClient into a basic part and a stream part

Same split as the server.

* Expose lower level async hooks to Relay

This requires an external helper file that we'll wire up internally.
2020-03-10 14:55:04 -07:00
Sebastian Markbåge
bdc5cc4635
Add Relay Flight Build (#18242)
* Rename to clarify that it's client-only

* Rename FizzStreamer to FizzServer for consistency

* Rename react-flight to react-client/flight

For consistency with react-server. Currently this just includes flight
but it could be expanded to include the whole reconciler.

* Add Relay Flight Build

* Rename ReactServerHostConfig to ReactServerStreamConfig

This will be the config specifically for streaming purposes.
There will be other configs for other purposes.
2020-03-07 11:23:30 -08:00