ember-parachute
ember-parachute copied to clipboard
ember-fastboot support
Hello,
I have found this add-on very interesting - great job :) However, I wanted to ask If you are planning any support of ember-fastboot
. Server-side prerendering is a must have for many apps, so giving it up completely is impossible for me.
Non-blocking UI is a good thing, but fetching all data in controller actually makes ember-fastboot
impossible to work (as it renders blank/skeleton page to web crawlers).
What do you think @offirgolan? :)
The way to handle this is described in the FastBoot documentation: delaying-the-server-response
If we take the example from the ember-parachute README, integration with FastBoot could be implemented like this:
import Route from '@ember/routing/route';
import { inject } from '@ember/service';
import RSVP from 'rsvp';
export default Route.extend({
fastboot: inject(),
afterModel() {
if (typeof FastBoot !== 'undefined') {
const defer = RSVP.defer();
this.controllerFor('posts').set('deferredRender', defer);
this.get('fastboot').deferRendering(defer.promise);
}
},
});
import Controller from '@ember/controller';
import QueryParams from 'ember-parachute';
const myQueryParams = new QueryParams({…});
export default Controller.extend(myQueryParams.Mixin, {
setup({ queryParams }) {
this.fetchData(queryParams).catch((error) => {
if (typeof FastBoot !== 'undefined') {
this.get('deferredRender').reject();
throw error;
}
});
},
queryParamsDidChange({ shouldRefresh, queryParams }) {
if (shouldRefresh) {
this.fetchData(queryParams).catch((error) => {
if (typeof FastBoot !== 'undefined') {
this.get('deferredRender').reject();
throw error;
}
});
}
},
async fetchData(queryParams) {
// fetch some data, e.g.
// let posts = await this.get('store').query('post', queryParams);
// this.set('posts', posts);
if (typeof FastBoot !== 'undefined') {
this.get('deferredRender').resolve();
}
},
}
Question is: how can we make it easier for users to integrate with FastBoot?
First, we should add an example to the README.
But would it be possible to somehow automate that integration? Most likely not without changing this addon's API, since ember-parachute doesn't handle any data fetching on its own.