5

ニュースセクションがあるレスポンシブウェブサイトを構築しています。訪問者の画面サイズに応じて、このセクションには2、3、または4つのニュース項目があります。今のところ、cms(modx)は常に4つのニュースアイテムを提供します。ユーザーが小さなビューポートを持っている必要がある場合は、メディアクエリで余分なニュースアイテムを非表示にします。

これはあまり効率的ではないようです(画面が小さい人のために余分な帯域幅を使用します)。また、上記のアプローチを使用すると、「新しい投稿」、「古い投稿」タイプのナビゲーションで問題が発生します(「古い投稿」をクリックすると、常に4つの古い投稿が読み込まれますが、2つまたは3つしか必要ない場合もあります)。

これを行うためのより良い、信頼できる方法はありますか?ニュースアイテムの配信をより応答性の高いものにすることは可能ですか?言い換えれば、画面サイズに基づいて、不要なコンテンツがダウンロードされないようにするにはどうすればよいですか?

4

1 に答える 1

3

1 つの方法は、現在行っていることとは逆のルートをたどることです: 1 つのニュース項目のみでページを生成し、必要に応じてさらに追加します (4 で生成してから非表示にするのではなく)。

ユーザーのビューポートが JS を使用してより多くのストーリーを許可しているかどうかを検出し、ajax を使用してそれらを取得できます (その間におそらく「さらに読み込み中..」アニメーションが表示されます)。

この方法では、モバイル ユーザーが帯域幅を使い果たすことはなく、非 JS ユーザーにとっても 1 つのニュース ストーリーに低下します (さらに、非 JS ユーザーに大きなビューポートを提供し、「クリックして詳細を表示」リンクを表示することもできます)。

于 2013-03-19T09:40:30.477 に答える