[MatCheckbox] nested ripple registers events even if disableRipple is set.

[takamori]

Bug, feature request, or proposal:

When using MatCheckbox, MatRipple and RippleRenderer is instantiated and registers events even if disableRipple is set on the checkbox.

What is the expected behavior?

If disableRipple is set, MatRipple and RippleRenderer should not be instantiated, or at the very least the events should not be registered during the initial render.

What is the current behavior?

There are 10 events registered for each checkbox, slowing down the render of the checkbox.

What are the steps to reproduce?

http://embed.plnkr.co/PZ0P3EerE2aeJPR4Kasa/

When clicking on the button to view Material Checkboxes, 30-45% of the time is spent on adding event listeners.

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

This is visible when using a virtual rendering component to show a large number of items with checkboxes and scrolling, or when rendering the full list as in here. The result is slow rendering or janky scrolling.

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

All versions are affected. Tested with Angular 2 with Chrome 62 on MacOS.

Is there anything else we should know?

[takamori]

I would have expected an *ngIf="_isRippleDisabled()" at this line: https://github.com/angular/material2/blob/master/src/lib/checkbox/checkbox.html#L19

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}