Conditional Loading Epic

[justinbmeyer]

Create the following guides:

polyfill - fetch example

• [x] - Create sample code
• [x] - Get it working
• [x] - Make a guide

Production

• main-bundle: index.js + conditions.js
• side bundle: fetch.js

Loads main-bundle.js ... runs conditionals, if browser doesn't support what's needed, will load side bundles individually before getting started.

Waterfall requests OK because only effect "bad" browsers.

internationalization

• [x] - Create sample code
• [x] - Get it working
• [x] - Make a guide

Make it so something like the following works:

// main.js
import lang from 'langs/#{lang}';

// langs/en-texas.js
var texasLandingHero = require("./en-texas-landing");
module.exports = {
  hello: "Hey yall",
   "landing-hero": texasLandingHero
}

// langs/es.js
module.exports = {
  hello: "Hola",
  "landing-hero": "Como Estas?"
}

Steal-tools builds out to something like:

dist/bundles/app/main.js
dist/bundles/app/en-texas.js
dist/bundles/app/es.js

Future thoughts

• progressively loaded language packs?

import lang from 'boot/langs/#{language}';

could write out like:

dist/{lang}/{language}/main.js

and be loaded for production like:

<script src="dist/en/EN/main.js"/>

Or in the future, we could allow people to write out their script tags like:

<script src="dist/bundles/app/main.js"></script>
<script src="dist/bundles/app/{lang}.js"></script>
<script src="dist/bundles/app/home.js"></script>
<script src="dist/bundles/app/home/{lang}.js"></script>

[m-mujica]

I worked on fixing the build, making sure the conditionally loaded modules get their own bundles

https://github.com/stealjs/steal-conditional/pull/13

I had some code using the boolean syntax already, I updated that to the new steal-conditional and steal@rc, steal-tools@rc.

https://github.com/m-mujica/steal-conditional-boolean-example

I thought the example wasn't nice and decided to try with the custom elements polyfill which proved to be tricky to get working

https://github.com/m-mujica/bitovi-projects-grid

The build is broken but I don't think it's related to steal-conditional.

Pending tasks

Boolean syntax (polyfill example)

• [x] Get build working for https://github.com/m-mujica/bitovi-projects-grid
• [x] Write a Guide

String substitution syntax (i18n example) *

• [x] Create sample code
• [x] Write a Guide

(*) The build for this syntax should also be working fine

[m-mujica]

I fixed the build :D

[m-mujica]

guides merged and published, closing....