Friday, November 6, 2009

The Closure Compiler turns a Pattern into an Antipattern

I have been waiting months to publish this blog post. When I attended The Ajax Experience 2009, I saw a number of "misguided" things that people were doing with JavaScript.* Knowing that Google was in the process of open-sourcing the Closure Compiler and the Closure Library (I was working on the Compiler effort before I left), I wanted to get up and yell, "Stop -- you're all doing it wrong!"

But I didn't.

The Closure Library and Closure Compiler that Google released yesterday are game-changing. I have always heavily subscribed to Fred Brooks's No Silver Bullet argument, but it's possible that the Compiler will improve your web development processes by an order of magnitude. Errors that previously may not have been caught until manual testing can now be caught at compile time. Before the Closure Compiler came along, there wasn't even such a thing as "compile time" when it came to JavaScript!

The Compiler is complex -- it will likely take some time for developers to wrap their heads around it. It was hard to write JavaScript at Google without also thinking about what the Compiler would do to it. For sure, the Compiler will change the way you write JavaScript code.

To illustrate one of the things that will change, I put together a detailed article on inheritance patterns in JavaScript that compares the functional and pseudoclassical object creation patterns. Now that the Closure Compiler is available, I expect the pseudoclassical pattern (that the Closure Library uses) to dominate.

Special thanks to Mihai and Kushal for reading drafts of the inheritance article.

*I saw a number of innovative things at the conference as well, but none that would have the same impact as the Closure Compiler. However, there was one presentation at The Ajax Experience titled The Challenges and Rewards of Writing a 100K line JavaScript Application that revealed that a company called Xopus in the Netherlands had built their own JavaScript compiler. It is the closest thing I have seen outside of Google to the Closure Compiler. My only objection to it is that I believe that the input to their compiler is not executable on its own.

For example, slide 12 shows some sample code that calls Extends("com.xopus.code.Animal") which has no apparent reference to the class doing the extending, so it is hard to imagine how calling Extends() has the side-effect of providing Animal's methods to Monkey. Presumably, the compiler treats Extends() as a preprocessor directive whereas Closure's goog.inherits() will actually add the superclass's methods to the subclass's prototype. Closure generally relies on annotations, such as @extends, for compiler directives rather than function calls. Closure code should always be executable in both raw and compiled modes.

