Desmistificando o Asset Pipeline

O (tão controverso) Asset Pipeline foi introduzido no Rails 3.1 com o intuito de facilitar nossas vidas quando precisamos servir assets em nossos projetos. Ao tratá-los como parte fundamental de uma aplicação web, podemos melhorar a organização do nosso código front-end e dirigi-lo para um caminho mais robusto e modular.

Embora alguns desenvolvedores não gostem da forma como o Asset Pipeline funciona, ele introduz conceitos fundamentais no Rails que resolvem questões que são recorrentes em grandes projetos, como a distribuição de assets através de engines, modularização, minificação e outros.

Neste talk, veremos como tirar máximo proveito do Asset Pipeline, como ele se integra ao Rails e algumas alternativas possíveis da sua implementação atual.

Transcript

1. "44&5
   1*1&-*/& desmistificando o
2. !3POEZ
4. "(&/%"
5. 1PS
   RVF
   QSFDJTÂWBNPT "(&/%"
6. 1PS
   RVF
   QSFDJTÂWBNPT 0WFSWJFX "(&/%"
7. 1PS
   RVF
   QSFDJTÂWBNPT 0WFSWJFX 4QSPDLFUT "(&/%"
8. 1PS
   RVF
   QSFDJTÂWBNPT 0WFSWJFX 4QSPDLFUT &YFD+4
   UIFSVCZSBDFS
   F
   PVUSBT
   SVOUJNFT "(&/%"
