Live data from Hacker News

Converting an existing Backbone.js project to Require.js

ozkatz.github.io

11–20 of 34 posts

Re: Converting an existing Backbone.js project to Require.js

#12

I'm really puzzled by the enthusiasm around RequireJS. I've read up on it, I've built several large JS applications (~100 models, views, whatevers in ExtJS and Knockout), have been involved with a large BackboneJS/RequireJS application and am currently rebuilding a large site in AngularJS. AFAICT, RequireJS did not solve any problems that I had more easily solved with proper namespacing (yes, the feared global , e.g.…

Hrm.... I don't think the angular documentation agrees with what you are saying: In the documentation on the $inject annotation: > Care must be taken that the $inject annotation is kept in sync with the actual arguments in the function declaration. > This method of annotation is useful for controller declarations since it assigns the annotation information with the function.

You don't need to use angular's inline injection annotations if you don't want to. Angular can figure out the needed injection by the parameter name. This causes an issue when you minimize your code but ngmin solves that problem: https://github.com/btford/ngmin

For example:

    angular.module('app').controller('someController', function ($scope, ModelService, AuthService) {
      $scope.something = 'Blah';
    });
Works just fine as long as it isn't minimized, and ngmin would turn it into something like:

    angular.module('app').controller('someController', ['$scope', 'ModelService', 'AuthService', function ($scope, ModelService, AuthService) {
      $scope.something = 'Blah';
    }]);
Which is then safe to run through a minimizer.

Re: Converting an existing Backbone.js project to Require.js

#13
post #9

I'm really puzzled by the enthusiasm around RequireJS. I've read up on it, I've built several large JS applications (~100 models, views, whatevers in ExtJS and Knockout), have been involved with a large BackboneJS/RequireJS application and am currently rebuilding a large site in AngularJS. AFAICT, RequireJS did not solve any problems that I had more easily solved with proper namespacing (yes, the feared global , e.g.…

Use this syntax, IMHO it's a LOT more readable: define(function(require) { var $ = require('jquery'), Handlebars = require('handlebars'), Backbone = require('backbone'), MyModel = require('mymodel'), MyControllerAnimals = require('mycontrolleranimals'); Also require.js comes with an optimizer that automatically concatenates all required files (and no more!) minifies them and you don't have to worry about script order…

Totally agreed and you get the benefit that it's the same syntax as NodeJS. But I rarely if ever see that syntax used...

Re: Converting an existing Backbone.js project to Require.js

#14

I'm really puzzled by the enthusiasm around RequireJS. I've read up on it, I've built several large JS applications (~100 models, views, whatevers in ExtJS and Knockout), have been involved with a large BackboneJS/RequireJS application and am currently rebuilding a large site in AngularJS. AFAICT, RequireJS did not solve any problems that I had more easily solved with proper namespacing (yes, the feared global , e.g.…

Hrm.... I don't think the angular documentation agrees with what you are saying: In the documentation on the $inject annotation: > Care must be taken that the $inject annotation is kept in sync with the actual arguments in the function declaration. > This method of annotation is useful for controller declarations since it assigns the annotation information with the function.

Agreed, there are corner cases in which Angular has the same issue (hence my note that Angular does better). This is really only an issue when seriously minifying (e.g. closure compiler) your application code and I tend to stay away from that.

Re: Converting an existing Backbone.js project to Require.js

#16
The RequireJS plugin system is really useful.

Alex Sexton's handlebars plugin is a great example of what sets this apart: https://github.com/SlexAxton/require-handlebars-plugin

- The javaScript code only sees the compiled template function

- Handlebars partials and helpers are automatically discovered and registered as needed

- The optimizer can be used to precompile all template code, makes for fast page loads

I've been using this with an i18n solution that folds in the MessageFormat.js project as well, which makes for a nice pluralization system even if you don't need true localization.

Re: Converting an existing Backbone.js project to Require.js

#17
Minor nitpick which might simplify your life - instead of declaring dependencies in the header (i.e. define(['xxx'],..)), just use any of your dependencies with require('') inside your code. I.e. do something like this:

  define(function() {
    var $ = require("jquery");
  });
This will require one module per file and either define aliases inside config.js or using full path to the modules, but will not push you to define any dependencies upfront.

Also as a bonus, when you use r.js optimizer, which will concatenate your .js file into one giant file, it automatically resolve dependencies and rewrite header for you.

Also minor gotcha I had to deal with - since requirejs literally parse JS code for any require("..") calls, you can not put module name into variable and do require(variable_name) unless this code already loaded in the current context. So try always put actual name into require("...") call.

disclaimer: working on quite large require.js powered app - https://www.myedu.com/ - not entire app is converted into require.js, but you can already checkout My Jobs page to get an idea of what is possible - e.g. async loading of various submodules when needed depending on current route.

Re: Converting an existing Backbone.js project to Require.js

#19
post #17

Minor nitpick which might simplify your life - instead of declaring dependencies in the header (i.e. define(['xxx'],..)), just use any of your dependencies with require('') inside your code. I.e. do something like this: define(function() { var $ = require("jquery"); }); This will require one module per file and either define aliases inside config.js or using full path to the modules, but will not push you to define a…

Offtopic: your employer MyEdu constantly spammed me throughout college with emails pretending to be from a university affiliate, when you had just slurped everyone's email from the public contact database. The intent was clearly to deceive and misrepresent the nature of the email. Shame on you for working for a spammy and exploitative business.

Re: Converting an existing Backbone.js project to Require.js

#20

I'm really puzzled by the enthusiasm around RequireJS. I've read up on it, I've built several large JS applications (~100 models, views, whatevers in ExtJS and Knockout), have been involved with a large BackboneJS/RequireJS application and am currently rebuilding a large site in AngularJS. AFAICT, RequireJS did not solve any problems that I had more easily solved with proper namespacing (yes, the feared global , e.g.…

That can easily be solved by paying attention.
Post reply on HN