[Tabs] Tabs are loaded eagerly

Bug, feature request, or proposal:

Bug or possibly poor design

What is the expected behavior?

When a tab is never opened, its contents should never be added to the DOM. This is how things worked with alpha 9 on Angular 2.0.1

What is the current behavior?

Even if a tab is never opened, its content is added to the DOM before being removed.

What are the steps to reproduce?

This plunk shows the old behavior , from alpha 9. If you run the application while looking at network requests for images, you will see that only the image from the first tab is downloaded. To download another image, you need to open its tab.

This plunk shows the new behavior, from alpha 10. In this case, all images are downloaded immediately, then removed from the DOM.

What is the use-case or motivation for changing an existing behavior?

In my use case, I have a menu on the first tab and a video on each of several other tabs. Since I upgraded to alpha 10, the browser fetches all the videos at once instead of waiting for the user to open a tab. This results in excessive bandwidth usage.

The same problem would occur for an app that has different image galleries organized by tab

Which versions of Angular, Material, OS, browsers are affected?

Angular 2.1.2, Material 2 alpha 10 on Firefox 49

[amcdnl]

@benelliott - We are working with the core team to fix this behavior. Stay tuned for updates 😃

[pantonis]

@andrewseguin What is the expected behavior of this when it is fixed? Only active tab content is added to DOM? Or all tabs content are added?