md-tabs watchers usage

[EricBorlandAC]

First of all, thank you all for this awesome work. I so enjoy using the angular material module in my app and my clients love it too.

A similar issue was open few months ago: #1620

I am experiencing a performance issues when using md-tabs due to the number of watchers that each tab generates.
The fact is that each tab consumes around 30-40 watchers what I think it is a lot.

My actual application has a list of cards and each card has two tabs, if you count 30 watchers per tab, each card has, at least, 60 watchers. If my list, for example will have 50 elements, my app will have already 3000 watchers, so the performance is not really good as you can imagine. I am implementing server pagination but at this level, counting that the app has another elements (toolbar, sidenav, menus, etc) when the list is just 12 items the UX is already suffering a lot. The user should be able to see at least 50 elements without querying the server but with tabs it is completely impossible.

If i create my own (and ugly) custom tabs directive with two buttons and two ng-if's the performance is much better and the UX with 50 elements is pretty good.

I've created 3 codepens showing the watchers consumption of the md-tabs:

1. Empty Document consuming 0 watchers: http://codepen.io/anon/pen/xGLgMd
2. Document with a single md-tabs directive with two emtpy tab's inside, cosuming around 71 watchers: http://codepen.io/anon/pen/zGdNeo
3. Document with an ng-repeat of 30 elements each containing an md-tabs with two empty tab's inside, consuming around 2233 watchers: http://codepen.io/anon/pen/WvERPq

Is this the expected behavior of the md-tabs? Is there any plan to improve or reduce the watchers an empty tab needs?

Thank you very much.

Eric.

[kuhnroyal]

Try the master, maybe this already helps c806e8b

[EricBorlandAC]

Thanks kuhnroyal for your answer.

I've updated the codepens with the version that is currently in master:
https://cdn.rawgit.com/angular/bower-material/v0.10.0-master-5c08d5c/angular-material.js
But the problem stays there.

For sure c806e8b helps, but I think it wasn't the root of the problem. The last codepen reduced the watchers to 2175... so 58 watchers less but is not enough.

[EricBorlandAC]

I've updated the plunkers to the current master version since I saw some improvements on the tabs performance but the watchers usage is exactly the same.
@robertmesserle Let me know if you need more info or some examples, thx!

[robertmesserle]

@EricBorlandAC In your second example, if you update to the latest master, the count should be down to 1508. I'm going to keep trying to get this number lower, but that was the low-hanging fruit.

[EricBorlandAC]

Hi @robertmesserle I have updated that last example (http://codepen.io/anon/pen/wajzwo) and now the count is 1421 which is a huge step forward. If you can even reduce it more, it would be awesome.

Thank you for the amazing work!