Javascript / AJAX和PHP / MySQL查询返回非常缓慢

Question

我有一个在div中滑动的javascript，然后发送一个ajax调用到php运行一个mysql查询，然后用响应填充div。问题是用响应填充div需要6秒以上，即使我返回0行或1行或50行......我的代码如下，任何帮助都将不胜感激！

JAVASCRIPT

    $(document).ready(function () {
var seenFav=0;
$("#fav_btn").click(function () {
    if (seenFav==0){
    document.getElementById("fav_content").innerHTML ='<div id="favLoadingItem" style="width:32px; height:32px; margin-left:auto; margin-right:auto; margin-top:234px;"><img src="../images/ajax-loader.gif" width="32" height="32" alt="loading" title="loading" /></div>';
    document.getElementById("favSelector").innerHTML ='<div id="favLoadingGroups" style="width:32px; height:32px; margin-left:auto; margin-right:auto; margin-top:234px;"><img src="../images/ajax-loader.gif" width="32" height="32" alt="loading" title="loading" /></div>';
    }
    $("#fav_slider").animate({
        right: $("#fav_slider").parent().width() / 2 - $("#fav_slider").width() / 2
    }, 400);
    $("#fadeTwo").fadeIn(800);
    if (seenFav==0){
    var xmlhttp;
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else { // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("fav_content").innerHTML = xmlhttp.responseText;
            document.getElementById("favLoadingItem").style.display = 'none';
        }
    };
    xmlhttp.open("POST", "includes/queries/favorites.php", true);
    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xmlhttp.send("id=f");
    seenFav=1;
    loadFavGroups();

    }
});
});

    function loadFavGroups() {
var x;
if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
    x = new XMLHttpRequest();
} else { // code for IE6, IE5
    x = new ActiveXObject("Microsoft.XMLHTTP");
}
x.onreadystatechange = function () {
    if (x.readyState == 4 && x.status == 200) {
        document.getElementById("favSelector").innerHTML = x.responseText;
        document.getElementById("favLoadingGroups").style.display = 'none';
    }
};
x.open("POST", "includes/queries/favorites.php", true);
x.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
x.send("id=fg");
}

PHP代码

    // START FAVORITES SLIDER INITIAL LOAD-->


    $favs = mysqli_query($con,"SELECT * FROM favorites WHERE (user='".$email."' AND (favGroup LIKE '".$favGroup."')) GROUP BY partNo");
    // Table header.
    echo '<table><tr>';
    do {
    // Fetch and print all the records:
    $cols = 5;
    for($i=1;$i<=$cols;$i++)
        { 
            $row = mysqli_fetch_array($favs, MYSQLI_ASSOC);
            if($row && $i<=$cols)
                {
                    echo '<td  class="favHover">
                            <div style="float: left; height: 115px; width: 100px; padding-left: 13px; margin-top: 15px;">
                            <a href="../../product.php?id='.$row['partId'].'"><div draggable="true" ondragstart="drag(event)" id="'.$row['partNo'].'">
                                <div style="height: 65px; width: 100px; background-size: cover; background-image:url(../images/product/' . $row['partNo'] . '/' . $row['partNo'] . '.jpg)">
                                </div></a><a href="../../product.php?id='.$row['partId'].'">
                                <div style="font-size: 12px; height: 20px; width: 100px; text-align:center; margin-top:5px;">' . $row['partNo'] . '</div></div></a>
                                <div style="font-size: 12px; height: 25px; width: 100px; text-align:center; margin-top:5px;"><div class="favTasks" style="font-size: 12px; height: 25px; width: 100px;"><a href="/includes/queries/specSheet.php?id='.$row['partId'].'" target="_blank"><i style="margin-left:10px; color:#000;" title="Printable Spec Sheet" class="fa fa-print fa-lg"></i></a><i style="margin-left:40px; color:#C80000;" title="Delete Item" class="fa fa-minus-circle fa-lg"></i></div></div>
                            </div>
                        </td>';
                }
        }
        echo '</tr>';  
        }
        while ($row); echo '</table>'; // Close the table.



    //END FAVORITES SLIDER INITIAL LOAD-->
    }
    //START FAVORITES SLIDER GROUPS

    elseif( $_POST["id"] == "fg"){
    echo"<table width='174' cellspacing='0' cellpadding='0' id='favChoices'>
    <tr id='all' class='selectedRow' >
    <td style=\"height:50px; cursor:pointer; border-bottom:solid 1px #000; line-height:50px; text-align:center; font-family:'Gill Sans', 'Gill Sans MT', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, sans-serif; font-size:18px;\"width='174'><a onclick=\"viewFav('all');\" ><div style='width:174px; height:50px; text-align:center; line-height:50px;'>All</div></a></td>
   </tr>
   <tr id='0' >
    <td style=\"height:50px; cursor:pointer; border-bottom:solid 2px #000; line-height:50px; text-align:center; font-family:'Gill Sans', 'Gill Sans MT', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, sans-serif; font-size:18px;\"width='174'><a onclick=\"viewFav('0');\" ><div style='width:174px; height:50px; text-align:center; line-height:50px;'>Unsorted</div></a></td>
   </tr>";
   $result = mysqli_query($con,"SELECT * FROM favgroups WHERE user='".$email."' ORDER BY groupName ASC");

  while($row = mysqli_fetch_array($result)) {
  echo "<tr id='".$row['id']."' ondrop='drop(event,".$row['id'].")' ondragover='allowDrop(event,".$row['id'].")' ondragleave='dragLeave(event,".$row['id'].")'>
  <td style=\"height:50px; cursor:pointer; border-bottom:solid 1px #000; line-height:50px; text-align:center; font-family:'Gill Sans', 'Gill Sans MT', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, sans-serif; font-size:18px;\"width='174'><a onclick=\"viewFav('".$row['id']."');\" ><div style='width:174px; height:50px; text-align:center; line-height:50px;'>".$row['groupName']."</div></a></td>
  </tr>";
  }  
  echo"</table>";
  }