Digging Deeper - RequireJS and ES6 Modules

I was exploring RequireJS and ES6 Modules some more this weekend. Originally I started to explore how I can use richer domain objects (classes) as part of our AngularJS application that uses RequireJS for modularization. As part of that endeavor, using RequireJS looks like an interesting approach to inject classes into the application (Remember that AngularJS injects class instances ;-)

Here is a list of interesting resources that I came across.

RequireJS Basics

In order to get a refresher/introduction to RequireJS, I found Rob Dodson's RequireJS -- Embracing the Awesomeness of Asynchronous Modules quite nice:

• https://www.youtube.com/watch?v=vWGuaZOTR4U

Integrating AngularJS and RequireJS

Thomas Burleson's Angular and RequireJS from ng-conf 2014 was high on my consumption list. I think his explanation of how RequireJS relates to AngularJS was perfect.

• https://www.youtube.com/watch?v=4yulGISBF8w

I thought his code example was a tad on the complex side, though (Meaning I may need to revisit it ;-). For practical purposes, I then discovered Burke Holland's Requiring vs Browserifying Angular which I think is the nicest tutorial I came across:

• http://developer.telerik.com/featured/requiring-vs-browerifying-angular/

The tutorial also underlines the point that using AngularJS and RequireJS is not for the faint of heart. It has its challenges. Maybe I need to look at Browserify?

One challenge I came across this morning for example,  is to make angular-masonry work with RequireJS. I was able to solve that challenge using this Stackoverflow posting:

• http://stackoverflow.com/questions/18295459/requirejs-with-jquery-masonry-imagesloaded-object-object-object-has-no-me

Whats is coming with ES6 Modules

When looking at modules, it does not take long to come across ES6 Modules, the next hot thing coming our way as part of ECMAScript 6 (see Using ECMAScript 6 today)

First I watched Browser Package Management (by Guy Bedford):

• http://www.confreaks.com/videos/3231-mwjs-browser-package-management

He also has a nice blog post:

http://guybedford.com/practical-workflows-for-es6-modules

Another good video was Guy Bedford's talk: Package Management for ES6 Modules from JSConf2014:

• https://www.youtube.com/watch?v=szJjsduHBQQ

What was interesting to learn, is that with SPDY, the bundling of web-resources won't be necessary anymore (eventually). See Multiplexing with SPDY and HTTP/2 for explanations:

• https://www.youtube.com/watch?v=J_BxVEOVRNw#t=1303

So here is what is next for me...I need to look at the following projects and see how all this is usable today. Certainly looks fascinating being to use ES6 features right now, also keeping in mind that AngularJS 2.0 will use ES6 modules.

• https://github.com/ModuleLoader/es6-module-loader
• https://github.com/systemjs/systemjs
• http://jspm.io/