JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<a id="full">full</a> | <a id="compact">compact</a>

<div class="k-content" style="width:600px;">
	<div id="grid"></div>
</div>

CSS

body{
    font:12px/14px arial;
}
a{
	cursor: pointer;
}
.k-grid tbody td{
	height: 60px;
	white-space: nowrap;
}
.compact tbody td{
	height: auto;
}

JavaScript

var pageSize = 30, cache = {}, ds, gd, vs;
ds = new kendo.data.DataSource({
        type: "odata",
        serverPaging: true,
        serverSorting: true,
        pageSize: 100,
        transport: {
            read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
        }
	});
var gd = $('#grid').kendoGrid({
	dataSource: ds,
	scrollable: {
		virtual: true
    },
    dataBound: function(){
        // fixed scrollbar problem
    	setTimeout(function(){
    		$('#grid .k-scrollbar').trigger('scroll');
    	});
    },
    columns: [
        { field: "OrderID", title: "Order ID", width: 60 },
        { field: "CustomerID", title: "Customer ID", width: 90},
        { field: "ShipName", title:"Ship Name", width: 220 },
        { field: "ShipAddress", title:"Ship Address", width: 280 },
        { field: "ShipCity", title:"Ship City", width: 110 },
        { field: "ShipCountry", title:"Ship Country", width: 110 }
    ],
    height: 300
}).data('kendoGrid');
ds.read();

vs = $('#grid .k-grid-content').data('kendoVirtualScrollable');

function setView(mode){
	var scrollTopRatio = vs.verticalScrollbar.scrollTop() / vs.verticalScrollbar.children().height();
	

	if (mode == 'compact') $('#grid').addClass('compact');
	else $('#grid').removeClass('compact');

	var rowHeight = $('#grid .k-grid-content tr:first').height();
	gd._rowHeight = rowHeight;
	gd._sum = rowHeight;
	vs.itemHeight = rowHeight;
	vs.refresh();
	
	setTimeout(function(){
		ds.read();
		vs.verticalScrollbar.scrollTop(Math.ceil(scrollTopRatio * vs.verticalScrollbar.children().height()));
	}, 1);
}

$('#full').click(function(){
    setView('full');
});
$('#compact').click(function(){
    setView('compact');
});