Question

目前我的网站上没有任何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

首先为什么要创建一个数组来保存文本（一个字符串），完全不值得。

无论如何，你最好使用json作为传输方法，并使用js作为创建添加的html的方法。使用PHP构建HTML只会带来更大的数据包传输。

使用JS的某种模板引擎最适合这种情况，例如Handlebars，Angular或您喜欢的任何内容。当然，如果你只有一个AJAX调用一个布局，那么构建vanilla JS文档片段并插入它们会更好。

您确实不应该将完整的SQL输出发送到要处理的客户端，而只发送实际需要的内容。即不需要行ID，不需要创建时间，不需要上次编辑等等

最后，您需要在JSON上使用某种成功/失败字段，以便您可以根据需要进行处理。示例

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

因此，如果SQL查询没有回复数据，您可以处理它。

Answer 2

我们在这里有三个表演：服务器端，网络和客户端。

如果您在服务器端生成HTML并将其发送到浏览器，那么您的服务器必须生成该输出，浏览器需要将其作为输入提取并将其写入DOM。这种方法使服务器端和网络部分变慢，但客户端会很快。如果您只将数据作为响应发送到客户端，那么服务器将没有多少工作要做，网络将不得不传输更小的消息，但客户端将不得不计算所有细节。在这种情况下，您的服务器端和邮件传输将更快，但您的客户端将更慢。仅发送数据将带来更好的整体性能。

但是，我认为性能不是主要问题，除非你有很大的结果。更重要的是确保使用相同的代码进行初始加载和POST响应，以提高可维护性。

通过PHP和JS创建DOM

2 个答案: