This demo showcases the two different rendering modes of Telerik's ASP.NET RadRibbonBar control: Classic and Lightweight.
-
Classic rendering is the long-standing rendering mode of the control.
-
Lightweight rendering leverages HTM5 and CSS3,
but the control may lose its rounded corners, gradients and
shadows in non-modern browsers.
There is also a Native render mode option inherited directly from
RenderMode. As RadRibbonBar does not have a specific HTML element, the Native render
mode will have the same effect as the Classic one.
The default render mode of the control is Classic and you have
the option to either explicitly set it to Lightweight or leverage
the Auto mode to have the control choose the best rendering based
on the user's browser.
Note: In order to provide optimal experience for your end users,
we recommend that you use only one type of render mode for a control on a given
page. For example, if you have two instances of RadFormDecorator on the page,
it will be best if both of them use the same render mode.
Note: The Material skin is available only for the modern Lightweight
render mode. Change the skin or the mode to properly visualize the demonstrated control.
Notes on the statistics:
The markup size is calculated automatically in the code-behind by rendering a simple RadRibbonBar instance on a blank page.
*The image sprite that causes the increase in size is a common one, used by various Telerik controls on the page, so with more controls the benefits will be more apparent.