26 comments:

  1. You can find more details on using Google Closure API with ASP.NET at Using Closure Compiler with ASP.NET - A C# Wrapper .

    It features a C# wrapper for the tool.

    ReplyDelete
  2. I presented about the Xopus App Framework at the Ajax Experience. I'd like to emphasize that our raw source code does in fact execute without preprocessor. All you need is a script with the compiler (written in JavaScript). We use that property for unit testing and dynamic loading of code.

    It is true that the code doesn't look very executable, but that is because we sacrificed a clean compiler implementation against readable source code.

    Our compiler relies on the order of the directives. Like you say about the Google Closure Compiler, at Xopus we also have to follow the rules of the compiler (but you can insert plain JavaScript if you need for rapid prototyping). Each file must start with a Package directive followed by one of more Import, Extends or Resource directives followed by a Class directive. The compiler figures out how to build a prototype chain from that.

    ReplyDelete
  3. Excuse me, but what exactly is the pattern and what is the anti-pattern?

    ReplyDelete
  4. As explained in the article (http://bolinfest.com/javascript/inheritance.php), I argue that the functional pattern should now be considered an antipattern now that the Closure Compiler removes the hazards of the pseudoclassical pattern. As measured by Erik (http://erik.eae.net/archives/2009/11/09/21.12.16/), the functional pattern can be quite expensive in terms of both memory and speed.

    ReplyDelete
  5. Thanks for the answer. Now it's all clear.

    Sidenode: What's wrong with wrapping a pseudoclassically defined class in a (function(){})(); to provide private state to the prototype functions?

    ReplyDelete
  6. filibeli: You should not use the REST API for serious compilation (in this case, that means files over 200000 bytes). See http://groups.google.com/group/closure-compiler-discuss/browse_thread/thread/cc51721d85ee5209# As discussed on the thread, you should use the compiler locally for larger projects. That will also eliminate the network latency introduced by the REST API and allow you to compile offline!

    ReplyDelete
  7. fforw: I'm not sure what you mean or what the motivation for doing that would be.

    ReplyDelete
  8. Laurens: does that mean Package(), Import(), and Extends() are stateful? That is, they act on the last thing passed to Package()? That must result in some nasty bugs if you forget the Package() line!

    ReplyDelete
  9. This comment has been removed by the author.

    ReplyDelete
  10. Why hello there ?! Our platform https://essaysrescue.com/123helpme-review/ have a dedicated support team who work round the clock, ready to provide speedy assistance to all customers. Whatever issue you are experiencing, feel free to contact support via the live chat feature, and they will respond and sort out your issue immediately.

    ReplyDelete
  11. I think This definitely is definitely an enlightening post and it is very beneficial and experienced. Hence, I would like to thanks Along with the endeavours you might have in-built scripting this facts.สล็อต 999

    ReplyDelete
  12. Excellent to browse your limited short article! I am searching in advance to sharing your adventures and encounters.สล็อตวอเลท

    ReplyDelete
  13. Wow! This type of the great and sensible article This is commonly. I really seriously obtain it irresistible. It's so top-quality and so magnificent. I am just stunned. I hope that you select to go on to execute your perform comparable to this Quicker or later also...บา คา ร่า วอ เลท

    ReplyDelete
  14. I had been inspecting many within your info on this Web page And that i conceive this Globe-wide-World wide web Internet site is basically educational ! Carry on Placing up.บา คา ร่า วอ เลท

    ReplyDelete
  15. I had been inspecting many within your info on this Web page And that i conceive this Globe-wide-World wide web Internet site is basically educational ! Carry on Placing up.สล็อตเว็บใหญ่

    ReplyDelete
  16. Wow, What a Superb set up. I truly noticed this to An incredible deal informatics. It is actually just what I had been seeking to locate.I want to advise you that make sure you maintain sharing this kind of variety of information.Many thanksบา คา ร่า วอ เลท

    ReplyDelete
  17. Wonderful put up! This really is a very amazing blog site which i will definitively come back to much more moments this yr! Lots of many thanks for helpful post.สล็อต ฝาก-ถอน true wallet ไม่มี บัญชีธนาคาร

    ReplyDelete
  18. I had been inspecting many within your info on this Web page And that i conceive this Globe-wide-World wide web Internet site is basically educational ! Carry on Placing up.บาคาร่าวอเลท

    ReplyDelete
  19. Hi, I have browsed a lot of the posts. This publish might be in which by I received undoubtedly quite possibly the most practical facts for my review. Thanks for submitting, It is feasible we will see additional on this. Have you ever been informed about some other Internet-sites on this difficulty.สล็อตทรูวอเลท

    ReplyDelete
  20. Thanks with the web site filled with countless details. Halting by your weblog aided me to have what I had been trying to find. Now my task has become as simple as ABC.สล็อตxo

    ReplyDelete
  21. Hey, today is an excessive amount outstanding for me, Given that this time I'm on the lookout as a result of this enormous instructive write-up under at my home. Thanks quite a bit for large energy.เว็บสล็อตเว็บตรง

    ReplyDelete
  22. I think This may be an informative publish and it can be vitally beneficial and proficient. Therefore, I would want to thanks for your endeavors you've produced in creating this text. Most of the created information is totally successfully-investigated. A lot of thanks...เว็บตรงสล็อต

    ReplyDelete
  23. Amazing report, it is especially useful! I quietly started off Using this type of, and i am acquiring far more acquainted with it improved! Delights, keep carrying out a good deal more and further exceptional!เกมสล็อต

    ReplyDelete
  24. Amazing work detailed right here on _______ I endure a great deal of weblog posts, but I hardly ever heard a topic like this. I like this material you crafted with regards into the blogger's bucket document. Incredibly resourceful.สล็อต เว็บ ตรง

    ReplyDelete