web-dev-qa-db-ja.com

クライアント側とサーバー側のテンプレート（どちらですか？）

私は最近、クライアントとサーバー全体のレンダリングに関する非常に興味深い記事をいくつか読んでいます。

http://www.onebigfluke.com/2015/01/experimentally-verified-why-client-side.html

http://www.quirksmode.org/blog/archives/2015/01/angular_and_tem.html

http://tomdale.net/2015/02/youre-missing-the-point-of-server-side-rendered-javascript-apps/

今では、クライアントサイドに関しては少しファンボーイになっていますが、これらの記事を読んだ後、サーバーサイドレンダリングを支持するいくつかのポイントが現れ始めました。主なポイントは次のとおりです。

  • 1）サーバーをアップグレードできますが、ユーザーのデバイスはアップグレードできません-つまり、そうです... yoは、サーバー。したがって、パフォーマンスが低下している場合は、アップグレード/スケールを選択できます。ユーザーにデバイスのアップグレードを強制することはできません。

  • 2）最初のペイントと最後のペイント-experimentally verified...上のリンクは、ユーザーが最初にページを見るとき（最初のペイント）と、ユーザーがページを100％使用するとき（最後のペイント）を示しています。ユーザーがページを見たときに考えることができることから、視覚皮質から前頭皮質、そしてユーザーが実際に指をクリックし始める前野への信号を処理するのに彼らの脳は時間がかかりますもちろん、htmlが最初にレンダリングされ、バックグラウンドで読み込みが行われている間に脳が処理するものがある場合です（jsファイル、バインディングなど）。

実際に私が得たのは、クライアント側のレンダリングに最大10秒のロード時間があるというTwitterの報告があったことです誰も経験するべきではない！ 「十分なデバイスがない場合は、申し訳ありませんが、しばらくお待ちください。」と言ってください。

私は考えていましたが、bothクライアント側とサーバー側のテンプレートエンジンを使用する良い方法はありませんか？clientとserverは同じテンプレートエンジンとcodeを使用します。その場合、レンダリングされたページをクライアントに提供するか、クライアントが自分でレンダリングできるようにするのが有益なのかを判断するだけです。

いずれにせよ、もし望むなら私のことわざや記事についてのあなたの考えを共有してください。ぜひ聞きたいです！

javascripthtmlserver-sidetemplate-engineclient-side-templating
31
Karl Morrison

基本的に、フロントエンドとバックエンドで同じコードを共有する isomorphic web app を探しています。

同形JavaScript

クライアント側とサーバー側の両方を実行するJavaScriptアプリケーション。同形JavaScriptフレームワークは、JavaScriptフレームワークの進化における次のステップです。これらの新しいライブラリとフレームワークは、従来のJavaScriptフレームワークに関連する問題を解決しています。

私は この人がずっとよく説明している 私だと思う。

enter image description here

そのため、ユーザーがページにアクセスすると、サーバーはコンテンツを含むページ全体をレンダリングします。そのため、ロードが高速になり、データなどをロードするための追加のajaxリクエストが不要になります。その後、ユーザーが別のページに移動すると、シングルページアプリケーションの通常の手法が使用されます。

だから、なぜ私は気にするのですか？

  • 古いブラウザ/脆弱なデバイス/無効なJavaScript
  • SEO
  • いくつかのページ読み込みの改善

古いブラウザ/脆弱なデバイス/無効なJavaScript

たとえば、IE9はHistory APIをサポートしていません。そのため、古いブラウザー（およびユーザーがjavascriptも無効にした場合）では、古き良き時代にやったようにページをナビゲートするだけです。

SEO

Googleは SPAをサポートしています と言いますが、SPAはGoogle検索の上位の結果に表示される可能性は低いですか？

ページ速度

述べられているように、最初のページは1つのHTTPリクエストでロードされます。

OK

それに関する記事がたくさんあります：

しかし、私は注意すべきですか？

もちろん、あなた次第です。

ええ、それは素晴らしいことですが、既存のアプリを書き直し、適応させるには多くの作業が必要です。バックエンドがPHP/Ruby/Python/Java/Whateverにある場合、悪いニュースがあります（必ずしも不可能ではありませんが、それに近いです）。

それはウェブサイトに依存します、あなたはいくつかの統計を収集しようとすることができます、そして、古いデバイスを持っているユーザーの割合が小さいならば、それはトラブルの価値がありません。

それらを苦しめる

古いデバイスを使用しているユーザーのみを気にする場合は、2015年になります。iPodTouch 2でWebサイトを閲覧するIE8を使用している場合、ユーザーの問題です。たとえば、Angular dropおよそ1年前の1.3ではIE8がサポートされているので、アップグレードする必要があることをユーザーに警告しないのはなぜですか。

乾杯！

18
Alexander Mikhalchenko