Railsアプリのアセットプリコンパイルを高速化するコツ(翻訳)

概要

原著者の許諾を得て翻訳・公開いたします。

Railsアプリのアセットプリコンパイルを高速化するコツ(翻訳)

Rails開発者なら誰でも、アセットの読み込みに非常に時間がかかることを痛感しています。アセット読み込みを高速化する便利なコツをご紹介します。

コツ

  • 1つの巨大なファイルに何もかもバンドルしないこと。CDNを用いて、必要なページでだけrequireしましょう(CDNはCKeditorなどのツールでも使われています)。
  • I18n-jsは翻訳を個別のファイルに保持します。必要な言語だけを設定するようにしましょう。さもないと、新しいライブラリを導入するたびに翻訳ファイルがあっという間に肥大化してしまいます。必要な言語だけを設定することでコンパイル済みファイルの肥大化を回避でき、ひいてはコンパイルとページ読み込みを高速化できます。
config.i18n.available_locales = %i(en)
  • therubyracerGemfileから削除しましょう。このgemはメモリを大量に消費するためです。代わりに、最新バージョンのNodeをインストールします。
  • SASSファイルやSCSSファイルでrequirerequire_treerequire_selfを使わないこと。これらはあまりに素朴であり、Sassファイルでうまく動作しません。代わりに、Sassネイティブの@importディレクティブを使いましょう。sass-railsはこのディレクティブをカスタマイズしてRailsプロジェクトの慣習に統合します。
  • SASSファイルやSCSSファイルでの@importディレクティブの使い方には注意が必要です。@import 'compass/css3/flexbox'のように個別にインポートできる状況であれば、@import 'compass';のようにパッケージアセットをまるごとインポートするのは避けましょう。
  • JavaScriptやCoffeeScriptのマニフェストでrequire_tree .を使うのは避けましょう。次のように、アプリの管理(admin)パネルが独自のアセットを持つ場合を考えてみます。
//** assets/javascripts/admin/admin.js

//= require admin/tab.js
//= ...

//** assets/javascripts/application.js

//= require 'something'
//= require_tree . // 悪手: adminのアセットまでrequireされてしまう
  • アセットをコンパイルするときのログをチェックしましょう。デフォルトのロガーをオーバーライドしてDEBUGモードでアクセスしたときの状態を確認するのは簡単です。
# /lib/tasks/assets.rake

require 'sprockets/rails/task'

Sprockets::Rails::Task.new(Rails.application) do |t|
  t.logger = Logger.new(STDOUT)
end

まとめ

上のルールはコンパイル済みアセットを高速化するのに有用です。この概念を実証するcintrzyk/sprockets-tipsをご覧いただければ、Railsのサンプルアプリでより詳細な部分を確認できます。

Rails 5.1以降、アセットの管理方法は多様になりました。私はYarnとWebpackによる管理を強くおすすめします。その有用性については、ぜひ私を信じてください。アセットの依存性管理、効率の高いコンパイルプロセス、ページを更新せずにコードを動的に再読み込みする機能、ES6サポート、PostCSSなど、多くのメリットを得られます。

関連記事

新しいRailsフロントエンド開発(1)Asset PipelineからWebpackへ(翻訳)

デザインも頼めるシステム開発会社をお探しならBPS株式会社までどうぞ 開発エンジニア積極採用中です! Ruby on Rails の開発なら実績豊富なBPS

この記事の著者

hachi8833

Twitter: @hachi8833、GitHub: @hachi8833 コボラー、ITコンサル、ローカライズ業界、Rails開発を経てTechRachoの編集・記事作成を担当。 これまでにRuby on Rails チュートリアル第2版の半分ほど、Railsガイドの初期翻訳ではほぼすべてを翻訳。その後も折に触れてそれぞれ一部を翻訳。 かと思うと、正規表現の粋を尽くした日本語エラーチェックサービス enno.jpを運営。 実は最近Go言語が好き。 仕事に関係ないすっとこブログ「あけてくれ」は2000年頃から多少の中断をはさんで継続、現在はnote.muに移転。

hachi8833の書いた記事

週刊Railsウォッチ

インフラ

ActiveSupport探訪シリーズ