Rebuilding DoubleClick with AngularJS¶
- http://www.meetup.com/AngularJS-SF/events/76149102/
- August 14, 2012
- At Google San Francisco
- Case study about use of AngularJS for DoubleClick
Meetup Description
This month we’ll have a very special guest speaker - Marc Jacobs, tech lead of the DoubleClick Digital Marketing Manager team in NYC. If you want to get first hand info about building a large enterprise app with AngularJS, this is the meetup for you!
This presentation will be done over video-conference (from Mountain View) and attendees are encouraged to ask questions and join the discussion over the video link. Additionally, one or two AngularJS core team members will be present on site and can answer questions locally as well.
Old app¶
- DFA6 FE was C# on ASP.NET
- DFA6 BE was Java on Oracle
New App - challenges¶
Rebuild DFA using technologies that made more sense for Google.
- Engineering skills
- Google tech backends
GWT or not?
- Principal UI technology across Google advertising products
- No resources on their team familiar with it
- Hard to find engineers with GWT
Other tools they considered
- Backbone.js
- JavaScriptMVC
- others
Enter AngularJS
- It was declarative
- Had two-way data binding
- Used plan old JavaScript objects
- Happily integrated with JQuery
- It had a full testing story
- It had a straightforward architectural model
Transition to prototype¶
One engineer created a basic prototype in two days.
- Used existing web services and CSS
- 10% time spent compared to GWT
- 10% of the size of code base
Transition to AngularJS¶
- Early Strategy: Upgrade the app page-by-page
- Eventual Strategy: Rewrote the app from scratch
Their AngularJS strategy caused a lot of FUD:
- Why weren’t they using GWT?
- AngularJS maintained by less than 5 people.
Google got over the FUD and now embrace AngularJS.
Other libraries they use¶
- JQuery
- Underscore.js
- Closure Compiler (https://developers.google.com/closure/compiler/)
- LESS
- HTML5 Boilerplate
Third-party controls¶
Started with JQueryUI but now have their own:
- list
- grid
- validation framework
- notification framework
Open sourcing their work?¶
- Sharing across google
- Content that it’s too specific for their use cases
Note
I think that they haven’t released some of their commonly used code is not good.
Internationalization¶
- DFA is translated into 10 languages
- The have a custom wiki-like language for things to be translated
- They rewrote the
gettext
protocol.
Caching¶
- Server
- HTTP
- Browser
- $http
- Application
AngularJS in review¶
advantages¶
- Leverages standard web technologies
- New engineers get up to speed quickly
- Testing is deeply embedded in the Angular way
- Velocity of development is excellent
- Passionate framework team
- Growing community of framework users
disadvantages¶
- AngularJS scenarios are ignored, poorly documented, and not at all obvious to use.
- AngularJS unit testing technologies are currently in flux.
- AngularJS documentation is quite buggy and is missing some key conceptional content.
realities¶
- Flexible, powerful, but also complex
- Dependency Injection is awesome, but a mind-bender for many JS engineers
- Does not attempt to solve all key problems in large-scale web application design
- Mixing client/server-side templating can be messy, yet it may be unavoidable.
Closing thoughts:
I wish I came out of this talk knowing something about how AngularJS actually works.
The documentation and style of what I see in the AngularJS docs makes me think of a modernized Dojo.