由PHP VS JS

Question

創建DOM目前我沒有在我的網站任何Ajax請求，這裏是一個簡化了的我的代碼：

class all_posts { 

    public function index($id){ 

     $statement = $db->prepare("SELECT * FROM mytable WHERE id = :id"); 
     $statement->execute(array(':id' => $id)); 
     $results = $statement->fetchAll(PDO::FETCH_ASSOC); 

     $arr = []; 
     $arr['html'] = '<ul>'; 

     // creating HTML 
     foreach($results as $result) { 
      $arr['html'] .= "<li class='clsname'>".$result['title']."</li> 
          <li style='color:gray;'>".$result['content']."</li>"; 
     } 

     $arr['html'] .= '</ul>'; 

     return $arr; 

    } 

} 

好無一不精。現在有時我想通過ajax請求獲得結果。那麼我的問題是什麼？

我想知道，我是否應該沿着HTML返回結果，還是應該返回純查詢結果，然後通過JS創建HTML？換句話說哪一個有更好的表現？

＃1：

. 
. 
$arr['html'] .= '</ul>'; 

if(!empty($_SERVER["HTTP_X_REQUESTED_WITH"]) && 
    strtolower($_SERVER["HTTP_X_REQUESTED_WITH"]) === "xmlhttprequest") { 

    header('Content-Type: application/json'); 
    echo json_encode($arr); 
    exit(); 
} 

return $arr; 
. 
. 

＃2：

. 
. 
$results = $statement->fetchAll(PDO::FETCH_ASSOC); 

if(!empty($_SERVER["HTTP_X_REQUESTED_WITH"]) && 
    strtolower($_SERVER["HTTP_X_REQUESTED_WITH"]) === "xmlhttprequest") { 

    header('Content-Type: application/json'); 
    echo json_encode($results); 
    exit(); 
} 
. 
. 

我個人喜歡去＃1，因爲在這種情況下，我做了HTML曾經和我可以稍後改變它。但是我擔心表演會不會很慢？

Answer 1

我們在這裏有三個表現：服務器端，網絡端和客戶端。

如果您在服務器端生成HTML並將其發送到瀏覽器，那麼您的服務器將不得不生成該輸出，瀏覽器需要將其解壓縮爲輸入並將其寫入DOM。這種方法使服務器端和網絡部分變慢，但客戶端將會很快。如果您僅將數據作爲響應發送到客戶端，那麼服務器的工作量會減少，網絡將不得不傳輸更小的消息，但客戶端將必須處理所有細節。在這種情況下，您的服務器端和消息傳輸將會更快，但您的客戶端會更慢。僅發送數據將導致更好的整體性能。

但是，我認爲表現不是這裏的主要問題，除非您有非常大的結果塊。確保對初始加載和POST響應使用相同的代碼以提高可維護性更重要。

Answer 2

首先爲什麼要創建一個數組來保存文本（一個字符串），完全不值得。

無論如何，您最好使用json作爲傳輸方法，並使用js作爲創建添加的html的方式。使用PHP構建HTML只會帶來更大的數據包傳輸。

使用JS的某種模板引擎最適合這種應用，例如Handlebars，Angular或任何你喜歡的東西。當然，如果你只有一個佈局的AJAX調用，那麼構建vanilla JS文檔片段並插入它們會更好。

你真的不應該把完整的SQL輸出發送給客戶端來處理，只有實際需要的內容。即不需要行ID，不需要創建時間，不需要最後編輯等。

最後，您需要某種成功/失敗字段在您的JSON，以便您可以根據需要處理它。示例

$output = array('status'=> 'success', 'data' => $content); 
json_encode($output); 

因此，如果沒有數據由SQL查詢回答，您可以處理該問題。