Building for Production

[00:00:00]
>> Just a few other things I wanted to cover about this basic stack. There's a bunch of transforms. So template strings have pretty good browser support. But if you need to support older browsers that don't have them, you can use some of these other packages like yo-yoify that turn the template strings into expressions.

[00:00:20]
So here I can just show you what that looks like. Yo-yoify, if I even have it in my path hopefully. Okay, so let's pipe that to less. So previously, we had a bit of code in this block with app.route. So I'm gonna search for that. Okay, so yo-yoify took this code that we wrote and it replaced it with a bunch of createElements and all kinds of stuff like that.

[00:00:51]
So, that's also gonna be faster than parsing HTML chunks on the fly in JavaScript. So a handy thing to do for production. It looks ugly, but you don't have to look at it cuz it's in the bundle, which is already ugly. So that's nice. Also choo and other packages include a bunch of asserts.

[00:01:13]
So remember from testing earlier, require assert. People do that in libraries and you can use this transform called unassertify to remove them again. So you can hook these up through a browserify pipeline on the command line by doing dash t. So unassertify whatever, or you can set up your package.json file to work like this.

[00:01:46]
Or, if you don't like configuring things at all, instead of browserify or budo, you can use this other package called bankai. So, bankai already has all of that stuff inside of it, including support for sheetify, which is another transform that lets you do inline CSS. And the nice thing about sheetify is the CSS can be inline and it's scoped inside of your JavaScript files.

[00:02:11]
But then a pre processing step can remove that CSS and put it in a CSS bundle that you can put in a link tag. That kind of gives a pretty good mix of both benefits of including CSS and JavaScript without the downside of all of the runtime parsing overhead that it brings.