Integrating
RequireJS
HTML5DevConf 2014
Author: Parris Khachi
@parrissays
My 15 minute braindump
History
Life used to be simple
Then life got complicated
10 requests later our JS can now run
bundle.yaml/manifests
Sooo many files!!!
Game: Find the Dependencies
Answer: Some of these?
I think...
Ultimately EXCEPTIONS
You forgot a file somewhere...
Question
What happens when a dev needs to do this multiple times per day? And ultimately gets hit with that feeling?
Answer: I'll just not reuse any code ever. Maybe I'll just quit.
Or maybe
We'll fix it!
Enter RequireJS
Game: What are the dependencies?
How about here?
So wait... How did you integrate it at Eventbrite?
Questions that came up
- Wait it is Async? How does that work in production?
- How do you unit test now? How do you `x` now?
- How about all the legacy files? How does it integrate?Lots of Research
CommonJS vs. AMD... what are the options?
Async? How about Production?
Loading hundreds of files separately results in poor performance
Enter App.js
Benefits of Async Feature Loading
By reducing the initial file size we:
- reduce js file download time
- reduce js compile time on page load
- modularize features
How do you do `x`...
not a problem, there are online resources for every situation
Jasmine? Unit Testing?
Unit Testing PT2
Jasmine + Grunt
Handlebars
https://www.npmjs.org/package/requirejs-handlebars
Handlebars pt2
Legacy
The hardest part isn't technical actually
Communication
- Show business value (faster development)
Ultimately you'll get skepticism...
Grassroots
this is obviously complicated (400 files, 300kb code)
this is complicated but less obviously so (~50 files)
No feathers ruffled...
The feathers didn't even know I was there.
Thanks!!
Question?
Oh yea we are hiring: https://www.eventbrite.com/jobs
Come by our booth!
Integrating RequireJS
By Parris Khachi
