1

私は現在、サーバー側でデータを「レンダリング」(html を生成) する方法と、クライアント側で ajax リクエストを介してデータをレンダリングする方法を決定するための優れたソリューションを見つけるのに苦労しています。

これが問題の例です。

私のクライアント コードには、すべてのページに検索バーがあり、ユーザーが [送信] をクリックする前に検索結果のプレビューを表示する必要があります。このルートは/ajax/search?query=....

ユーザーが送信を押すと、クライアントはリクエストをルートに送信し/results、結果ページが返されます。

私が考えることができる2つのオプションがあり、どちらにも長所と短所があるようです.

以下の呼び出し (Node.js で実行) のように、サーバー上で Jade (またはその他のテンプレート エンジン) を使用して、結果のすべての html コードをレンダリングできます。

app.get('/results', function(request, response) {
   var results = getResultsFrom(request);
   response.render('resultsPage', results);
});

または、次のような空白の HTML ページを送り返すこともできます。

HTML

<div class="search_results"></div>
<script id="search_result_template" type="text/handlebars-template">
   <!-- Client side template code -->
</script>

Javascript

    // Type should be of the form '/ajax/search?=...'
    results.url = "/ajax/search"+ $(location).attr('search')
    results.fetch();
    // Render the html generate inside the .search_results div
    resultsView.render();

クライアントでのレンダリングにより、コードの冗長性が少なくなり (私の Jade テンプレートは、Handlebars テンプレートで既に実行できることを実行していません)、DOM の外部のデータにアクセスできます (バックボーンを介してモデルに存在します)。

サーバー上でレンダリングすると、サーバーへの呼び出しが 1 回少なくなり、ユーザーは結果を表示するために、元のページが読み込まれるのと、2 番目の ajax リクエストが完了するのを待つ必要がありません。

潜在的な解決策に関する提案は大歓迎です。

4

0 に答える 0