ng-conf 2015 / AngularJS 2.0

#RennesJS

# Ng-Conf 2015

● March 5-6, 2015 (Salt Lake City, Utah)○ 2 days / 43 speakers / 25 talks○ ng-conf.org

● Ng-Europe previously (Oct. 2014 - Paris)○ AngularJS 2.0 & AtScript (first announcement)○ Angular 1.4 & New Router ○ ngeurope.org

# Keynote (by Igor Minar & Brad Green)

# Keynote

● A New Website○ AngularJS 2 => angular.io○ AngularJS 1 => angularjs.org

● Angular Material Design○ material.angularjs.org

material.angularjs.org

# Evolving AngularJS

● Angular core team has grown○ 15 members in 2014○ 45 members for early 2015

● Angular community is growing○ 100K+ unique GitHub visitors / 2 week○ ~ 1600 new issues and PRs created○ ~ 200 new contributors

# Evolving AngularJS

● Project models○ Closed Source○ Open Source Export○ Open Source w/ community involvement

github.com/angular

# Angular 1 Still Alive

● Angular 1 is not dead○ 1.3 => 1.4 => 1.5 (=> 1.6)○ Continue to release 1.x until the community stops

using it

● Angular 1.4 (RC0)○ ~30% faster digest times vs 1.3○ 2-4% memory footprint improvement (Less GC pressure)

# Shorter Release Cycles

# Migration 1.x => 2.x

● “Big Bang”○ Stop 1.x and move all features into 2.0 code

● “Incremental”○ Keep developing in 1.x, start migrating individual

views○ Migrate core router and start migrating individual

views

# Migration 1.x => 2.x

● A New Router (since 1.4)○ To help bridge the gap to Angular 2○ Component based○ Compatible with Angular 2 and Angular 1

● Angular >= 1.5○ more common components with Angular 2

# Angular @ Google

# Winter Angular 2 Is Coming

● Angular 2 Themes○ Simplicity○ Consistent○ Flexible○ Fast○ Productive

● Angular 2 in Alpha (angular.io)○ Not ready for production

# Legacy of Angular 1

○ Dependency injection

○ Data binding○ Directives○ Routers (1.4)○ Filters○ Animation○ Accessibility

○ i18n (1.4)○ Forms (1.4)○ Expressions○ Material Design○ Protractor○ Karma○ Mocks

# New Features in 2.x

● New languages● Web Components● New template syntax● Viewports● Unidirectional data flow● Ultra-fast change detection● (Style Guide)

# AtScript === TypeScript

● Collaboration b/n Google & Microsoft ● Merge of AtScript & TypeScript● TypeScript 1.5+

○ Type annotations○ Field annotations○ Metadata annotations○ Type Introspection with Annotation Support

● ES6, Dart and TypeScript support

# ES6 Support (Today)

http://kangax.github.io/compat-table/es6/

# 2 Fast 2 Furious

○ Improved performance in Angular 2

○ Change detection is up to 10x faster

○ Cache view rendering

# Web Components

1 Class + 2 @Annotations = 1 Web Comp.

● angular.io/docs/js/latest/quickstart.html (part.4)● plnkr.co/edit/QZ6c6cRnvOyQ71FkowZO?p=options

# And... lots of other Cool Stuff !

● AngularFire 1.0○ www.firebase.com/docs/web/libraries/angular/

● Angular + React● Angular + Meteor● Collab. b/n Angular & Ember (Router + Tc39)● Ionic & Angular● Benchmarking Tools● ...

# Links

● Ng-Conf ○ videos : youtube.com/playlist?list=[…]○ slides : docs.google.com/spreadsheets/[...]

● Quick starter ng2○ github.com/angular/quickstart○ ng-learn.org/2014/03/AngularJS-2-Status-Preview/

● a ToDo with ng2○ github.com/davideast/ng2do

# Thanks

● credits○ www.ng-conf.org○ twitter.com/hashtag/ngconf?src=hash&mode=photos○ www.pauljeter.net○ www.pauljeter.net○ scotch.io

Thanks to them ;-)

@NicoPennec