Aliasing angular key concepts

AngularJS is a single page application framework. Although, it never markets itself as a "MVC" framework, it uses lots concept of MVC, like model, view, controller. Once you start using it, you will find the concepts it use does not map 100% to your concepts. So I feel that I need to alias these key concepts to align to my understanding. If you don't understand these concept correctly, you can use them in a wrong way very easily, because AngualrJS allow you to do so. In the following, I try to explain them by giving each of them an alias. Although an alias is not trendy, but at lease it helps me to understand. Hopefully, it helps you too.

angularjs-sugar

The normal way to to creating anguarjs component is like the following.

<!– Global variables in JavaScript is evil. However lots Angualrjs example out there use global variable, including some example in the http://angularjs.org/. I am not sure why. But avoiding Global variable is easy in Angularjs. I created a script angularjs-sugar to avoid the global variable.

Harmony.js

I haven't updated the blog for some time. Because I am working on an interesting JavaScript UI Library, Harmony. Like other JavaScript library such backbone.js, knockout.js, it tries to build HTML application in a structured way. What is unique is that it does not a have controller or binder. The models and views are pretty much on their own. They all take care about themselves by subscriptions. Are we going back to the age that we have tons of event handlers like spaghetti? Far from it. There are really lots of subscriptions and their handlers, but they are structured in a way that feels like object-oriented. The subscriptions and handlers are part of the objects (views and models). The views and models are treated like Human being in Harmony, they make decisions on their own, they respect each others, they are not manipulating or commanding each others.

"use strict" and "this" in ES5

"this" is a special variable in JavaScript. If a Constructor function is called without "new", the "this" variable inside the constructor will reference the Global object. We can use "use strict" in ES5 to prevent this happening.

(function () {
  "use strict";
  console.log(this === window); //false
 })();

Why dynamic resource loading is so important for web application?

When I finished matrix.js 0.1, I asked for feedback from my friends. But the general response seems that I am trying to solve a problem which does not exist, so the library is useless. But I am not disappointed. I make it not because we have a pain point in my current projects, but because I see it is the way that we need to build future web application. It is better to explain what the problem is as I see, before I propose on a solution. I believe that, as we are developing web application, dynamic resource loading will be a essential function. The current way to import resource using <link> <script> tag statically and tools like combres will not be able to meet the needs of building web application.