dhtml xgrid实现前台大数据延迟加载效果

最新推荐文章于 2022-11-10 10:15:54 发布

原创

最新推荐文章于 2022-11-10 10:15:54 发布 · 4.9k 阅读

本文介绍如何使用dhtml xgrid在前端实现大数据的延迟加载，以提高页面性能和用户体验。通过设置enableBuffering属性，首次加载时只显示一定数量的记录，如20或50条，后续通过滚动条动态加载剩余数据，避免了页面假死，减少了显示大量数据所需的时间。示例中展示了不同缓冲大小对滑动条的影响。

第一步首先是用来展现大数据的前台html页面，当然jsp也可以

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
	<title>Smart Rendering</title>
</head>

<body>
<link rel='STYLESHEET' type='text/css' href='https://blog.csdn.net/common/style.css'>

	<link rel="STYLESHEET" type="text/css" href="https://blog.csdn.net/codebase/dhtmlxgrid.css">
	<script  src="https://blog.csdn.net/codebase/dhtmlxcommon.js"></script>
	<script  src="https://blog.csdn.net/codebase/dhtmlxgrid.js"></script>
	<script  src="https://blog.csdn.net/codebase/ext/dhtmlxgrid_srnd.js"></script>
	<script  src="https://blog.csdn.net/codebase/dhtmlxgridcell.js"></script>
	<table width="600">
		<tr>
			<td width="50%" valign="top">
				<div id="gridbox" width="100%" height="250px" style="background-color:white;"></div>
			</td>

		</tr>
		<tr>
			<td>
                <div id="a_1"></div>
			<

标签