2009-04-25 13 views
1

私はGoogle Readerを使用していましたが、それぞれの投稿の内容を遅くロードするような同様の手法を実装したいと考えています。サブスクリプションの1つをクリックすると、スニペットなどの情報を含む一連のポストが表示されます。投稿をクリックすると、拡大されて全身が表示されます。私は彼らが単に要素の可視性をトグルしていると思ったが、彼らはその場でDOMに挿入されているようだ。ページが読み込まれた後にHTMLを見ることでこれを証明できます。展開されたコンテンツは表示されません。本文に画像が含まれている場合は、展開時にのみ読み込まれます。これにより、最初のリクエストの読み込み時間が大幅に改善されます。Googleリーダーでのアイテムの動的読み込み

私が起こっていただきました!の2つのアイデアている:彼らは

  1. AJAX要求を行うと、応答を挿入し、これとして任意の画像をロードし、レンダリングしたときに必要としています。
  2. JavaScriptで何か面白いことをしていますが、私は正確に何がわかりません。

私の最初の試みは、折りたたまれたコンテンツをレンダリングし、それを不可視にするためにCSSを使用:

display: none

私は、jQueryを使ってvisibiliyを切り替える:

$("itemDetail").toggle()

問題のみをこれは、目に見えないコンテンツの中の画像が、最初の要求の間にロードされるということです。他の悪影響を及ぼす可能性があります。

alt text http://img6.imageshack.us/img6/4215/croppercapture2.jpg

任意のアイデア:ここ

alt text http://img6.imageshack.us/img6/4503/croppercapture1.jpg

拡大ポストとリストビューである:ここで

は、リストビュー(すべての崩壊)がありますか?これ をロードすると、任意の画像をレンダリングし、 必要なときに、応答を挿入

+0

あなたの質問の一部が失われたと思います。 SOのマークダウンパーサーはちょっとバギーです。 – Calvin

答えて

1
彼らはAJAXリクエストをやっている

と 。

さて、はい、そうです。

正確にはどういうことですか?あなたが可視性でやっていることは、まったく違っていて、あなた自身が言うように、それほど効率的ではありません。

したがって、正しいポイントのページにmake that request with JQueryput the HTML you get from the requestの方法を学ぶ必要があります。

+0

Firebugを使用しているサーバーに要求が出されていないため、彼らがAJAXコールを行っているとは思わなかったのですか?あなたは反対ですが、どうやって知っていますか? もう少し考えてみました。JavaScriptで各アイテムの隠しHTMLを保存し、折りたたまれた行をクリックするとレンダリングされる可能性があることに気付きました。これは、コンテンツの読み込み速度(非常に高速)を説明します。 –

+1

さて、私は今、Googleリーダーを見ています。アイテムは「リスト」形式で表示され、「展開」されていないので、タイトルだけが表示されます。投稿の内容を見るためにタイトルをクリックすると、FireBugは1つのHTTP POSTリクエストを表示します。だから私はあなたが何を見ているのか分からないが、私の理論はまだ成立している。 – AmbroseChapel

0

折りたたまれたアイテムをクリックして拡大すると、AJAXリクエストがGoogleのサーバーに送信されているとは思われません。 Firebugを使ってNetタブを使ってリクエストをトレースしました。私はこの特定のアイテムに対して2つのリクエストしか見ることができません。両方とも、それをホストするサーバー(この場合はweblogs.asp.net)にあります - 最初のものは何を確認していませんが、2番目のものは投稿内に埋め込まれています。私は、私はこの質問をarguementに変身したくない alt text http://img207.imageshack.us/img207/6128/croppercapture13.jpg

前: alt text http://img207.imageshack.us/img207/8461/croppercapture12.jpg

後ここでは、2つのスクリーンショットは、AJAX要求を示す、前と後に、あります別の説明があることを示唆している証拠を述べているだけです。

+1

あなたは間違ったタブを見ています。 AJAXリクエストは[Console]タブに記録されます。 –

+0

スクールボーイエラーです。しかし、同じ点がそのタブに当てはまります。 LHSナビゲーションからサブスクリプションをクリックすると、両方にJSONが含まれている2つのAJAXリクエストが作成されます。アイテムが展開されると、それ以上のリクエストは行われません! Googleがどのようにそれを行うのかに関係なく、最初のページサイズを減らすため、各アイテムが展開されるたびにAJAXリクエストを行います。それはあなたが彼らがそれをやった方法を知りたがっているそれらの事の一つです。 –

+0

JSONリクエストを見ると、ページがロードされた瞬間にすべてのデータが送信されることがわかります。リクエストには、ページに表示されるすべてのアイテム(タイトル/コンテンツ/ etc)が含まれます。このデータは、後でトピックを展開するときに使用されます。 –

関連する問題