9

最近、Web サーバーからすぐに表示できる HTML ページを生成するのではなく、クライアント側で完全に生成させて、Web アプリケーションの全体的なパフォーマンスを向上させる方法についていくつかのアイデアを思いつきました。このようにすると、純粋なデータ (私の場合は JSON 形式のデータ) のみをブラウザーに送信する必要があります。これにより、サーバーからクライアントのブラウザーへの html 生成の作業がオフロードされ、ユーザーに返される応答パケットのサイズが縮小されます。

いくつかの調査の後、このフレームワーク (http://beebole-apps.com/pure/) が私のものと同じことを行うことがわかりました。

私が知りたいのは、このようにすることの長所と短所です。ウェブサーバーにとっては確かに高速で優れており、最新のブラウザーでは Javascript コードを高速に実行できるため、ページ生成を高速に実行できます。

この方法のマイナス面は、おそらく SEO の場合です。Google などの検索エンジンが私のウェブサイトを適切にインデックスしてくれるかどうかわかりません。 この方法の欠点を教えてください。

Ps: 次のように、メソッドの説明に役立つサンプル コードも添付しました。

head では、単純な JavaScript コードは次のように記述されます。

<script type='javascript' src='html_generator.js'/>
<script>
   function onPageLoad(){
      htmlGenerate($('#data').val());
   } 
</script>

本体には、次のようにデータ コンテナーとしてのみ使用される要素が 1 つだけ存在します。

  <input type='hidden' id='data' value='{"a": 1, "b": 2, "c": 3}'/>

ブラウザがファイルをレンダリングすると、html_generator.js にある htmlGenerate 関数が呼び出され、この関数で html ページ全体が生成されます。html_generator.js ファイルには多数の html テンプレートが含まれているためサイズが大きくなる可能性がありますが、ブラウザーにキャッシュできるため、一度だけダウンロードされることに注意してください。

4

5 に答える 5

7

欠点

  • 検索エンジンはページをインデックスできません。もしそうなら、あなたはとてもラッキーです。
  • JavaScript が無効になっているユーザー、またはモバイル デバイスを使用しているユーザーは、JavaScript を使用できない可能性が非常に高くなります。
  • 特にユーザーが IE のような低速の JavaScript エンジンを使用している場合は、速度の利点が最小限になる可能性があります。
  • 保守性: JavaScript の生成を自動化しない限り、悪夢になるでしょう!

概して

速度を上げるためだけに行う場合、この方法はお勧めしません。ただし、多くの場合、ユーザーが同じページにとどまる Web アプリケーションで行われますが、これにはbackbone.jsなどの既存のフレームワークのいずれかを使用した方がよいでしょう。hashbang ガイドラインまたはHTML5 PushState (@rohk の提案による)。

求めているのがパフォーマンスだけで、アプリが厳密にこのように動作する必要がない場合は、実行しないでください。ただし、この方法を使用する場合は、標準化された方法で実行して、高速でインデックス可能な状態を維持してください。

于 2011-12-21T08:11:50.127 に答える
3

クライアント側のテンプレートは、シングルページアプリケーションでよく使用されます。

あなたは賛否両論を重み付けする必要があります：

長所：

  • より応答性の高いインターフェース
  • Webサーバーの負荷が軽減されました

短所：

  • SEOは、従来のWebサイトよりも難しくなります（HTML5 PushStateを使用しない限り）
  • アクセシビリティ：JavaScriptに大きく依存しています...

このようにする場合は、Backbone.jsを確認することをお勧めします。チュートリアルと例はここにあります：http ：//www.quora.com/What-are-some-good-resources-for-Backbone-js

SPAの例：

この回答も見てください：https ：//stackoverflow.com/a/8372246/467003

于 2011-12-21T08:09:08.453 に答える
1

うわぁ。

jQueryテンプレートはあなたが考えているものに近いです。Sanityは、自由に簡単に変更できるHTMLテンプレートが必要だと言っています。あなたは、最悪の悪夢を投げたり回したりし続ける連結をひもでつなぐのではなく、保守性を望んでいます。

あなたはこの狂気を続けることができますが、あなたは難しい方法を学ぶことになります。私は最初にjQueryテンプレートと純粋なコード方法を使用していくつかのプロトタイプを試すためにあなたを雇います。正気はきっとあなたに私の友人を打ち負かすでしょう、そして私はあなたの道をしばらくの間試みることから来ると言います。:)

AJAXを使用して、必要なテンプレートのコンテンツを動的にロードすることも可能です。考えられるすべてのテンプレートを1回のリクエストでダウンロードする必要がある万能薬アプローチを採用することは意味がありません。

于 2011-12-21T08:05:11.707 に答える
0

プロ？本当に何も思いつかない。あなたはそれがウェブサーバーでより簡単になると言います、しかしHTMLを提供することはウェブサーバーがするように設計されていることです。

短所？Webサイトの構築に関しては、ほぼすべてのベストプラクティスに反します。

  • 仮にあったとしても、検索エンジンはあなたのサイトをうまく索引付けすることができません
  • 保守性の低下
  • JSエンジンがどれほど高速であっても、DOMは低速であり、サーバー上でHTMLを構築するほど高速になることはありません。
  • 1つのJSエラーが発生し、サイト全体がレンダリングされません。おっと。ただし、ブラウザはHTMLエラーに対して非常に耐性があります。

最終的に、HTMLはコンテンツを表示するための優れたツールです。JavaScriptは、インタラクションを追加するための優れた方法です。あなたが提案するようにそれらを混ぜ合わせるのはただのくだらないことであり、問​​題を引き起こすだけです。

于 2011-12-21T08:09:24.917 に答える
0

短所

  1. SEO
  2. JavaScript を使用しないユーザーを除外する

長所

  1. ワークフローの高速化 / Fluider インターフェース
  2. 小負荷軽減

SEO が重要ではなく、ほとんどのユーザーが Javascript を使用している場合は、シングル ページ アプリケーションを作成できます。負荷が大幅に軽減されるわけではありませんが、ページ上でより高速なワークフローを作成できます。

ところで: すべてのテンプレートを 1 つのファイルにまとめるつもりはありません。大きなプロジェクトには大きすぎるでしょう。

于 2011-12-21T08:39:43.063 に答える