mrsharpoblunto

Browser	ES2017	ES5	runtime polyfills
Chrome 64+	✅
Firefox 57+	✅
Opera 42+	✅
Edge 15+	✅
iOS/Safari 11+	✅
Chrome 54-63		✅
Firefox 48-56		✅
Opera 41		✅

mrsharpoblunto

// Module A

window.globalState = { 'foo': 'bar' };

// Module B

module.exports = function() {
   console.log(window.globalState);
}

mrsharpoblunto

module.exports = function baz() {
    require('foo')();
}

mrsharpoblunto

const foo = require('foo');
const bar = require('bar');

module.exports = function baz() {
    foo();
}

mrsharpoblunto

const config = {
  transformer: {
    getTransformOptions: () => {
      return {
        transform: { inlineRequires: true },
      };
    },
  },
};

mrsharpoblunto

function fetchAndStageFeed() {
    return stagingAction(
        'feed',
        (async () => {
            const {data} = await fetchFeedTimeline();
            return {
                type: FEED_LOADED,
                ...data,
            };
        })(),

mrsharpoblunto

function stagingAction(
    key: string,
    promise: Promise<Action>,
): AsyncAction<State, Action>

function stagingCommit(key: string): AsyncAction<State, Action>

mrsharpoblunto

function queryAPI(path) {
  const cacheEntry = window.__data[path];
  if (!cacheEntry) {
    // issue a normal XHR API request
    return fetch(path);
  } else if (cacheEntry.data) {
    // the server has pushed us the data already
    return Promise.resolve(cacheEntry.data);
  } else {
    // the server is still pushing the data

mrsharpoblunto

<script type="text/javascript">
  window.__dataLoaded('/my/api/path', {
    // API json response, wrapped in the function call to 
    // add it to the JSON cache...
  });
</script>

mrsharpoblunto

<script type="text/javascript">
  // the server will write out the paths of any API calls it plans to 
  // run server-side so the client knows to wait for the server, rather
  // than doing its own XHR request for the data
  window.__data = {
    '/my/api/path': {
        waiting: [],
    }
  };