tail_merge 0.4.0 → 0.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +22 -20
- data/benchmark/benchmark.rb +4 -7
- data/lib/tail_merge/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 163e2f04ba6092bb1d8a0e268dab58a087c9f853edc52ba1ae091cc6b2c7ece4
|
4
|
+
data.tar.gz: e0aa6a361b8e4219a783b6a00b099ca8dfe6b8c82ae071b2cac8ea4f79d268ce
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: f5071ee3b5bccf88d692a1863e2d7f4a1c37fd00f13786dd685127a557b5c23f064ece27f8e99f2719aae2e989b52ff09c1cc2395fc7977ceb2a8f7e1704193d
|
7
|
+
data.tar.gz: 8debb6513dc3035e7acab2ee0ebd58cb4ff265d523c28a17dc77d64fb7930faa02c91c8371875307525c6c63b50080d86f0c1ef20679be7a73077b2d6b76716d
|
data/README.md
CHANGED
@@ -1,19 +1,19 @@
|
|
1
1
|
# TailMerge
|
2
2
|
|
3
|
-
TailMerge is a super
|
3
|
+
TailMerge is a super-fast utility library to merge Tailwind CSS classes without conflicts.
|
4
4
|
|
5
5
|
```ruby
|
6
6
|
TailMerge.merge %w[px-2 py-1 bg-red hover:bg-dark-red p-3 bg-[#B91C1C]]
|
7
7
|
=> "hover:bg-dark-red p-3 bg-[#B91C1C]"
|
8
8
|
```
|
9
9
|
|
10
|
-
Classes
|
10
|
+
Classes that appear later in the list override earlier ones.
|
11
11
|
|
12
|
-
|
12
|
+
By leveraging the Rust crate [rustui_merge](https://docs.rs/rustui_merge/latest/rustui_merge/), TailMerge merges classes significantly faster than pure Ruby alternatives.
|
13
13
|
|
14
14
|
## Purpose
|
15
15
|
|
16
|
-
When you use
|
16
|
+
When you use Tailwind CSS to style components, you'll often want to adjust the styling of a component in certain situations.
|
17
17
|
|
18
18
|
An example:
|
19
19
|
|
@@ -24,7 +24,7 @@ class Well < ApplicationComponent
|
|
24
24
|
end
|
25
25
|
|
26
26
|
def call
|
27
|
-
tag.div class: default_classes + @classes
|
27
|
+
tag.div class: default_classes + @classes do
|
28
28
|
content
|
29
29
|
end
|
30
30
|
end
|
@@ -61,7 +61,7 @@ class Well < ApplicationComponent
|
|
61
61
|
end
|
62
62
|
|
63
63
|
def call
|
64
|
-
tag.div class: TailMerge.merge(default_classes + @classes)
|
64
|
+
tag.div class: TailMerge.merge(default_classes + @classes) do
|
65
65
|
content
|
66
66
|
end
|
67
67
|
end
|
@@ -86,11 +86,7 @@ Run `bundle install` to install the gem.
|
|
86
86
|
|
87
87
|
## Usage
|
88
88
|
|
89
|
-
You can pass a string or an array of strings to the
|
90
|
-
|
91
|
-
Whatever you pass last will override whatever you pass first.
|
92
|
-
|
93
|
-
A string is returned for easy use in ERB.
|
89
|
+
You can pass either a string or an array of strings to the merge method. Values passed later override previous ones. The result is always a string, ready for use in ERB templates.
|
94
90
|
|
95
91
|
```ruby
|
96
92
|
TailMerge.merge %w[px-2 py-1 bg-red hover:bg-dark-red p-3 bg-[#B91C1C]]
|
@@ -106,6 +102,8 @@ TailMerge.merge "px-2 py-1 bg-red hover:bg-dark-red p-3 bg-[#B91C1C]"
|
|
106
102
|
|
107
103
|
You can create an instance of TailMerge and call `merge` on it instead of on the `TailMerge` class. This will cache the results of the merge.
|
108
104
|
|
105
|
+
This is useful in cases where you need to merge the same classes repeatedly, such as when rendering a list of the same component.
|
106
|
+
|
109
107
|
```ruby
|
110
108
|
tail_merge_instance = TailMerge.new
|
111
109
|
tail_merge_instance.merge %w[px-2 py-1 bg-red hover:bg-dark-red p-3 bg-[#B91C1C]]
|
@@ -120,30 +118,34 @@ tail_merge_instance.merge "px-2 py-1 bg-red hover:bg-dark-red p-3 bg-[#B91C1C]"
|
|
120
118
|
=> "hover:bg-dark-red p-3 bg-[#B91C1C]" # Read from cache, much faster!
|
121
119
|
```
|
122
120
|
|
123
|
-
This caching technique was inspired by [
|
121
|
+
This caching technique was inspired by [Tailwind Merge](https://github.com/dcastil/tailwind-merge).
|
124
122
|
|
125
123
|
## Benchmark
|
126
124
|
|
127
|
-
So how fast
|
125
|
+
So how fast is TailMerge?
|
128
126
|
|
129
|
-
I've benchmarked TailMerge with
|
127
|
+
I've benchmarked TailMerge with and without caching, and compared it to Tailwind Merge (also with and without caching). Here are the results:
|
130
128
|
|
131
129
|
```
|
132
130
|
user system total real
|
133
|
-
Rust: TailMerge.merge (all samples): 0.
|
134
|
-
Rust: Cached TailMerge.merge (all samples): 0.
|
135
|
-
Ruby: TailwindMerge each time (all samples):
|
136
|
-
Ruby:Cached TailwindMerge (all samples): 0.
|
131
|
+
Rust: TailMerge.merge (all samples): 0.371744 0.019642 0.391386 ( 0.391821)
|
132
|
+
Rust: Cached TailMerge.merge (all samples): 0.012976 0.000580 0.013556 ( 0.013560)
|
133
|
+
Ruby: TailwindMerge each time (all samples): 51.488919 0.225130 51.714049 ( 51.883713)
|
134
|
+
Ruby:Cached TailwindMerge (all samples): 0.019882 0.000166 0.020048 ( 0.020051)
|
137
135
|
```
|
138
136
|
|
139
|
-
As you can see TailMerge is much faster using pure Ruby to merge classes.
|
137
|
+
As you can see, TailMerge is much faster than using pure Ruby to merge classes.
|
140
138
|
|
141
139
|
The benchmark loops through an array of strings and arrays and merges them 1000 times.
|
142
140
|
|
143
141
|
The difference between the cached runs, obviously, is much smaller as we are basically benchmarking the cache lookup and not the actual merge.
|
144
142
|
|
145
|
-
In reality
|
143
|
+
In reality, you will not need to perform 1000 merges per page, and I suspect you'll be much closer to the non-cached runs.
|
146
144
|
|
147
145
|
## Contributing
|
148
146
|
|
149
147
|
Bug reports and pull requests are welcome on GitHub at https://github.com/abuisman/tail_merge . Merging will be done at my own pace and discretion.
|
148
|
+
|
149
|
+
## License
|
150
|
+
|
151
|
+
This gem is available as open source under under the MIT License.
|
data/benchmark/benchmark.rb
CHANGED
@@ -56,9 +56,6 @@ cached_merger = TailwindMerge::Merger.new
|
|
56
56
|
|
57
57
|
tail_merge_instance = TailMerge.new
|
58
58
|
|
59
|
-
# Normalize all samples to strings
|
60
|
-
normalized_samples = samples.map { |classes| classes.is_a?(Array) ? classes.join(' ') : classes }
|
61
|
-
|
62
59
|
puts "Benchmarking class merging strategies (whole set)..."
|
63
60
|
puts "-" * 50
|
64
61
|
puts
|
@@ -66,7 +63,7 @@ puts
|
|
66
63
|
Benchmark.bm(30) do |x|
|
67
64
|
x.report("Rust: TailMerge.merge (all samples):") do
|
68
65
|
1000.times do
|
69
|
-
|
66
|
+
samples.each do |classes|
|
70
67
|
TailMerge.merge(classes)
|
71
68
|
end
|
72
69
|
end
|
@@ -74,7 +71,7 @@ Benchmark.bm(30) do |x|
|
|
74
71
|
|
75
72
|
x.report("Rust: Cached TailMerge.merge (all samples):") do
|
76
73
|
1000.times do
|
77
|
-
|
74
|
+
samples.each do |classes|
|
78
75
|
tail_merge_instance.merge(classes)
|
79
76
|
end
|
80
77
|
end
|
@@ -82,7 +79,7 @@ Benchmark.bm(30) do |x|
|
|
82
79
|
|
83
80
|
x.report("Ruby: TailwindMerge each time (all samples):") do
|
84
81
|
1000.times do
|
85
|
-
|
82
|
+
samples.each do |classes|
|
86
83
|
TailwindMerge::Merger.new.merge(classes)
|
87
84
|
end
|
88
85
|
end
|
@@ -90,7 +87,7 @@ Benchmark.bm(30) do |x|
|
|
90
87
|
|
91
88
|
x.report("Ruby:Cached TailwindMerge (all samples):") do
|
92
89
|
1000.times do
|
93
|
-
|
90
|
+
samples.each do |classes|
|
94
91
|
cached_merger.merge(classes)
|
95
92
|
end
|
96
93
|
end
|
data/lib/tail_merge/version.rb
CHANGED