Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Rails Assets LRUG
Search
Tymon Tobolski
December 09, 2013
Programming
0
7.3k
Rails Assets LRUG
Talk about
http://rails-assets.org
that I gave on London Ruby User Group
Tymon Tobolski
December 09, 2013
Tweet
Share
More Decks by Tymon Tobolski
See All by Tymon Tobolski
Only possible with Elixir - ubots Case Study
teamon
0
200
Fun with Elixir Macros
teamon
1
410
Elixir GenStage & Flow
teamon
2
910
Elixir - Bydgoszcz Web Development Meetup
teamon
2
700
Sidekiq
teamon
1
140
Git - Monterail style
teamon
1
150
Rails Assets wroc_love.rb
teamon
1
680
Angular replacements for jQuery-based libraries
teamon
1
290
Angular replacements for jQuery-based libraries
teamon
2
290
Other Decks in Programming
See All in Programming
Compose 1.7のTextFieldはPOBox Plusで日本語変換できない
tomoya0x00
0
190
Streams APIとTCPフロー制御 / Web Streams API and TCP flow control
tasshi
2
350
レガシーシステムにどう立ち向かうか 複雑さと理想と現実/vs-legacy
suzukihoge
14
2.2k
TypeScript Graph でコードレビューの心理的障壁を乗り越える
ysk8hori
2
1.1k
PHP でアセンブリ言語のように書く技術
memory1994
PRO
1
170
Amazon Qを使ってIaCを触ろう!
maruto
0
410
RubyLSPのマルチバイト文字対応
notfounds
0
120
Jakarta EE meets AI
ivargrimstad
0
200
Less waste, more joy, and a lot more green: How Quarkus makes Java better
hollycummins
0
100
受け取る人から提供する人になるということ
little_rubyist
0
230
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
120
Jakarta EE meets AI
ivargrimstad
0
580
Featured
See All Featured
Optimising Largest Contentful Paint
csswizardry
33
2.9k
Making the Leap to Tech Lead
cromwellryan
133
8.9k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
109
49k
5 minutes of I Can Smell Your CMS
philhawksworth
202
19k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
364
24k
Building Flexible Design Systems
yeseniaperezcruz
327
38k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
191
16k
How GitHub (no longer) Works
holman
310
140k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
27
4.3k
Docker and Python
trallard
40
3.1k
Building Your Own Lightsaber
phodgson
103
6.1k
Designing for humans not robots
tammielis
250
25k
Transcript
Rails Assets The solution to assets management in Rails London,
9.12.2013
Tymon Tobolski About me @iteamon github.com/teamon DRUG
March 14-16th 2014 Wrocław Poland wrocloverb.com
What is the problem? • Managing assets in rails app
is hard • Tons of incompatible javascript libraries • Unmaintainable legacy projects
Existing solutions • vendor/assets • bower • component • browserify
(npm) • asset gems
None
None
source 'https://rubygems.org' +source 'https://rails-assets.org' ! gem 'rails' ! group :assets
do gem 'sass-rails' gem 'uglifier' gem 'coffee-rails' + gem 'rails-assets-bootstrap' + gem 'rails-assets-angular' + gem 'rails-assets-leaflet' end
bundle install
application.js ! ! ! //= require_self +//= require bootstrap +//=
require angular +//= require leaflet //= require_tree . application.css ! ! /* *= require_self +*= require bootstrap +*= require leaflet *= require_tree . */
None
None
Pros • No more vendor/assets • Proper versioning • Dependency
resolution • No additional build step • Already used in few production apps with no big issues
How it works?
Bower registry name => git repository + meta
bower.json { "name": "bootstrap", "version": "3.0.3", "main": [ "./dist/js/bootstrap.js", "./dist/css/bootstrap.css"
], "dependencies": { "jquery": ">= 1.9.0" } }
Gem name { "name": "bootstrap", "version": "3.0.3", "main": [ "./dist/js/bootstrap.js",
"./dist/css/bootstrap.css" ], "dependencies": { "jquery": ">= 1.9.0" } }
Gem name bootstrap => rails-assets-bootstrap
Version { "name": "bootstrap", "version": "3.0.3", "main": [ "./dist/js/bootstrap.js", "./dist/css/bootstrap.css"
], "dependencies": { "jquery": ">= 1.9.0" } }
Version module RailsAssetsBootstrap VERSION = "3.0.3" end
Manifests { "name": "bootstrap", "version": "3.0.3", "main": [ "./dist/js/bootstrap.js", "./dist/css/bootstrap.css"
], "dependencies": { "jquery": ">= 1.9.0" } }
Manifest - sprockets # application.js //= require bootstrap Simple component
vendor/assets/javascripts/ - bootstrap.js - bootstrap/bootstrap.js
Manifest - sprockets # application.js //= require moment //= require
moment/lang/pl More complex component vendor/assets/javascripts/ - moment.js - moment/moment.js - moment/lang/en.js - moment/lang/pl.js
Dependencies { "name": "bootstrap", "version": "3.0.3", "main": [ "./dist/js/bootstrap.js", "./dist/css/bootstrap.css"
], "dependencies": { "jquery": ">= 1.9.0" } }
gemspec lib = File.expand_path('../lib', __FILE__) $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib) require 'rails-assets-bootstrap/version'
! Gem::Specification.new do |spec| spec.name = "rails-assets-bootstrap" spec.version = RailsAssetsBootstrap::VERSION # ... spec.add_dependency "rails-assets-jquery", ">= 1.9.0" # ... end
Rails Engine require "rails-assets-bootstrap/version" ! require "rails-assets-jquery" ! if defined?(Rails)
module RailsAssetsBootstrap class Engine < ::Rails::Engine # Rails -> use vendor directory. end end end
"## lib $ "## rails-assets-bootstrap $ $ &## version.rb $
&## rails-assets-bootstrap.rb "## vendor $ &## assets $ "## images $ $ &## bootstrap $ $ &## assets $ $ &## ico $ $ "## apple-touch-icon-114-precomposed.png $ $ "## apple-touch-icon-144-precomposed.png $ $ "## apple-touch-icon-57-precomposed.png $ $ "## apple-touch-icon-72-precomposed.png $ $ &## favicon.png $ "## javascripts $ $ "## bootstrap $ $ $ &## bootstrap.js $ $ &## bootstrap.js $ &## stylesheets $ "## bootstrap $ $ "## bootstrap-theme.scss $ $ &## bootstrap.scss $ &## bootstrap.scss "## Gemfile "## README.md "## Rakefile &## rails-assets-bootstrap.gemspec
Challenges
bower is a mess • just git clone • duplicates,
momentjs vs moment, swipe vs Swipe • separate repositories, e.g angular-bower • {bower, package, component}.json - unreliable • bower info missing ”main”
bower is a mess • no common structure • lib.js
at top level • src, dist, release, etc. directories • .{js,css}.min duplicates • not compiled packages • missing dependencies
Other issues • version spec differences • bundler API -
no versions in dependencies API request • web frontend is essential • rails-assets-jquery vs jquery-rails conflicts
Technical issues • Gem::Indexer bug • global bower cache -
custom bower fork • auto updates via bower api • index locking • background jobs, blocking • weak performance • do as much as possible in memory
We need your help • Spread the word • Improve
bower.json files • Bug discovering and fixing
None
Questions?