Issue 1:
The dart2js build step for apps with large numbers of components (>500) is running out of memory.

Abstracting duplicated and boilerplate code out of generated change detectors and into utilities and/or AbstractChangeDetector will give dart2js less code to process and should help with memory pressure.

Issue 2:
I'm submitting a ... (check one with "x")

[ x ] bug report
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

I am currently trying async load some components as is done in angular2-webpack-starter. These components are using guards similar to the examples in the router 3.0.0-alpha.7 docs, and upon attempting to navigate to the async component, I get the error:

EXCEPTION: Error: Uncaught (in promise): TypeError: Cannot read property 'annotations' of undefined

Expected/desired behavior

To be able to load guarded components asynchronously.

Reproduction of the problem

If the current behavior is a bug or you can illustrate your feature request better with an example, please provide the steps to reproduce and if possible a minimal demo of the problem via https://plnkr.co or similar (you can use this template as a starting point: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5).

I have provided some examples and insight as to the setup that is causing this issue here: AngularClass/webpack-toolkit#1

Basically, I followed the example for creating a canDeactivate guard following the docs for the 3.0.0-alpha.7 router, and it works fine when loaded normally, but errors when loaded asynchronously.

To demonstrate this problem you could create a guard for preventing the user from leaving the view with something along these lines:

import { CanDeactivate } from '@angular/router';
import { Observable } from 'rxjs/Observable';
export interface CanComponentDeactivate {
canDeactivate: () => boolean | Observable<boolean>;
}
export class CanDeactivateGuard implements CanDeactivate<CanComponentDeactivate> {
canDeactivate(component: CanComponentDeactivate): Observable<boolean> | boolean {
return component.canDeactivate ? component.canDeactivate() : true;
}

You might then implement that guard like so on a component to prevent the user from navigating away from a form before submitting it, for example:

canDeactivate(): Observable<boolean> | boolean {
// Ask the user with a confirmation dialog service
if(!this.userForm.pristine && !this.accepted) {
return confirm('You haven\'t submitted your registration. Are you sure '
+ 'you want to navigate away from this page?'); }
else {
return true;
}
}

I have my routes configured as so:

import { RouterConfig } from '@angular/router';

import { Home } from './home';

import { CanDeactivateGuard } from './shared/interfaces/can-deactivate.interface';

export const routes: RouterConfig = [
{ path: '', component: Home },
{ path: 'home', component: Home },
{ path: 'about', component: 'About' },
{ path: 'register', component: 'Register', canDeactivate: [CanDeactivateGuard] }
];

export const asyncRoutes = {
'About': require('es6-promise-loader!./about'),
'Register': require('es6-promise-loader!./register/register.component')
};

Attempting to navigate to the Register component in this case produces the error above.

Please tell us about your environment:

Angular version: 2.0.0-rc.3

Browser: [ Chrome 51 ]

Language: [ TypeScript 1.8.10 ]