9. 1PS
   RVF
   QSFDJTÂWBNPT 0WFSWJFX 4QSPDLFUT &YFD+4
   UIFSVCZSBDFS
   F
   PVUSBT
   SVOUJNFT 1SÉQSPDFTTBEPSFT
   DVTUPNJ[BEPT "(&/%"
10. 1PS
    RVF
    QSFDJTÂWBNPT 0WFSWJFX 4QSPDLFUT &YFD+4
    UIFSVCZSBDFS
    F
    PVUSBT
    SVOUJNFT 1SÉQSPDFTTBEPSFT
    DVTUPNJ[BEPT (FNJpDBOEP
    BTTFUT
    SFVTÂWFJT "(&/%"
11. 1PS
    RVF
    QSFDJTÂWBNPT 0WFSWJFX 4QSPDLFUT &YFD+4
    UIFSVCZSBDFS
    F
    PVUSBT
    SVOUJNFT 1SÉQSPDFTTBEPSFT
    DVTUPNJ[BEPT (FNJpDBOEP
    BTTFUT
    SFVTÂWFJT %JDBT
    USVRVFT
    F
    PVUSBT
    GFJUJÇBSJBT "(&/%"
12. 1PS
    RVF
    QSFDJTÂWBNPT 0WFSWJFX 4QSPDLFUT &YFD+4
    UIFSVCZSBDFS
    F
    PVUSBT
    SVOUJNFT 1SÉQSPDFTTBEPSFT
    DVTUPNJ[BEPT (FNJpDBOEP
    BTTFUT
    SFVTÂWFJT %JDBT
    USVRVFT
    F
    PVUSBT
    GFJUJÇBSJBT "MUFSOBUJWBT "(&/%"
14. 3"*-4
    ¬
    36#:
15. 3"*-4
    ¬
    36#: '0$0
    /0
    %0.°/*0
    %0
    130#-&."
16. 3"*-4
    ¬
    36#: '0$0
    /0
    %0.°/*0
    %0
    130#-&." $0/7&/ª§0
    40#3&
    $0/'*(63"ª§0
17. 3"*-4
    ¬
    36#: '0$0
    /0
    %0.°/*0
    %0
    130#-&." $0/7&/ª§0
    40#3&
    $0/'*(63"ª§0 03("/*;"ª§0
    %&
    "326*704
18. &
    0/%&
    &6
    (6"3%0
    04
    .&64
    "44&54
19. &
    0/%&
    &6
    (6"3%0
    04
    .&64
    "44&54 public/*
20. &
    0/%&
    &6
    (6"3%0
    04
    .&64
    "44&54 public/* limbo
21. "44&54 DTT
    KBWBTDSJQU
    JNBHFOT
    GPOUFT
    BVEJP
    WJEFP
22. 40.04
    /&(-*(&/5&4
    $0.
    $¶%*(0
    '30/5&/% .&"
    $6-1"
23. .0%6-"3*;"ª§0 05*.*;"ª§0 &
24. $"."-)"ª0
    %&
    "326*704 26&
    "6.&/5"
    0
    /¼.&30
    %&
    3&26&454
    &
    "
    -"5­/$*" ."/5&3
    56%0
    &.
    "1&/"4
    6.
    *.&/40
    "326*70 ."/65&/ª§0
    $3*.*/04" 9 1) 2)
30. %*.*/6*3
    /¼.&30
    %&
    3&26*4*ª¸&4
    )551
31. %*.*/6*3
    /¼.&30
    %&
    3&26*4*ª¸&4
    )551 .*/*'*$"3
    +"7"4$3*15
    &
    $44
32. %*.*/6*3
    /¼.&30
    %&
    3&26*4*ª¸&4
    )551 .*/*'*$"3
    +"7"4$3*15
    &
    $44 $0.10/&/5&4
    (;*1
33. IUUQXXXZPVUVCFDPNXBUDI W6M.Q*)),T
34. "If a problem is very commom, we end up with a proliferation of choices." :FIVEB
    ,BU[
35. “...but we should have to make fewer decisions.” :FIVEB
    ,BU[
36. 4&37*3
    "44&54
    /§0
    ¬ 53*7*"-
37. 6. 1*1&-*/& 1"3"
    0
    
    3&4("5&
38. a linear sequence of specialized modules which performs a task, like an assembly line in a factory. pipe.line noun
39. 1*1&-*/& the
40. 13¬130$&44"3 1*1&-*/& the
41. 13¬130$&44"3 $0/$"5&/"3 1*1&-*/& the
42. 13¬130$&44"3 $0/$"5&/"3 .*/*'*$"3 1*1&-*/& the
43. 13¬130$&44"3 $0/$"5&/"3 .*/*'*$"3 $0.13*.*3 1*1&-*/& the
44. 13¬130$&44"3 $0/$"5&/"3 .*/*'*$"3 $0.13*.*3 $"$)&
    #645*/( 1*1&-*/& the
45. QVCMJD\KBWBTDSJQUTcTUZMFTIFFUTcJNBHFT^ 3"*-4
    
46. 3"*-4
    
47. IUUQXXXZPVUVCFDPNXBUDI WD(E$*)IG"6
48. "We're elevating this stuff up to the same importance as Ruby code itself." %BWJE
    )
    )BOTTPO
    
    3BDF
    $BS
    %SJWFS
49. $63"5&%
    '3".&803,
50. rails new rs-on-rails
51. %"
    %*4$¶3%*" (&.'*-&
52. (FNpMF group :assets do gem 'sass-rails', '~> 3.2.3' # gem 'therubyracer', :platforms => :ruby gem 'coffee-rails', '~> 3.2.1' gem 'uglifier', '>= 1.0.3' end
53. 0
    "44&5
    1*1&-*/&
    *.1¸&
    6."
    /07"
    &45365363"
    13"
    03("/*;"ª§0
    %&
    "44&54
54. 0
    "44&5
    1*1&-*/&
    *.1¸&
    6."
    /07"
    &45365363"
    13"
    03("/*;"ª§0
    %&
    "44&54
55. 0
    "44&5
    1*1&-*/&
    46(&3&
    6."
    /07"
    &45365363"
    13"
    03("/*;"ª§0
    %&
    "44&54
56. BQQBTTFUT MJCBTTFUT WFOEPSBTTFUT
61. "44&5
    #6/%-&4
62. "44&5
    #6/%-&4 BQQMJDBUJPOKT BQQMJDBUJPODTT
63. <head> <title>Rs on Rails</title> <%= stylesheet_link_tag "application", media: "all" %> <%= javascript_include_tag "application" %> <%= csrf_meta_tags %> </head> BQQWJFXTMBZPVUTBQQMJDBUJPOIUNMFSC
65. BQQMJDBUJPODTT
66. BQQMJDBUJPODTT SFTFUDTT MBZPVUDTT OBWJHBUJPODTT TJEFCBSDTT UZQPHSBQIZDTT GPSNTDTT UIFNFDTT
67. /* *= require_self *= require reset *= require layout *= require sidebar *= require navigation *= require typography *= require forms *= require colors */ BQQWJFXTMBZPVUTBQQMJDBUJPODTT
68. /* *= require_self *= require reset *= require layout *= require sidebar *= require navigation *= require typography *= require forms *= require colors */ BQQWJFXTMBZPVUTBQQMJDBUJPODTT no jargão, o “manifesto”
70. DPOpHFOWJSPONFOUTEFWFMPQNFOUSC RsOnRails::Application.configure do config.assets.debug = false end
72. DPOpHFOWJSPONFOUTEFWFMPQNFOUSC RsOnRails::Application.configure do config.assets.compress = true end
74. DPOpHFOWJSPONFOUTEFWFMPQNFOUSC RsOnRails::Application.configure do config.assets.digest = true end
76. http://localhost:3000/assets/application.css http://localhost:3000/assets/application.js
77. http://localhost:3000/assets/application.css http://localhost:3000/assets/application.js
78. http://localhost:3000/assets/application.css 0
    4130$,&54
    .0/5"
    6."
    6."
    3"$,
    "11
    /"
    305" BTTFUT http://localhost:3000/assets/application.js
79. IUUQTHJUIVCDPNSBJMTSBJMTCMPCTUBCMFBDUJPOQBDLMJC TQSPDLFUTCPPUTUSBQSC-
80. ."4
    4¶
    &.
    %&7&-01.&/5
81. $0.0
    '*$"
    &. 45"(*/(130%6$5*0/
82. 130%6$5*0/ 4FSWJEPS
    XFC
    TFSWF
    PT
    BSRVJWPT
    QSÉDPNQJMBEPT
83. DPOpHFOWJSPONFOUTEFWFMPQNFOUSC RsOnRails::Application.configure do config.assets.compress = false config.assets.debug = true end
84. DPOpHFOWJSPONFOUTEFWFMPQNFOUSC RsOnRails::Application.configure do config.assets.compress = false config.assets.debug = true end RsOnRails::Application.configure do config.assets.compress = true config.assets.compile = false config.assets.digest = true end DPOpHFOWJSPONFOUTQSPEVDUJPOSC
85. 04
    "44&54
    "/5&4
    %&
    &/53"3
    &.
    130%6ª§0 06
    4&+"
    13&$*4".04 13¬$0.1*-"3
86. $ rake assets:precompile
87. $ rake assets:precompile
88. $ rake assets:precompile
89. /assets/application-9d75ac5c90e71cbe60d8e612a438af43.css /assets/application-9d75ac5c90e71cbe60d8e612a438af43.css.gz
90. /assets/application-9d75ac5c90e71cbe60d8e612a438af43.css ✓
    $0.1*-"%0 ✓
    $0/$"5&/"%0 ✓
    .*/*'*$"%0 ✓
    $"$)&
    #645&%
    '*/(&313*/5 ✓
    $0.13*.*%0 /assets/application-9d75ac5c90e71cbe60d8e612a438af43.css.gz
92. ."/*'&45:.-
93. --- Aller_Rg.ttf: Aller_Rg-89086a78088e0ccdf7d5f3a2413b890c.ttf rails.png: rails-be8732dac73d845ac5b142c8fb5f9fb0.png application.js: application-d47f12ee8bceef5910c0e6d180ecf97c.js application.css: application-cf5421f21a42b9b487d6131006c60539.css QVCMJDBTTFUTNBOJGFTUZNM
94. /§0
    64"3¥4
    -*7&
    $0.1*-"5*0/
    &.
    130%6ª§0
95. 70-5"/%0
    "0
    "11-*$"5*0/
    #6/%-&
97. $"%­
    0
    +26&3:
    26&
    %&7&3*"
    &45"3
    "26*
98. 4&(63"
    &44"
    %¼7*%"
99. 13¬130$&44"%03&4
100. TQFBLFSTKT
102. TQFBLFSTDPGGF
103. GPSNTDTT
105. GPSNTDTTTDTT
106. GPSNTDTTTDTTFSC
107. GPSNTDTTTDTTFSC $"%&*"
     %&
     13¬130$&44".&/50
108. IUUQTHJUIVCDPNNFUBTLJMMTMFTTSBJMT
109. IUUQTHJUIVCDPNMVDBTNB[[BSVCZTUZMVT
110. 4130$,&54
111. require "sprockets"
112. require "sprockets" env = Sprockets::Environment.new
113. require "sprockets" env = Sprockets::Environment.new env.append_path "assets/javascripts"
114. require "sprockets" env = Sprockets::Environment.new env.append_path "assets/javascripts" application_js = env["application.js"]
115. require "sprockets" env = Sprockets::Environment.new env.append_path "assets/javascripts" application_js = env["application.js"] logical path
116. puts application_js.inspect
117. puts application_js.inspect # #<Sprockets::BundledAsset:0x3fd7304a3570 # pathname="/Users/rondy/sprockets/assets/javascripts/application.js", # mtime=2012-09-02 17:08:34 -0300, # digest="e643622cbd2c3f4d29b5fad9e329b2e8">
118. puts application_js
119. puts application_js # contents of `application.js` with its concatenated dependencies
120. "1&/"4
     ."*4
     6."
     .06/5"#-&
     3"$,
     "11
121. require 'sprockets' map '/assets' do environment = Sprockets::Environment.new environment.append_path 'app/assets/javascripts' environment.append_path 'app/assets/stylesheets' run environment end map '/' do run YourRackApp end
122. 4130$,&54
123. guard 'sprockets', destination: "build/javascripts", asset_paths: ['/src/javascripts'] do watch (%r{src/javascripts/application.js}) end (VBSEpMF
124. 70-5"/%0
     "0
     (&.'*-&
     %"
     %*4$¶3%*"
125. (FNpMF group :assets do gem 'sass-rails', '~> 3.2.3' # gem 'therubyracer', :platforms => :ruby gem 'coffee-rails', '~> 3.2.1' gem 'uglifier', '>= 1.0.3' end
126. gem 'therubyracer', :platforms => :ruby
127. &9&$+4
128. &9&$+4 +"7"4$3*15
     
     36#:
129. require "execjs"
130. require "execjs" ExecJS.eval "'red yellow blue'.split(' ')"
131. require "execjs" ExecJS.eval "'red yellow blue'.split(' ')" # => ["red", "yellow", "blue"]
132. $PGGF4DSJQU 6HMJGZ
     
     GSJFOET
133. $PGGF4DSJQU 6HMJGZ
     
     GSJFOET &YFD+4
134. 36/5*.& $PGGF4DSJQU 6HMJGZ
     
     GSJFOET &YFD+4
135. 36/5*.& $PGGF4DSJQU 6HMJGZ
     
     GSJFOET /PEFKT &YFD+4
136. 36/5*.& $PGGF4DSJQU 6HMJGZ
     
     GSJFOET /PEFKT "QQMF
     +BWB4DSJQU$PSF &YFD+4
137. 36/5*.& $PGGF4DSJQU 6HMJGZ
     
     GSJFOET /PEFKT "QQMF
     +BWB4DSJQU$PSF .JDSPTPGU
     8JOEPXT
     4DSJQU
     )PTU
     +4DSJQU &YFD+4
138. 36/5*.& $PGGF4DSJQU 6HMJGZ
     
     GSJFOET /PEFKT UIFSVCZSBDFS "QQMF
     +BWB4DSJQU$PSF .JDSPTPGU
     8JOEPXT
     4DSJQU
     )PTU
     +4DSJQU &YFD+4
139. 36/5*.& $PGGF4DSJQU 6HMJGZ
     
     GSJFOET /PEFKT UIFSVCZSBDFS UIFSVCZSIJOP "QQMF
     +BWB4DSJQU$PSF .JDSPTPGU
     8JOEPXT
     4DSJQU
     )PTU
     +4DSJQU &YFD+4
141. gem 'therubyracer', :platforms => :ruby
142. gem 'therubyrhino', :platforms => :jruby
144. %*$"4
     53626&4
     &
     0653"4
     '&*5*ª"3*"4
145. 4130$,&54
     9
     4"44
146. $base-font-color: #555555; BQQBTTFUTTUZMFTIFFUTDPNNPODTTTDTT
147. /* *= require common */ body { color: $base-font-color; } BQQBTTFUTTUZMFTIFFUTBQQMJDBUJPODTTTDTT $base-font-color: #555555; BQQBTTFUTTUZMFTIFFUTDPNNPODTTTDTT
149. SFRVJSF
     
     TBTT
150. /* */ @import "common.css.scss"; body { color: $base-font-color; } BQQBTTFUTTUZMFTIFFUTBQQMJDBUJPODTTTDTT
151. $3*"/%0
     /04404
     13¶13*04
     13¬ 130$&44"%03&4
152. class TimestampProcessor < Sprockets::Processor end MJCQSPDFTTPSTUJNFTUBNQ@QSPDFTTPSSC
153. class TimestampProcessor < Sprockets::Processor def evaluate(context, locals) end end MJCQSPDFTTPSTUJNFTUBNQ@QSPDFTTPSSC
154. class TimestampProcessor < Sprockets::Processor def evaluate(context, locals) data end end MJCQSPDFTTPSTUJNFTUBNQ@QSPDFTTPSSC
155. class TimestampProcessor < Sprockets::Processor def evaluate(context, locals) current_timestamp = DateTime.now.to_s(:timestamp) ["/* #{current_timestamp} */", data].join("\n") end end MJCQSPDFTTPSTUJNFTUBNQ@QSPDFTTPSSC
156. require "processors/timestamp_processor" Rails.application.assets. register_postprocessor("text/css", TimestampProcessor) DPOpHJOJUJBMJ[FSTTQSPDLFUTSC
157. require "processors/timestamp_processor" Rails.application.assets. register_postprocessor("text/css", TimestampProcessor) Rails.application.assets. register_postprocessor("application/javascript", TimestampProcessor) DPOpHJOJUJBMJ[FSTTQSPDLFUTSC
159. (&.*'*$"/%0
     "44&54
     3&64¥7&*4
160. (&.*'*$"/%0
     "44&54
     3&64¥7&*4 ","
     $0.0
     4&3
     4)08
161. 4)08
     /§0
     4)08%&45
162. var Showdest = { description: "Are you showdest, my friend?" } alert(Showdest.description); //= require_self //= require showdest BQQBTTFUTKBWBTDSJQUTTIPXEFTUKT BQQBTTFUTKBWBTDSJQUTBQQMJDBUJPOKT
164. $ bundle gem showdest
165. $ bundle gem showdest $ cd showdest
166. $ bundle gem showdest $ cd showdest $ mkdir -p vendor/assets/javascript
167. $ bundle gem showdest $ cd showdest $ mkdir -p vendor/assets/javascript $ mv ~/code/rs-on-rails/app/assets/javascripts/showdest.js \ vendor/assets/javascript
169. group :assets do gem 'showdest', path: '/Users/rondy/code/showdest' end (FNpMF
170. $ bundle && rails s
171. $ bundle && rails s
172. module Showdest class Engine < Rails::Engine end end TIPXEFTUMJCTIPXEFTUFOHJOFSC
173. module Showdest class Engine < Rails::Engine end end TIPXEFTUMJCTIPXEFTUFOHJOFSC Gem::Specification.new do |gem| gem.add_dependency "railties", ">= 3.1", "< 5.0" end TIPXEFTUTIPXEFTUHFNTQFD
174. require "showdest/version" require "showdest/engine" module Showdest end TIPXEFTUMJCTIPXEFTUSC
175. $ bundle && rails s
176. $ bundle && rails s
177. -&.#3"
     %0
     +26&3:
178. (&.
     
     3"*-4
     &/(*/&
182. "-5&3/"5*7"4
183. rails new rs-on-rails \ --skip-sprockets
184. IUUQEPDVNFOUDMPVEHJUIVCDPNKBNNJU
185. IUUQTHJUIVCDPNMJWJOHTPDJBMSBLFQJQFMJOF
186. "*/%"
     )¥
     .6*50
     ."*4
187. IUUQHVJEFTSVCZPOSBJMTPSHBTTFU@QJQFMJOFIUNM
188. IUUQDPEFSCFSSZNFCMPHBTTFUQJQFMJOFGPSEVNNJFT
189. IUUQBLJUBPOSBJMTDPNBTTFUQJQFMJOFQBSBJOJDJBOUFT IUUQBLJUBPOSBJMTDPNBTTFUQJQFMJOFQBSBJOJDJBOUFTQBSUF
190. IUUQSBJMTDBTUTDPNFQJTPEFTVOEFSTUBOEJOHUIFBTTFUQJQFMJOF IUUQSBJMTDBTUTDPNFQJTPEFTBTTFUQJQFMJOFJOQSPEVDUJPO
191. IUUQCMPHNJOVUFTDPNVOUBOHMJOHUIFSBJMTBTTFUQJQFMJOFQBSUDBDIFTBOEDPNQBTT IUUQCMPHNJOVUFTDPNVOUBOHMJOHUIFSBJMTBTTFUQJQFMJOFQBSUQSPEVDUJPO IUUQCMPHNJOVUFTDPNVOUBOHMJOHUIFSBJMTBTTFUQJQFMJOFQBSUDPOpHVSBUJPO IUUQCMPHNJOVUFTDPNVOUBOHMJOHUIFSBJMTBTTFUQJQFMJOFQBSUUSPVCMFTIPPUJOH
192. IUUQQSBHQSPHDPNCPPLXBSWUIFSBJMTWJFX
194. &45".04
     $0/53"5"/%0 IUUQQMBUBGPSNBUFDDPNCSDPOUBDU
195. 0#3*("%0