合併ajax要求

Ajax要求を最小化する
Ajax要求は伝統的なウェブアプリケーションの様子を徹底的に変えました.JavaScript開発者が高度な動的化、対話性が強く、応答が速いアプリケーションを作成することができます.デスクトップアプリケーションで体験したように.その結果、現代のwebアプリケーションでは、Ajax要求が随所に見られます.この点はユーザーがページローディングを見られないにもかかわらず、Ajax要求は完全なHTTP要求であり、通常のページローディングと同じである.したがって、使用されるAjax要求の数を減らすために、多くの関心を持つべきである.
この方面の一例は検索結果のページ分けです.アプリケーションでは、JSON配列で検索結果を返すようにAjax要求をして、もう一つの要求でデータベースの結果バーの数を返して、改ページ論理に使います.リスト1 和 リスト2 この二つの要求の基本的な例(Prottypeフレームを使用)が表示されます.
リスト1.最初の要求:テーブルレコードの取得
 

				
var url = "get_data.php";
var options = {
	method: "post",
	parameters: {"page":1,"rows":5},
	onSuccess: firstCallbackFunction,
	onFailure: firstCallbackFunction
}
new Ajax.Request(url, options);

リスト2 表示されるのは、2番目の総記録数の取得要求である.
リスト2.2番目の要求:総記録数の取得
 

				
var url = "get_count.php";
var options = {
	method: "post",
	parameters: {},
	onSuccess: secondCallbackFunction,
	onFailure: secondCallbackFunction
}
new Ajax.Request(url, options);

リスト3 和 リスト4 対応するJSON形式のHTTP要求を表示します.
リスト3.最初の応答:記録配列
 

				
{
	"records": [
		{"id":1,"name":"John","email":"[email protected]"},
		{"id":2,"name":"Mary","email":"[email protected]"},
		{"id":3,"name":"Tony","email":"[email protected]"},
		{"id":4,"name":"Emma","email":"[email protected]"},
		{"id":5,"name":"Alan","email":"[email protected]"}
	]
}

リスト4 総記録数を報告する応答を表示します.
リスト4.第二応答:総記録数
 

				
{"total_records": 95}

これらの2つのAjax要求を分離すると、リソースが浪費され、それらは一つの要求に統合され、以下のように生成される. リスト5 の応答です
リスト5.高効率応答:記録総数と配列
 

				
{
    "total_records": 95,
    "records": [
		{"id":1,"name":"John","email":"[email protected]"},
		{"id":2,"name":"Mary","email":"[email protected]"},
		{"id":3,"name":"Tony","email":"[email protected]"},
		{"id":4,"name":"Emma","email":"[email protected]"},
		{"id":5,"name":"Alan","email":"[email protected]"}
	       ]
}

このようにして、必要なHTTP要求と応答をより少なくするだけでなく、Ajax要求に応答するためのサーバ端末スクリプトも低減される.
この例のデモは非常に簡単です.アプリケーションが複雑になるほど、使用するAjax要求数を減らすことが重要です.