Neatly Positioned Magazines
    Have ideas to improve npm?Join in the discussion! »

    fastboot

    3.1.2 • Public • Published

    FastBoot

    Greenkeeper badge npm version Build Status Ember Version

    FastBoot is a library for rendering Ember.js applications in Node.js.

    For more information about FastBoot, see www.ember-fastboot.com, the Ember CLI addon that's a prerequisite for developing FastBoot apps.

    To serve server-rendered versions of your Ember app over HTTP, see the FastBoot App Server.

    FastBoot requires Node.js v6 or later.

    Usage

    const FastBoot = require('fastboot');
     
    let app = new FastBoot({
      distPath: 'path/to/dist',
      // optional boolean flag when set to true does not reject the promise if there are rendering errors (defaults to false)
      resilient: <boolean>,
     
      // optional function used to generate the set of global properties available within the sandbox, receives default globals
      // and is expected to return an object (the default implementation returns the passed in defaults)
      buildSandboxGlobals(defaultGlobals) {
        return Object.assign({}, defaultGlobals, {
          // additional global properties to define within the sandbox
        });
      },
     
      // optional number to be provided when using `buildSandboxPerVisit` which defines the queue size for sandboxes.
      // This number should represent your QPS of your service
      maxSandboxQueueSize: <Number> // defaults to 1 if not provided
    });
     
    app.visit('/photos', options)
      .then(result => result.html())
      .then(html => res.send(html));

    In order to get a dist directory, you will first need to build your Ember application, which packages it up for using in both the browser and in Node.js.

    Default globals

    FastBoot object will be available to the sandboxed environment. This object has the following form:

    FastBoot.require  // provides a mechanism to load additional modules. Note: these modules are only those included in the module whitelist
    FastBoot.config   // a function which takes a key, and returns the corresponding fastboot config value
    FastBoot.distPath // readOnly accessor that provides the dist path for the current fastboot sandbox
    

    Additional configuration

    app.visit takes a second parameter as options above which a map and allows to define additional optional per request configuration:

    • resilient: whether to reject the returned promise if there is an error during rendering. If not defined, defaults to the app's resilient setting.
    • html: the HTML document to insert the rendered app into. Uses the built app's index.html by default.
    • metadata: per request meta data that is exposed in the app via the fastboot service.
    • shouldRender: boolean to indicate whether the app should do rendering or not. If set to false, it puts the app in routing-only. Defaults to true.
    • disableShoebox: boolean to indicate whether we should send the API data in the shoebox. If set to false, it will not send the API data used for rendering the app on server side in the index.html. Defaults to false.
    • destroyAppInstanceInMs: whether to destroy the instance in the given number of ms. This is a failure mechanism to not wedge the Node process
    • buildSandboxPerVisit: whether to create a new sandbox context per-visit (slows down each visit, but guarantees no prototype leakages can occur), or reuse the existing sandbox (faster per-request, but each request shares the same set of prototypes). Defaults to false. When using this flag, also set maxSandboxQueue to represent the QPS of your application so that sandboxes can be queued for next requests. When not provided, it defaults to storing only one sandbox

    Build Your App

    To get your Ember.js application ready to both run in your user's browsers and run inside the FastBoot environment, run the Ember CLI build command:

    $ ember build --environment production

    (You will need to have already set up the ember-cli-fastboot addon. For more information, see the FastBoot quickstart.)

    Once this is done, you will have a dist directory that contains the multi-environment build of your app.

    Run the command to install run time node modules:

    cd dist/
    $ npm install

    Upload the dist/ folder including node_modules to your FastBoot server.

    Command Line

    You can start a simple HTTP server that responds to incoming requests by rendering your Ember.js application using the FastBoot App Server

    Debugging

    Run fastboot with the DEBUG environment variable set to fastboot:* for detailed logging.

    Result

    The result from fastboot is a Result object that has the following API:

    
    type DOMContents = () => {
      /**
        The `<head>` contents generated by the visit.
      */
      head: string;
    
      /**
        The `<body>` contents generated by the visit.
      */
      body: string;
    }
    
    interface FastBootVisitResult {
      /**
        The serialized DOM contents after completing the `visit` request.
    
        Note: this combines the `domContents.head` and `domContents.body`.
      */
      html(): string;
    
      domContents(): DOMContents
    
      analytics: {
        /**
         * Boolean to know if the request used a prebuilt sandbox
         */
        usedPrebuiltSandbox: <Boolean>
      }
    }
    

    The Shoebox

    You can pass application state from the FastBoot rendered application to the browser rendered application using a feature called the "Shoebox". This allows you to leverage server API calls made by the FastBoot rendered application on the browser rendered application. Thus preventing you from duplicating work that the FastBoot application is performing. This should result in a performance benefit for your browser application, as it does not need to issue server API calls whose results are available from the Shoebox.

    The contents of the Shoebox are written to the HTML as strings within <script> tags by the server rendered application, which are then consumed by the browser rendered application.

    This looks like:

    .
    .
    <script type="fastboot/shoebox" id="shoebox-main-store">
    {"data":[{"attributes":{"name":"AEC Professionals"},"id":106,"type":"audience"},
    {"attributes":{"name":"Components"},"id":111,"type":"audience"},
    {"attributes":{"name":"Emerging Professionals"},"id":116,"type":"audience"},
    {"attributes":{"name":"Independent Voters"},"id":2801,"type":"audience"},
    {"attributes":{"name":"Members"},"id":121,"type":"audience"},
    {"attributes":{"name":"Partners"},"id":126,"type":"audience"},
    {"attributes":{"name":"Prospective Members"},"id":131,"type":"audience"},
    {"attributes":{"name":"Public"},"id":136,"type":"audience"},
    {"attributes":{"name":"Staff"},"id":141,"type":"audience"},
    {"attributes":{"name":"Students"},"id":146,"type":"audience"}]}
    </script> 
    .
    .

    Install

    npm i fastboot

    DownloadsWeekly Downloads

    21,030

    Version

    3.1.2

    License

    MIT

    Unpacked Size

    67.2 kB

    Total Files

    16

    Last publish

    Collaborators

    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar