- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我对使用 slickgrid 还很陌生,我正在尝试使用它加载 1200 条记录。加载数据所花费的时间大约为 6 秒(这相当长)。如何减少服务器的加载时间?我在 SO 中看到了一些示例示例,但没有一个对我有帮助。
一种方法是先加载前 100 条记录,然后在底部加载剩余的元素。我怎样才能做到这一点?
这是我的代码:
<script>
var grid;
var columns = [
{ id: "Class", name: "Class", field: "Class", formatter: alignFormatter1},
{ id: "Number", name: "Number", field: "Number", formatter: alignFormatter2},
{ id: "Subject", name: "Subject", field: "Subject",formatter: alignFormatter3},
{ id: "Student", name: "Student", field: "Student", formatter: alignFormatter4},
{ id: "Date", name: "Date", field: "Date", formatter: alignFormatter5},
];
function dayFormatter(row, cell, value, columnDef, dataContext) {
//return value + ' days';
}
function dateFormatter(row, cell, value, columnDef, dataContext) {
//return value.getMonth() + '/' + value.getDate() + '/' + value.getFullYear();
}
function alignFormatter1(row, cell, value, columnDef, dataContext) {
return "<span style='margin-left: 32px;'>"+dataContext.Class+"</span>";
}
function alignFormatter2(row, cell, value, columnDef, dataContext) {
return "<span style='margin-left: 22px;'>"+dataContext.Number+"</span>";
}
function alignFormatter3(row, cell, value, columnDef, dataContext) {
return "<span style='margin-left: 10px;'>"+dataContext.Subject+"</span>";
}
function alignFormatter4(row, cell, value, columnDef, dataContext) {
return "<span style='margin-left: 32px;'>"+dataContext.Student+"</span>";
}
function alignFormatter5(row, cell, value, columnDef, dataContext) {
return "<span style='margin-left: 95px;'>"+dataContext.Date+"</span>";
}
var options = {
enableCellNavigation: true,
enableColumnReorder: true,
multiColumnSort: true,
editable: true
};
$(function () {
var MS_PER_DAY = 24 * 60 * 60 * 1000;
var data = [];
var listdata = <?php echo json_encode($storeData)?>;
console.log(listdata);
for (var i = 0; i < listdata.length; i++) {
data[i] = {
Class: listdata[i][0],
Number: listdata[i]['1'],
Subject: listdata[i]['2'],
Student: listdata[i]['3'],
Date: listdata[i]['4'],
};
}
grid = new Slick.Grid("#myGrid", data, columns, options);
grid.setSelectionModel(new Slick.CellSelectionModel());
grid.registerPlugin( new Slick.AutoTooltips({ enableForHeaderCells: false }) );
grid.registerPlugin(checkboxSelector);
grid.onSort.subscribe(function (e, args) {
var cols = args.sortCols;
data.sort(function (dataRow1, dataRow2) {
for (var i = 0, l = cols.length; i < l; i++) {
var field = cols[i].sortCol.field;
var sign = cols[i].sortAsc ? 1 : -1;
var value1 = dataRow1[field], value2 = dataRow2[field];
var result = (value1 == value2 ? 0 : (value1 > value2 ? 1 : -1)) * sign;
if (result != 0) {
return result;
}
}
return 0;
});
grid.invalidate();
grid.render();
});
})
</script>
<script type="text/javascript">
var awidth,aheight,newheight;
awidth=$(window).width();
aheight=$(window).height();
newheight=aheight*0.9-150;
newheight = newheight | 0;
document.getElementById('myGrid').setAttribute("style","height:"+newheight+"px;");
</script>
注意:根据评论的建议,将php编码加起来
<?php
$sql = "SELECT * FROM university_marks WHERE 1 ".$where. "ORDER BY Date desc";
//echo $sql;
$searchdetails = mysql_query( $sql );
$num_rows = mysql_num_rows($searchdetails);
$storeData = array();
$i= 0;
while ($row = mysql_fetch_array($searchdetails)) {
$storeData[$i][] = $row['ID'];
$storeData[$i][] = $row['1'];
$storeData[$i][] = $row['2'];
$storeData[$i][] = $row['3'];
$storeData[$i][] = $row['4'];
$storeData[$i][] = $row['5'];
$sql4 = "SELECT * FROM `faculty_address` WHERE id = $id and address!= '' ";
$adddetails4 = mysql_query($sql4);
$facultydetails4 = mysql_fetch_assoc($adddetails4);
$num_rows5 = mysql_num_rows($adddetails4);
if($num_rows5 > 0){
$storeData[$i][] ='Filled';
}
else{
$storeData[$i][] ='Notfilled';
}
$sql5 = "SELECT * FROM `students_attendence` WHERE id = '".$id."' AND ID_course='".$course."'";
$adddetails5 = mysql_query($sql5);
$csipdetails5 = mysql_fetch_assoc($adddetails5);
$num_rows6 = mysql_num_rows($adddetails5);
if($num_rows6 > 0){
$storeData[$i][] ='Filled';
}
else{
$storeData[$i][] ='Notfilled';
}
$sql6 = "SELECT * FROM `students_marks` WHERE CA_ID = $id AND column1!= '' AND column2 !='' AND column3 !='' ";
$adddetails31 = mysql_query($sql31);
$studetails31 = mysql_fetch_assoc($adddetails31);
$num_rows41 = mysql_num_rows($adddetails31);
if($num_rows41 > 0){
$storeData[$i][] ='Filled';
}
else{
$storeData[$i][] ='Notfilled';
}
$i++;
}
?>
根据评论中的建议,我在 php 中执行 sql 查询时遇到了瓶颈问题。 SQL 查询占用太多时间,导致延迟。我需要这些值来填充 slickgrid 中的列数据($sql4、$sql5、$sql6、)
最佳答案
在此澄清一下,这不是 SlickGrid 问题。
初步确定问题所在的最佳方法是在 Chrome 中加载页面,打开开发人员工具 (ctrl-shift-I) 并检查“网络”选项卡。这将向您显示页面加载中的页面源时间。
看来问题确实出在服务器端,如果您要检索 1200 条记录,然后对每条记录运行 3 个查询,那么您将对数据库运行 3600 个单独的查询。难怪需要6秒!正如@Eakethet 所建议的那样,花一些时间学习一些基本的 SQL 并将所有这些重写为一个查询。您可能还需要添加一些数据库索引以加快相关数据的查找。如果完成所有这些,您应该能够在 500 毫秒内获得响应。
关于javascript - 即使加载 1000 条记录,光滑的网格也太慢了,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52718198/
我有一个网站。 必须登录才能看到里面的内容。 但是,我使用此代码登录。 doc = Jsoup.connect("http://46.137.207.181/Account/Login.aspx")
我正在尝试为我的域创建一个 SPF 记录并使我的邮件服务器能够对其进行评估。我在邮件服务器上使用 Postfix 并使用 policyd-spf (Python) 来评估记录。目前,我通过我的私有(p
我需要为负载平衡的 AWS 站点 mywebsite.com 添加 CName 记录。记录应该是: @ CNAME mywebsite.us-east-1.elb.amazon
我目前正在开发一个相当大的多层应用程序,该应用程序将部署在海外。虽然我希望它在解聚后不会折叠或爆炸,但我不能 100% 确定这一点。因此,如果我知道我可以请求日志文件,以准确找出问题所在以及原因,那就
我使用以下命令从我的网络摄像头录制音频和视频 gst-launch-0.10 v4l2src ! video/x-raw-yuv,width=640,height=480,framerate=30/1
我刚刚开始使用 ffmpeg 将视频分割成图像。我想知道是否可以将控制台输出信息保存到日志文件中。我试过“-v 10”参数,也试过“-loglevel”参数。我在另一个 SO 帖子上看到使用 ffmp
我想针对两个日期查询我的表并检索其中的记录。 我这样声明我的变量; DECLARE @StartDate datetime; DECLARE @EndDate datetime; 并像这样设置我的变量
在 javascript 中,我可以使用简单的 for 循环访问对象的每个属性,如下所示 var myObj = {x:1, y:2}; var i, sum=0; for(i in myObj) s
最近加入了一个需要处理大量代码的项目,我想开始记录和可视化调用图的一些流程,让我更好地理解一切是如何组合在一起的。这是我希望在我的理想工具中看到的: 每个节点都是一个函数/方法 如果一个函数可以调用另
如何使用反射在F#中创建记录类型?谢谢 最佳答案 您可以使用 FSharpValue.MakeRecord [MSDN]创建一个记录实例,但是我认为F#中没有任何定义记录类型的东西。但是,记录会编译为
关闭。这个问题不满足Stack Overflow guidelines .它目前不接受答案。 想改善这个问题吗?更新问题,使其成为 on-topic对于堆栈溢出。 3年前关闭。 Improve thi
我是 Sequelize 的新手并且遇到了一些语法问题。我制作了以下模型: // User sequelize.define('user', { name: { type: DataTyp
${student.name} Notify 这是我的output.jsp。请注意,我已经放置了一个链接“Notify”以将其转发到 display.jsp 上。但我不确定如何将 Stud
例如,这是我要做的查询: server:"xxx.xxx.com" AND request_url:"/xxx/xxx/xxx" AND http_X_Forwarded_Proto:(https O
我一直在开发大量 Java、PHP 和 Python。所有这些都提供了很棒的日志记录包(分别是 Log4J、Log 或logging)。这在调试应用程序时有很大帮助。特别是当应用程序 headless
在我的Grails应用程序中,我异步运行一些批处理过程,并希望该过程记录各种状态消息,以便管理员以后可以检查它们。 我考虑过将log4j JDBC附加程序用作最简单的解决方案,但是据我所知,它不使用D
我想将进入 MQ 队列的消息记录到数据库/文件或其他日志队列,并且我无法修改现有代码。是否有任何方法可以实现某种类似于 HTTP 嗅探器的消息记录实用程序?或者也许 MQ 有一些内置的功能来记录消息?
如果我有一条包含通用字段的记录,在更改通用字段时是否有任何方法可以模仿方便的 with 语法? 即如果我有 type User = // 'photo can be Bitmap or Url {
假设我有一个名为 Car 的自定义对象。其中的所有字段都是私有(private)的。 public class Car { private String mName; private
当记录具有特定字段时,我需要返回 true 的函数,反之亦然。示例: -record(robot, {name, type=industrial, ho
我是一名优秀的程序员,十分优秀!