Skip to content

Commit 690d93c

Browse files
Add further deferRendering guidance to README
1 parent d18fa46 commit 690d93c

1 file changed

Lines changed: 30 additions & 3 deletions

File tree

README.md

Lines changed: 30 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -129,16 +129,43 @@ handled by FastBoot
129129
By default, FastBoot waits for the `beforeModel`, `model`, and
130130
`afterModel` hooks to resolve before sending the response back to the
131131
client. If you have asynchrony that runs outside of those contexts, your
132-
response may not reflect the state that you want. To solve this, the
133-
`fastboot` service has `deferRendering` function that accepts a promise.
134-
It will chain all promises passed to it, and the FastBoot server will
132+
response may not reflect the state that you want.
133+
134+
To solve this, the `fastboot` service has `deferRendering` method that accepts
135+
a promise. It will chain all promises passed to it, and the FastBoot server will
135136
wait until all of these promises resolve before sending the response to
136137
the client. These promises must be chained before the rendering is
137138
complete after the model hooks. For example, if a component that is
138139
rendered into the page makes an async call for data, registering a
139140
promise to be resolved in its `init` hook would allow the component to
140141
defer the rendering of the page.
141142

143+
The following example demonstrates how the `deferRendering` method can be
144+
used to ensure posts data has been loaded asynchronously by a component before
145+
rendering the entire page. Note how the call should be wrapped in a `fastboot.isFastboot`
146+
check since the method will throw an exception outside of that context:
147+
148+
```js
149+
import Ember from 'ember';
150+
151+
export default Ember.Component.extend({
152+
fastboot: Ember.inject.service(),
153+
model: Ember.inject.service(),
154+
155+
init() {
156+
this._super(...arguments);
157+
158+
let promise = this.get('store').findAll('post').then((posts) => {
159+
this.set('posts', posts);
160+
});
161+
162+
if (this.get('fastboot.isFastBoot')) {
163+
this.get('fastboot').deferRendering(promise);
164+
}
165+
}
166+
});
167+
```
168+
142169
### Cookies
143170

144171
You can access cookies for the current request via `fastboot.request`

0 commit comments

Comments
 (0)