0

私はRails 3でWebアプリケーションを作成しています。私はJavascriptフレームワークとしてJQueryを使用しています。私はまだアプリケーションの中にたくさんのJavaScriptを持っていませんが、ページ間にトランジションを追加し始めています。トランジションを整理するために[function] .js.erbファイルを使う良い方法があるのだろうかと思います。たとえば、新しい編集機能を備えた招待状コントローラがあります。ドキュメントの準備ができたら、ビュー/招待状/ new.js.erbとviews/invitations/edit.js.erbを使って関数を実行する方法はありますか?今はAJAX呼び出しの後にページ操作を処理するためにこれらを使用しています。どのようにRails 3でjavascriptファイルを整理しますか?

ありがとうございます!

答えて

1

私は無礼に同意します..個人的には、js.erbコールは認知的オーバーヘッドの多くを追加します。私は何をしてそれから私はminifiy、と私を圧縮するJammit宝石からjammitコマンドを使用し

*アプリ/ビュー/レイアウト/ _javascripts.html.haml

= javascript_include_tag "https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" 
= javascript_include_tag 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js' 
= javascript_include_tag "http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js" 
= include_javascripts :app 
= hoptoad_javascript_notifier 
= yield :javascripts 

部分レイアウトに私javvavscriptsをロードしていますJSとCSSの資産

のconfig/assets.yml

javascripts: 
    app: 
    - public/javascripts/rail.js 
    - public/javascripts/underscore-min.js 
    - public/javascripts/jquery.dump.js 
    - public/javascrippts/etc*.js 

ザ・EACについてカスタムページレベルのJSを必要な時間ページは、私がページの下部にあるにcontent_for :javascriptsブロックを投げる:

アプリ/ビュー/何か/ awesome.html.haml

%h1 cool page 
Other cool stuff 

- content_for :javascripts do 
    :javascript 
    $(document).ready(function(){ 
     console.log('This document is REaDY!! and, this page rocks'); 
     $.ajax({ 
     url: "#{new_item_path(@item)}", //ruby is evaluated due to string interpolation 
     success: function(data) { 
      console.log('Loaded ' + data + ' from ' + #{new_item_path(@item)}) 
     } 
     }); 
    }; 

そして、これは私をすることができます私のapplication.html.hamlレイアウトの一番下にあるrender 'layouts/javascripts'まで、私のjavascript geetsはすべてページの最下部にパイプされているので、ページの読み込み速度をsuggested here by Yahooにすることもできます。これにより、erbを使ってRailsからページレベルのjsの変数を生成することもできます必要ならば

+0

ありがとうございました。私はこれを生産に押し込むときにジャミットをチェックする必要があります。あなたの例 'awesome.html.haml'では、あなたのhtmlにjavascript呼び出しを入れています。これは良い練習ですか?私は "レールの道"は、物事をきれいにするために、あなたのJavaScriptのすべてを別々のファイルに入れることだと思った。しかし、あなたが 'content_for'タグを使ってRubyからjavascriptに変数を渡すことができれば、私は売却されます。実際、ルビからjavascriptに変数を渡すと、別々のファイルが必要な多くのケースが排除されます。あなたは、ルビからjsに変数を渡す例を挙げることができますか?ありがとう! – spinlock

+0

さて、私はそれをこのように考えています。「レールの道」はしばしば説得力があります。唯一のベストプラクティスは思考です。私のアプリケーションでは、コードの隣にjsがあると、いくつかの点で私を助けます:1)自分のデータに基づいてJSが異なる場合は、Ruby変数を使用してレンダリングすることができます。それのために。 2)どのDOM要素がjsハンドラに接続されているのか疑問に思うことがよくあります。関連するjsコードが私の目の前にあれば、私たちのチームにとって混乱は生じません(私はコードを書く、他の誰かが来て修正する、すべて明示的にする)。私は私の – noli

+0

を変更しています3)キャッシュ可能な静的JSのためには、間違いなく別のページに入れて、キャッシュを圧縮し、圧縮してください。ページに応じて変わる可能性のあるもの(たとえば、名前付きルートに送信するためにajaxを使用する場合)は、$ .ajax( '/ search'、..というより、routeという名前のレールを使用する良いケースです。 )結果として、ページサイズはわずかに増加しますが、そのページの負荷に対するHTTPリクエストの数も減少します。したがって、動的で短いjsスニペットの場合、その優れた妥協案 – noli

1

js.erbファイルは、以前使用していたajaxまたはjsコール用のものです。

私はこれをお勧めしません。これはクライアント側のIMHOのままにしておく必要があります。それは3.1(まだ宝石として保管されている)の中で離れて移動されます。

ビューにロードするファイルにjsを入れてください。基本&ニート。

関連する問題