バックグラウンド
2年ちょっと前から（Batman.jsとnode.jsを使用して）、サーバーとクライアントで同じDOMコードを実行する実験を開始しました。これはpushState、SEOおよび優れたユーザーエクスペリエンスのためにページが既にレンダリングされているルートを使用してレンダリングおよびアクセスできるSPA（単一ページアプリケーション）を備えていることが望まれます（ページのロード後にSPAレンダリング要素に関連付けられたページ「フラッシュ」はありません） ）。これには通常if、モジュールがrequire.jsで実行されているwindowか、require.jsを使用して必要であるか、またはnode.jsなどのモジュールとして実行されているかどうかをチェックするステートメントでモジュールをラップすることが含まれます。
クライアント+サーバーSPAの現在の実装
RendrとEzelはどちらも、クライアントとサーバーのコード共有とDOMレンダリング機能をバックボーンSPAに導入しようとしています。EzelにはBackboneモデル/コレクションに魔法がありますが、ビューはサーバーでExpress + Jadeを使用してレンダリングされ、クライアントでBackbone.View + Jadeを使用してレンダリングされます。つまり、拡張されたBackbone.ViewでRivetsのようなものを使用しても、HTMLがRivetsによって事前にレンダリングされたクライアントにヒットすることはありません。。DOMサーバー側を自分でレンダリングするためのいくつかのベストプラクティスとテクニックを構築して、物事を単純に（ビューコードを1か所で編集）柔軟に（Ezelが現在サポートしていないDOM操作モジュールを追加できるように）したいと思います。 ）。
望ましい結果
リベットのようなものを使用して、HTTPリクエストを介してページ全体をロードするためにルートがヒットしたときに、Expressからブラウザにページが提供される前にモデルデータをビューに挿入し、変更に応答するようにバインドしたいと思います。pushStateクライアントで。リベットを使用してサーバー上のHTMLを変更してから提供し、クライアントにバインドしたままにするためのノードの環境要件は何ですか？jQuery、Backbone、Rivetsなどをnode.jsに取り込み、HTMLテンプレートのDOMで実行してから、事前にレンダリングされた結果を提供するにはどうすればよいですか（その後、クライアントで通常のJS動作を維持します）。
関連モジュール
SharifyとBrowserifyはどちらも、サイド間でコードを共有するのに役立つツールです。リベットは、バックボーン＆jQueryのすべてのNode.js互換のディストリビューションを持っています。
現在の仕事
Githubのフォークを介してEzelに機能を追加する作業を開始しました。
jsdomを使用してEzelの上に構築することで、ほぼ純粋な同形のJavaScriptアプリケーションを実現することができました。jsdomはパフォーマンスに影響を与えるため、可能な場合はサーバーでリベットを実行した結果をキャッシュしました。
https://github.com/adjohnson916/rivets-serverからいくつかの手がかりを得ました。リベットに送信する必要のあるいくつかの構成オプションを踏みにじるため、そのモジュールを卸売りで使用できませんでした（リベットサーバーはリベットのフォークを使用します）。
私が最初に遭遇した落とし穴の1つは、SharifyとRivetsを同時に使用することに関連していました。Sharifyは、関数を含み、テンプレートに{}を使用しているため、リベットをトリップしたスクリプトをWebページに挿入します。templateDelimiters二重中括弧に変更することで、この問題を回避しました。
同形JavaScriptアプリケーションの主なコンポーネントは次のとおりです。
require（例：Browserify）この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加