2012-05-22 32 views
0

正如標題所描述的,jquery顯示數據的速度比純php慢1到2秒。演示在http://plekz.com/test-slow3.php。如何使jQuery顯示數據與純php一樣快?jquery抓取php數據很慢。如何使它快速?

代碼:

<div id="jqryd"> 
</div> 

<script src="javascripts/jquery-1.5.js" type="text/javascript" language="javascript"></script> 
<script type="text/javascript"> 
    var jqryd = $('#jqryd'); 
    jQuery.get("sale-show-month2.php", function(data) { 
     jqryd.html(data); 
    }); 
</script> 


<?php 
    $sql = "SELECT payment_date, SUM(price) FROM sale WHERE seller_id=? && Year(payment_date)=? GROUP BY Month(payment_date) DESC"; //this is loged-in user. 
    $q = $conn->prepare($sql); 
    $result = $q->execute(array($user_id, $selected_year)); 
    if(!$result){ 
     die("Error Select user table query : ". implode(" : ", $q->errorInfo())); //if don't use implode, output of errorInfo() will be "Array". 
    } 
    while($r = $q->fetch(PDO::FETCH_ASSOC)){ 
     $price_db2 = $r['SUM(price)']; 
     $payment_date_db = $r['payment_date']; 
     $payment_month_db = date("F", strtotime($payment_date_db)); 
     $payment_month_db2 = date("m", strtotime($payment_date_db)); 
     echo "This is pure php : " . $payment_month_db . " - " . $money_currency . $price_db2 ."<br>"; 
    } 
?> 
+0

數據有多大(即多少數據從您的服務器傳回)? (您可以使用Firebug或任何其他調試器進行檢查) – ManseUK

+0

解決方案取決於數據量有多大?讓說50kb到500kb數據,會有什麼解決方案? – zac1987

回答

1

分析您網站的流量示例,我發現,除了結果之外,在您的sale-show-month2.php頁面中,您甚至會返回jquery javascript。這會減慢整個頁面的速度:出於某種原因,網絡跟蹤器在調用中看到一個查詢字符串,例如http://plekz.com/javascripts/jquery-1.5.js?_=1337691808625,這不允許使用緩存。

簡單地避免返回鏈接到jquery會提高性能。

即使在此之後,您會看到jquery加載的數據稍後會出現,但這是由於get方法在加載第一頁時調用了方法。你可以用螢火蟲或其他工具非常清楚地看到它(鉻和IE有自己的)。

+0

good 1.我刪除了sale-show-moth2.php上的jquery-1.5鏈接,我可以看到速度變得非常快,但它仍然比php慢。非常感謝你。 – zac1987

+0

你是否介意如何避免返回鏈接,如果我想在sale-show-month2.php頁面上添加鏈接? – zac1987

+0

好吧,我不知道PHP,但我想它有某種部分頁面機制。這個想法是創建一個部分頁面,用於創建數據的純HTML:這個頁面可以通過ajax調用,就像在你的例子中一樣,或者包含在一個合適的頁面中,幷包含你需要的所有JavaScript文件的鏈接。 – themarcuz

0

至於數據的服務器和客戶端我會永遠只是轉移所需的最小數據之間的轉移量(可能使用純文本/ XML或JSON取決於數據)和使用最有效的方法將其追加到DOM

無論數據是如何使用大最好的(在你的情況下,最快)的方法追加到DOM .. check out this jsperf for an indicator which method is fastest

你會看到,使用inbui LD DOM創建方法總是更快,例如

var li = document.createElement('li'); 
li.innerHTML = i; 
li.setAttribute('title', 'Element number ' + i); 
li.setAttribute('class', 'list-item'); 
container.appendChild(li); 

所以你的情況我會通過數據作爲JSON,然後循環節點,並根據需要追加。如果返回的數據很多,那麼我會對數據進行分頁 - 或者顯示一些初始數據,然後添加一個「顯示更多」功能,以檢索要顯示的下一部分數據。

關於後端 - 我會確保我的查詢得到了優化,並使用了正確的索引。

0

你的問題沒有意義。使用螢火蟲或鍍鉻物檢查網絡傳輸 - 您會看到您花費大約同時等待兩種情況下的數據。但是,收到php'generated數據後,頁面會花費很長時間來下載jquery - 只有這樣才能請求新的數據。

唯一值得注意的是,用jquery連接到你的服務器需要半秒鐘的時間 - 如果連接不好,這個滯後將一直存在。有了服務器端生成的數據,你會得到它一次,用Ajax你會得到它兩次。

因此,在您的場景中,您無法加快抓取速度 - 除非您將服務器切換到具有適當吞吐量和正確響應時間的服務器。

+0

「使用服務器端生成的數據,你會得到它一次,用Ajax你會得到它兩次」。什麼是「它」指的是什麼?你的意思是ajax會比jquery滯後2倍嗎? – zac1987

+0

* it *是用戶支付連接到服務器的開銷。您在第一次連接並下載html時付費 - 如果之後必須執行ajax獲取以從服務器接收數據,則需要再次付款。 – Fake51

0

雖然有一些方法來優化結果,回答你的問題

如何讓jQuery的顯示數據一樣快純PHP?

是:這是不可能的。

您的Javascript將無法將任何內容加載到DOM中,直到它被解析並準備就緒。這意味着「純PHP」數據已經被加載,因爲它是作爲主頁的一部分由服務器提供的。

只有當瀏覽器必須對服務器做另一個請求時,再往返一次,才能獲得AJAX版本。所以:不管你的服務器和你的JS有多好,AJAX版本永遠不會像服務器端版本那麼快。

注意:這僅適用於兩種版本競爭的設置。當然,通過不使用PHP和數據庫請求來加速HTML頁面的初始交付是有意義的,然後使用AJAX加載一些內容。

相關問題