better_image_tag 0.2.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/.gitignore +18 -0
- data/.rspec +2 -0
- data/CODE_OF_CONDUCT.md +74 -0
- data/Gemfile +6 -0
- data/LICENSE.txt +22 -0
- data/README.md +311 -0
- data/Rakefile +12 -0
- data/app/controllers/concerns/better_image_tag/image_taggable.rb +48 -0
- data/better_image_tag.gemspec +46 -0
- data/bin/console +14 -0
- data/bin/setup +8 -0
- data/exe/inlineable +10 -0
- data/lib/better_image_tag/base_image_tag.rb +37 -0
- data/lib/better_image_tag/commands/clear_inline_cache.rb +29 -0
- data/lib/better_image_tag/commands/convert_jpg_to_avif.rb +52 -0
- data/lib/better_image_tag/commands/convert_jpg_to_webp.rb +52 -0
- data/lib/better_image_tag/engine.rb +6 -0
- data/lib/better_image_tag/errors.rb +13 -0
- data/lib/better_image_tag/image_tag.rb +172 -0
- data/lib/better_image_tag/inline_data.rb +102 -0
- data/lib/better_image_tag/picture_tag.rb +103 -0
- data/lib/better_image_tag/railtie.rb +15 -0
- data/lib/better_image_tag/rspec.rb +24 -0
- data/lib/better_image_tag/svg_tag.rb +36 -0
- data/lib/better_image_tag/tasks/clear_inline_cache.rake +10 -0
- data/lib/better_image_tag/tasks/convert_jpgs.rake +16 -0
- data/lib/better_image_tag/version.rb +3 -0
- data/lib/better_image_tag.rb +56 -0
- metadata +207 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA256:
|
3
|
+
metadata.gz: 7df2e2edc57e025ec836d4c102c617d70dea1c072a76cf7185c188cea873d704
|
4
|
+
data.tar.gz: 2b7680cec05ea1078275f14b1d11483d6717807629a6140605aac48a5bc47eab
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: 81e4711d38e429cee31da67d3d933c65ef87af17f128561e863e6827feb9a9ef9359bb27bde6bfd0117279950485359bd66eb2541c15f6fc14220af34711aa90
|
7
|
+
data.tar.gz: 03f67acd1da24a1f55452fc44a2e1b89f64bd73893c2cd45da99d582594d7a388d3b0451fac4ec92771b91f06d7a1822c3fcfda33db7c346975939d29f1aa6ce
|
data/.gitignore
ADDED
@@ -0,0 +1,18 @@
|
|
1
|
+
.tool-versions
|
2
|
+
/.rspec_status
|
3
|
+
/.bundle/
|
4
|
+
/.overcommit.yml
|
5
|
+
/.yardoc
|
6
|
+
/Gemfile.lock
|
7
|
+
/_yardoc/
|
8
|
+
/coverage/
|
9
|
+
/doc/
|
10
|
+
/pkg/
|
11
|
+
/spec/reports/
|
12
|
+
/spec/dummy/log/*
|
13
|
+
/spec/dummy/tmp/*
|
14
|
+
/tmp/
|
15
|
+
/gemfiles/*.lock
|
16
|
+
/gemfiles/.bundle
|
17
|
+
/spec/dummy/tmp/cache/*
|
18
|
+
/spec/dummy/log/*
|
data/.rspec
ADDED
data/CODE_OF_CONDUCT.md
ADDED
@@ -0,0 +1,74 @@
|
|
1
|
+
# Contributor Covenant Code of Conduct
|
2
|
+
|
3
|
+
## Our Pledge
|
4
|
+
|
5
|
+
In the interest of fostering an open and welcoming environment, we as
|
6
|
+
contributors and maintainers pledge to making participation in our project and
|
7
|
+
our community a harassment-free experience for everyone, regardless of age, body
|
8
|
+
size, disability, ethnicity, gender identity and expression, level of experience,
|
9
|
+
nationality, personal appearance, race, religion, or sexual identity and
|
10
|
+
orientation.
|
11
|
+
|
12
|
+
## Our Standards
|
13
|
+
|
14
|
+
Examples of behavior that contributes to creating a positive environment
|
15
|
+
include:
|
16
|
+
|
17
|
+
* Using welcoming and inclusive language
|
18
|
+
* Being respectful of differing viewpoints and experiences
|
19
|
+
* Gracefully accepting constructive criticism
|
20
|
+
* Focusing on what is best for the community
|
21
|
+
* Showing empathy towards other community members
|
22
|
+
|
23
|
+
Examples of unacceptable behavior by participants include:
|
24
|
+
|
25
|
+
* The use of sexualized language or imagery and unwelcome sexual attention or
|
26
|
+
advances
|
27
|
+
* Trolling, insulting/derogatory comments, and personal or political attacks
|
28
|
+
* Public or private harassment
|
29
|
+
* Publishing others' private information, such as a physical or electronic
|
30
|
+
address, without explicit permission
|
31
|
+
* Other conduct which could reasonably be considered inappropriate in a
|
32
|
+
professional setting
|
33
|
+
|
34
|
+
## Our Responsibilities
|
35
|
+
|
36
|
+
Project maintainers are responsible for clarifying the standards of acceptable
|
37
|
+
behavior and are expected to take appropriate and fair corrective action in
|
38
|
+
response to any instances of unacceptable behavior.
|
39
|
+
|
40
|
+
Project maintainers have the right and responsibility to remove, edit, or
|
41
|
+
reject comments, commits, code, wiki edits, issues, and other contributions
|
42
|
+
that are not aligned to this Code of Conduct, or to ban temporarily or
|
43
|
+
permanently any contributor for other behaviors that they deem inappropriate,
|
44
|
+
threatening, offensive, or harmful.
|
45
|
+
|
46
|
+
## Scope
|
47
|
+
|
48
|
+
This Code of Conduct applies both within project spaces and in public spaces
|
49
|
+
when an individual is representing the project or its community. Examples of
|
50
|
+
representing a project or community include using an official project e-mail
|
51
|
+
address, posting via an official social media account, or acting as an appointed
|
52
|
+
representative at an online or offline event. Representation of a project may be
|
53
|
+
further defined and clarified by project maintainers.
|
54
|
+
|
55
|
+
## Enforcement
|
56
|
+
|
57
|
+
Instances of abusive, harassing, or otherwise unacceptable behavior may be
|
58
|
+
reported by contacting the project team at joel.oliveira@gmail.com. All
|
59
|
+
complaints will be reviewed and investigated and will result in a response that
|
60
|
+
is deemed necessary and appropriate to the circumstances. The project team is
|
61
|
+
obligated to maintain confidentiality with regard to the reporter of an incident.
|
62
|
+
Further details of specific enforcement policies may be posted separately.
|
63
|
+
|
64
|
+
Project maintainers who do not follow or enforce the Code of Conduct in good
|
65
|
+
faith may face temporary or permanent repercussions as determined by other
|
66
|
+
members of the project's leadership.
|
67
|
+
|
68
|
+
## Attribution
|
69
|
+
|
70
|
+
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
|
71
|
+
available at [http://contributor-covenant.org/version/1/4][version]
|
72
|
+
|
73
|
+
[homepage]: http://contributor-covenant.org
|
74
|
+
[version]: http://contributor-covenant.org/version/1/4/
|
data/Gemfile
ADDED
data/LICENSE.txt
ADDED
@@ -0,0 +1,22 @@
|
|
1
|
+
The MIT License (MIT)
|
2
|
+
|
3
|
+
Copyright (c) 2017 ezCater, Inc
|
4
|
+
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
7
|
+
in the Software without restriction, including without limitation the rights
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
10
|
+
furnished to do so, subject to the following conditions:
|
11
|
+
|
12
|
+
The above copyright notice and this permission notice shall be included in
|
13
|
+
all copies or substantial portions of the Software.
|
14
|
+
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
21
|
+
THE SOFTWARE.
|
22
|
+
|
data/README.md
ADDED
@@ -0,0 +1,311 @@
|
|
1
|
+
# BetterImageTag
|
2
|
+
|
3
|
+
`better_image_tag` is a drop-in evolution (mutation?) of Rails' stock
|
4
|
+
`image_tag` view helper. "Is that really necessary?", you might say. No, not
|
5
|
+
necessarily, but there are opportunities for improvement in the typical web
|
6
|
+
app/site work-flow that are addressable via common boilerplate code that
|
7
|
+
-- we hope -- is wrapped up nicely into this gem. Namely:
|
8
|
+
|
9
|
+
* Using webp or avif versions of an image if the browser supports it.
|
10
|
+
* A rake task that will generate webp or avif versions of all jpg's in your app.
|
11
|
+
* Ability to inline contents of an image as a base64 encoded string.
|
12
|
+
* Inlining SVG's will output the contents of the SVG image instead of using img
|
13
|
+
tag and its base64 encoded data. This also allows for width, height, and
|
14
|
+
class properties to be applied to the root SVG tag.
|
15
|
+
* In conjunction with the excellent [lazysizes] JS library, lazy-loading
|
16
|
+
of images.
|
17
|
+
* Fetching dimensions of, typically, user-generated image content and
|
18
|
+
applying width and height properties to the image tag
|
19
|
+
* An `inlineable` executable is provided for cases where you're not working
|
20
|
+
with Rails and just need a tool to output the base64 data url for images or
|
21
|
+
css.
|
22
|
+
|
23
|
+
Everything above is in service of making web pages render faster. If you're
|
24
|
+
familiar with [Google's lighthouse page speed tool], or [WebPageTest], then
|
25
|
+
you may be familiar with some of the strategies outlined above.
|
26
|
+
|
27
|
+
## Installation
|
28
|
+
|
29
|
+
Add this line to your application's Gemfile:
|
30
|
+
|
31
|
+
```ruby
|
32
|
+
gem 'better_image_tag'
|
33
|
+
```
|
34
|
+
|
35
|
+
And then execute:
|
36
|
+
|
37
|
+
```sh
|
38
|
+
$ bundle
|
39
|
+
```
|
40
|
+
|
41
|
+
To make use of the lazy-loading, install [lazysizes] with your javascript budndler of choice -- webpacker, the asset pipeline, etc.
|
42
|
+
|
43
|
+
## Configuration
|
44
|
+
|
45
|
+
You may configure `better_image_tag` with an initializer (eg: `config/initializers/better_image_tag.rb`) containing any or all of the following:
|
46
|
+
|
47
|
+
```
|
48
|
+
# the following are the defaults
|
49
|
+
|
50
|
+
BetterImageTag.configure do |config|
|
51
|
+
config.cache_inlining_enabled = false
|
52
|
+
config.cache_sizing_enabled = false
|
53
|
+
config.images_path = "#{Rails.root}/app/assets/images"
|
54
|
+
config.inlining_enabled = true
|
55
|
+
config.sizing_enabled = true
|
56
|
+
config.require_alt_tags = false
|
57
|
+
end
|
58
|
+
```
|
59
|
+
|
60
|
+
* `cache_inlining_enabled` uses Rails' cache for the base64 encoded contents of an image path
|
61
|
+
* `cache_sizing_enabled` uses Rails' cache for the width and height dimensions of an images path/url.
|
62
|
+
* `images_path` points to the base image assets' path in your application.
|
63
|
+
* `inlining_enabled` turns the inlining mechanism on or off.
|
64
|
+
* `sizing_enabled` turns the image size fetching mechanism on or off.
|
65
|
+
* `require_alt_tags`, when set to true, will raise an exception if an image tag does not have an alt attribute set. [Adding alternative text to photos is first and foremost a principle of web accessibility]. This helps enforce usage of alt tags in an effort to increase web accessibility.
|
66
|
+
|
67
|
+
[Adding alternative text to photos is first and foremost a principle of web accessibility]: https://moz.com/learn/seo/alt-text
|
68
|
+
|
69
|
+
## Usage
|
70
|
+
|
71
|
+
Add the controller concern to the controllers where you would like to use
|
72
|
+
`better_image_tag`:
|
73
|
+
|
74
|
+
```
|
75
|
+
class HomepageController < ApplicationController
|
76
|
+
include BetterImageTag::ImageTaggable
|
77
|
+
end
|
78
|
+
```
|
79
|
+
|
80
|
+
Optionally, you can further constrain usage with a `better_image_tag` class
|
81
|
+
method. This is useful for scenarios where you want to use the features for
|
82
|
+
one action only:
|
83
|
+
|
84
|
+
```
|
85
|
+
class HomepageController < ApplicationController
|
86
|
+
include BetterImageTag::ImageTaggable
|
87
|
+
|
88
|
+
better_image_tag if: :needs_better_image_tags?
|
89
|
+
better_image_tag unless: :we_dont?
|
90
|
+
end
|
91
|
+
```
|
92
|
+
|
93
|
+
Furthermore, sometimes there are view partials shared across some controllers
|
94
|
+
that _do_ use `better_image_tag` and some that _do not_. In that case, you
|
95
|
+
would want to ensure that the endpoints/controllers pulling those partials in
|
96
|
+
will still function when the chained methods are called. In this case you can
|
97
|
+
"disable" the better_image_tag functionality explicitly in the controller that
|
98
|
+
is not using it:
|
99
|
+
|
100
|
+
|
101
|
+
```
|
102
|
+
class AnotherController < ApplicationController
|
103
|
+
include BetterImageTag::ImageTaggable
|
104
|
+
|
105
|
+
# explicitly pass through chained methods to default behavior
|
106
|
+
better_image_tag disabled: true
|
107
|
+
end
|
108
|
+
```
|
109
|
+
|
110
|
+
## CLI usage
|
111
|
+
|
112
|
+
There is an `inlineable` cli that will accept the path to a local image and will
|
113
|
+
output a base64 data url that can be used in your image `src`, or css `url()`
|
114
|
+
properties.
|
115
|
+
|
116
|
+
Example:
|
117
|
+
|
118
|
+
```sh
|
119
|
+
$ inlineable ./path/to/image.jpg
|
120
|
+
data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGB ... a whole lot o' letters & numbers
|
121
|
+
```
|
122
|
+
|
123
|
+
## Features
|
124
|
+
|
125
|
+
`better_image_tag`, by default, keeps the stock `image_tag` implementation
|
126
|
+
but extends it with chainable methods that will mutate the contents of
|
127
|
+
the generated `<img/>` tag. This is done purposefully to allow you to keep
|
128
|
+
things as they stand until you're ready to tackle those image-heavy corners
|
129
|
+
of your app.
|
130
|
+
|
131
|
+
Examples - chainable methods on `image_tag`:
|
132
|
+
|
133
|
+
* `#with_size` finds the size of an image by fetching as little data as needed. *Note:* If a `height` or `width` property are passed to the image tag then this will not run.
|
134
|
+
|
135
|
+
```
|
136
|
+
<%= image_tag("http://example.com/file.jpg").with_size %>
|
137
|
+
|
138
|
+
# => <img src="http://example.com/file.jpg" width="320" height="240">
|
139
|
+
```
|
140
|
+
|
141
|
+
* `#lazy_load`
|
142
|
+
|
143
|
+
```
|
144
|
+
<%= image_tag("http://example.com/file.jpg").lazy_load %>
|
145
|
+
|
146
|
+
# => <img class="lazyload" data-src="http://example.com/file.jpg" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" />
|
147
|
+
```
|
148
|
+
|
149
|
+
* `#webp`
|
150
|
+
|
151
|
+
```
|
152
|
+
<%= image_tag("http://example.com/file.jpg").webp %>
|
153
|
+
|
154
|
+
# => <picture>
|
155
|
+
<!--[if IE 9]><video style="display: none;"><![endif]-->
|
156
|
+
<source srcset="http://example.com/file.webp" type="image/webp">
|
157
|
+
<!--[if IE 9]></video><![endif]-->
|
158
|
+
<img src="http://example.com/file.jpg" />
|
159
|
+
</picture>
|
160
|
+
|
161
|
+
# OPTIONAL -- pass url to where another WEBP is:
|
162
|
+
|
163
|
+
<%= image_tag("http://example.com/file.jpg").webp("https://some.other-cdn.com/file.webp") %>
|
164
|
+
|
165
|
+
# => <picture>
|
166
|
+
<!--[if IE 9]><video style="display: none;"><![endif]-->
|
167
|
+
<source srcset="https://some.other-cdn.com/file.webp" type="image/webp">
|
168
|
+
<!--[if IE 9]></video><![endif]-->
|
169
|
+
<img src="http://example.com/file.jpg" />
|
170
|
+
</picture>
|
171
|
+
```
|
172
|
+
|
173
|
+
* `#avif`
|
174
|
+
|
175
|
+
```
|
176
|
+
<%= image_tag("http://example.com/file.jpg").avif %>
|
177
|
+
|
178
|
+
# => <picture>
|
179
|
+
<!--[if IE 9]><video style="display: none;"><![endif]-->
|
180
|
+
<source srcset="http://example.com/file.avif" type="image/avif">
|
181
|
+
<!--[if IE 9]></video><![endif]-->
|
182
|
+
<img src="http://example.com/file.jpg" />
|
183
|
+
</picture>
|
184
|
+
|
185
|
+
# OPTIONAL -- pass url to where another AVIF is:
|
186
|
+
|
187
|
+
<%= image_tag("http://example.com/file.jpg").avif("https://some.other-cdn.com/file.avif") %>
|
188
|
+
|
189
|
+
# => <picture>
|
190
|
+
<!--[if IE 9]><video style="display: none;"><![endif]-->
|
191
|
+
<source srcset="https://some.other-cdn.com/file.avif" type="image/avif">
|
192
|
+
<!--[if IE 9]></video><![endif]-->
|
193
|
+
<img src="http://example.com/file.jpg" />
|
194
|
+
</picture>
|
195
|
+
```
|
196
|
+
|
197
|
+
* `#avif` *AND* `#webp` -- use them both!
|
198
|
+
|
199
|
+
```
|
200
|
+
<%= image_tag("http://example.com/file.jpg").avif.webp %>
|
201
|
+
|
202
|
+
# => <picture>
|
203
|
+
<!--[if IE 9]><video style="display: none;"><![endif]-->
|
204
|
+
<source srcset="http://example.com/file.avif" type="image/avif">
|
205
|
+
<source srcset="http://example.com/file.webp" type="image/webp">
|
206
|
+
<!--[if IE 9]></video><![endif]-->
|
207
|
+
<img src="http://example.com/file.jpg" />
|
208
|
+
</picture>
|
209
|
+
```
|
210
|
+
|
211
|
+
* `#inline`
|
212
|
+
|
213
|
+
```
|
214
|
+
<%= image_tag("http://example.com/file.jpg").inline %>
|
215
|
+
|
216
|
+
# => <img src="data:image/jpg;base64...">
|
217
|
+
```
|
218
|
+
|
219
|
+
## Rake task(s)
|
220
|
+
|
221
|
+
Included in this gem are a pair of rake tasks that will find all jpg's in your project and will convert them to webp's, or avif's, if you have the appropriate tooling available on your machine.
|
222
|
+
|
223
|
+
```
|
224
|
+
bundle exec rake better_image_tag:convert_jpgs_to_webp
|
225
|
+
bundle exec rake better_image_tag:convert_jpgs_to_avif
|
226
|
+
```
|
227
|
+
|
228
|
+
For webp you will need [ImageMagick] installed. On Macs with [homebrew] you may install with `brew install imagemagick`.
|
229
|
+
|
230
|
+
For avif you will need the `go-avif` tool, which has [binaries publicly available on their GitHub releases page].
|
231
|
+
|
232
|
+
[ImageMagick]: https://imagemagick.org/index.php
|
233
|
+
[homebrew]: https://brew.sh
|
234
|
+
[binaries publicly available on their GitHub releases page]: https://github.com/Kagami/go-avif/releases
|
235
|
+
|
236
|
+
## Testing
|
237
|
+
|
238
|
+
If you use RSpec we have provided some helpers that you may add to `rails_helper.rb` that
|
239
|
+
will allow your specs to:
|
240
|
+
|
241
|
+
1. For all specs -- turn the inlining or size fetching features off.
|
242
|
+
2. For helper or view specs -- configure the `better_image_tag` functionality per test.
|
243
|
+
|
244
|
+
|
245
|
+
In `rails_helper.rb`,
|
246
|
+
add the following:
|
247
|
+
|
248
|
+
```ruby
|
249
|
+
require "better_image_tag/rspec"
|
250
|
+
|
251
|
+
RSpec.configure do |config|
|
252
|
+
# ...
|
253
|
+
config.include BetterImageTag::SpecHelpers
|
254
|
+
config.include BetterImageTag::ViewSpecHelpers, type: :view
|
255
|
+
config.include BetterImageTag::ViewSpecHelpers, type: :helper
|
256
|
+
# ...
|
257
|
+
```
|
258
|
+
|
259
|
+
In any of your specs you may disable inlining or sizing with the following helper methods:
|
260
|
+
|
261
|
+
```ruby
|
262
|
+
disable_better_image_tag_sizing!
|
263
|
+
disable_better_image_tag_inlining!
|
264
|
+
```
|
265
|
+
|
266
|
+
In your _view_ or _helper_ spec(s) you can configure the functionality with the same
|
267
|
+
options you can pass through the controller class method. For example:
|
268
|
+
|
269
|
+
```ruby
|
270
|
+
require "rails_helper"
|
271
|
+
|
272
|
+
RSpec.describe "home/index.html.erb", type: :view do
|
273
|
+
it "renders main partial with inlined logo image" do
|
274
|
+
better_image_tag
|
275
|
+
|
276
|
+
render
|
277
|
+
|
278
|
+
expect(rendered).to render_template("shared/_header")
|
279
|
+
# expect(rendered).to have_inlined_logo
|
280
|
+
end
|
281
|
+
|
282
|
+
it "renders default image tag" do
|
283
|
+
better_image_tag disabled: true
|
284
|
+
|
285
|
+
render
|
286
|
+
|
287
|
+
# ... assertions here.
|
288
|
+
end
|
289
|
+
```
|
290
|
+
|
291
|
+
## Development
|
292
|
+
|
293
|
+
After checking out the repo, run `bin/setup` to install dependencies. Then, run `rake spec` to run the tests. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
|
294
|
+
|
295
|
+
To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
|
296
|
+
|
297
|
+
## Contributing
|
298
|
+
|
299
|
+
Bug reports and pull requests are welcome on GitHub at https://github.com/jayroh/better_image_tag. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.
|
300
|
+
|
301
|
+
## License
|
302
|
+
|
303
|
+
The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
|
304
|
+
|
305
|
+
## Code of Conduct
|
306
|
+
|
307
|
+
Everyone interacting in the BetterImageTag project’s codebases, issue trackers, chat rooms and mailing lists is expected to follow the [code of conduct](https://github.com/jayroh/better_image_tag/blob/master/CODE_OF_CONDUCT.md).
|
308
|
+
|
309
|
+
[Google's lighthouse page speed tool]: https://developers.google.com/web/tools/lighthouse
|
310
|
+
[WebPageTest]: https://webpagetest.org
|
311
|
+
[lazysizes]: https://github.com/aFarkas/lazysizes
|
data/Rakefile
ADDED
@@ -0,0 +1,48 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
require 'active_support/concern'
|
4
|
+
|
5
|
+
module BetterImageTag
|
6
|
+
module ImageTaggable
|
7
|
+
extend ::ActiveSupport::Concern
|
8
|
+
|
9
|
+
module ClassMethods
|
10
|
+
attr_reader :better_image_tag_options
|
11
|
+
|
12
|
+
def better_image_tag(better_image_tag_options = {})
|
13
|
+
@better_image_tag_options = better_image_tag_options
|
14
|
+
.with_indifferent_access
|
15
|
+
end
|
16
|
+
end
|
17
|
+
|
18
|
+
included do
|
19
|
+
helper_method :image_tag
|
20
|
+
end
|
21
|
+
|
22
|
+
def image_tag(image, options = {})
|
23
|
+
return ActionController::Base.helpers.image_tag(image, options) if options.delete(:use_super)
|
24
|
+
|
25
|
+
better_image_tag = if better_image_tag_allowed?
|
26
|
+
BetterImageTag::ImageTag.new(view_context, image, options)
|
27
|
+
else
|
28
|
+
BetterImageTag::BaseImageTag.new(view_context, image, options)
|
29
|
+
end
|
30
|
+
|
31
|
+
return better_image_tag.picture_tag.to_s if options.delete(:use_picture)
|
32
|
+
|
33
|
+
better_image_tag
|
34
|
+
end
|
35
|
+
|
36
|
+
private
|
37
|
+
|
38
|
+
def better_image_tag_allowed?
|
39
|
+
options = self.class.better_image_tag_options || {}
|
40
|
+
|
41
|
+
return send(options[:if]) if options[:if].present?
|
42
|
+
return !send(options[:unless]) if options[:unless].present?
|
43
|
+
return !options[:disabled] if options[:disabled].present?
|
44
|
+
|
45
|
+
true
|
46
|
+
end
|
47
|
+
end
|
48
|
+
end
|
@@ -0,0 +1,46 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
lib = File.expand_path('lib', __dir__)
|
4
|
+
$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
|
5
|
+
|
6
|
+
require 'better_image_tag/version'
|
7
|
+
|
8
|
+
Gem::Specification.new do |spec|
|
9
|
+
spec.name = 'better_image_tag'
|
10
|
+
spec.version = BetterImageTag::VERSION
|
11
|
+
spec.authors = ['Joel Oliveira']
|
12
|
+
spec.email = ['joel.oliveira@ezcater.com']
|
13
|
+
|
14
|
+
spec.summary = 'A more robust and optimized rails image_tag'
|
15
|
+
spec.description = <<~EODESC
|
16
|
+
From lazy loading, to inline image contents, to fetching unknown width and
|
17
|
+
height, to next generation image formats, this gem aims to extend the
|
18
|
+
default image_tag method to do more for static web pages.
|
19
|
+
EODESC
|
20
|
+
spec.homepage = 'https://www.ezcater.com'
|
21
|
+
spec.license = 'MIT'
|
22
|
+
|
23
|
+
# Specify which files should be added to the gem when it is released. The
|
24
|
+
# `git ls-files -z` loads the files in the RubyGem that have been added into
|
25
|
+
# git.
|
26
|
+
spec.files = Dir.chdir(File.expand_path(__dir__)) do
|
27
|
+
`git ls-files -z`.split("\x0").reject do |f|
|
28
|
+
f.match(%r{^(test|spec|features)/})
|
29
|
+
end
|
30
|
+
end
|
31
|
+
spec.bindir = 'exe'
|
32
|
+
spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
|
33
|
+
spec.require_paths = ['lib']
|
34
|
+
|
35
|
+
spec.add_dependency 'fastimage'
|
36
|
+
spec.add_dependency 'mimemagic'
|
37
|
+
spec.add_dependency 'rails', ['>= 5', '< 7.0']
|
38
|
+
|
39
|
+
|
40
|
+
spec.add_development_dependency 'bundler', '~> 2.1'
|
41
|
+
spec.add_development_dependency 'pry-byebug'
|
42
|
+
spec.add_development_dependency 'rake', '>= 12.3.3'
|
43
|
+
spec.add_development_dependency 'rspec-rails'
|
44
|
+
spec.add_development_dependency 'vcr'
|
45
|
+
spec.add_development_dependency 'webmock'
|
46
|
+
end
|
data/bin/console
ADDED
@@ -0,0 +1,14 @@
|
|
1
|
+
#!/usr/bin/env ruby
|
2
|
+
|
3
|
+
require "bundler/setup"
|
4
|
+
require "better_image_tag"
|
5
|
+
|
6
|
+
# You can add fixtures and/or initialization code here to make experimenting
|
7
|
+
# with your gem easier. You can also use a different console, if you like.
|
8
|
+
|
9
|
+
# (If you use this, don't forget to add pry to your Gemfile!)
|
10
|
+
# require "pry"
|
11
|
+
# Pry.start
|
12
|
+
|
13
|
+
require "irb"
|
14
|
+
IRB.start(__FILE__)
|
data/bin/setup
ADDED
data/exe/inlineable
ADDED
@@ -0,0 +1,37 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module BetterImageTag
|
4
|
+
class BaseImageTag
|
5
|
+
attr_reader :view_context, :options, :image
|
6
|
+
|
7
|
+
def initialize(view_context, image, options = {})
|
8
|
+
@view_context = view_context
|
9
|
+
@image = image
|
10
|
+
@options = options.symbolize_keys
|
11
|
+
end
|
12
|
+
|
13
|
+
def with_size
|
14
|
+
self
|
15
|
+
end
|
16
|
+
|
17
|
+
def lazy_load(**_args)
|
18
|
+
self
|
19
|
+
end
|
20
|
+
|
21
|
+
def webp
|
22
|
+
self
|
23
|
+
end
|
24
|
+
|
25
|
+
def avif
|
26
|
+
self
|
27
|
+
end
|
28
|
+
|
29
|
+
def inline
|
30
|
+
self
|
31
|
+
end
|
32
|
+
|
33
|
+
def to_s
|
34
|
+
view_context.image_tag(image, options.merge(use_super: true))
|
35
|
+
end
|
36
|
+
end
|
37
|
+
end
|
@@ -0,0 +1,29 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module BetterImageTag
|
4
|
+
module Commands
|
5
|
+
class ClearInlineCache
|
6
|
+
def self.call
|
7
|
+
new.call
|
8
|
+
end
|
9
|
+
|
10
|
+
def call
|
11
|
+
inline_cache_keys.select do |key|
|
12
|
+
Rails.cache.delete key
|
13
|
+
end
|
14
|
+
end
|
15
|
+
|
16
|
+
private
|
17
|
+
|
18
|
+
def inline_cache_keys
|
19
|
+
cache_keys.select do |key|
|
20
|
+
key.start_with? BetterImageTag::InlineData::CACHE_PREFIX
|
21
|
+
end
|
22
|
+
end
|
23
|
+
|
24
|
+
def cache_keys
|
25
|
+
Rails.cache.instance_variable_get(:@data)&.keys || []
|
26
|
+
end
|
27
|
+
end
|
28
|
+
end
|
29
|
+
end
|