Add new component: <TheFold />
#221
Conversation
This replaces the `getAboveTheFoldCount()` page method, which is awful: - It's separate from the elements themselves, so even remembering to update it can be a challenge. - If the number of root elements above the fold varies, then duplicative logic may be required to determine the count. - Middleware that inserts elements must remember to _increment_ it. - It has non-obvious behavior when root containers are used above the fold (redfin#144) This closes redfin#161 where @bartkusa proposed this _much_ nicer interface. This is a breaking change. The _default_ was previously to wake up the client controller after the _first_ element. With this change the client controller isn't bootstrapped until either `<TheFold />` is seen, or we're out of elements. So, if unspecified, the entire page is assumed to be above the fold.
| @@ -8,8 +11,8 @@ export default class DelayDataPage { | |||
| return 'application/json'; | |||
| } | |||
| getResponseData() { | |||
| const { ms, val } = this.getRequest().getQuery(); | |||
| const { ms, val, big } = this.getRequest().getQuery(); | |||
There was a problem hiding this comment.
Added a big=<size> param to the test data endpoint that just tells it to return a JSON object with size keys. It's easiest to see the fold when there's a bunch of JS to for the browser to slurp up right after.
|
Looks reasonable to me. This is way nicer than |
| } | ||
| } | ||
|
|
||
| TheFold.defaultProps = { |
There was a problem hiding this comment.
const isTheFold = Symbol();
TheFold.defaultProps = { [isTheFold]: true };
export function isTheFold(e) => e && e.props && e[isTheFold];
is, I think, privater
There was a problem hiding this comment.
Yeah, I actually thought about that. AFAIK the reason React does that is to avoid injection attacks via JSON. I don't see that as a concern here, so I opted to just keep it simple.
Maybe we _should_, but we didn't previously. This preserves existing behavior.
|
👍 |
|
Note that this is merging into |
This replaces the
getAboveTheFoldCount()page method, which is awful:can be a challenge.
may be required to determine the count.
This closes #161 where @bartkusa proposed this much nicer interface.
This is a breaking change. The default was previously to wake up the client
controller after the first element. With this change the client controller
isn't bootstrapped until either
<TheFold />is seen, or we're out ofelements. So, if unspecified, the entire page is assumed to be above the
fold.