Feature request: batch attributes together
staeter opened this issue · 2 comments
staeter commented
It would be great to be able to batch attributes together into a single one. It is a seemingly small feature but it would avoid quite a bit of overhead when whiting custom and composed attributes.
Examples:
-- max browser compatibility
gradientBackground : Element.Attribute msg
gradientBackground =
[ Html.Attributes.style "background" "rgb(2,0,36)"
, Html.Attributes.style "background" "-moz-linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%)"
, Html.Attributes.style "background" "-webkit-linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%)"
, Html.Attributes.style "background" "linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%)"
, Html.Attributes.style "filter" "progid:DXImageTransform.Microsoft.gradient(startColorstr="#020024",endColorstr="#00d4ff",GradientType=1)"
]
|> List.map Element.htmlAttribute
|> Element.Attribute.batch
view =
Element.el
[ ...
, gradientBackground
]
(...)
or
mixBlendColor : Element.Attribute msg
mixBlendColor =
[ Element.htmlAttribute (Html.Attributes.style "mix-blend-mode" "color-burn")
, Element.Background.color (Element.rgb 1 1 0)
]
|> Element.Attribute.batch
view =
Element.el
[ ...
, mixBlendColor
]
(...)
instead of
gradientBackground : List (Element.Attribute msg)
view =
Element.el
( [ ...
]
++ gradientBackground
)
(...)
and
mixBlendColor : List (Element.Attribute msg)
view =
Element.el
( [ ...
]
++ mixBlendColor
)
(...)
a-teammate commented
+1 that would really clean up a lot of code and make some decisions easier.
a-teammate commented
I am not sure if this is relevant for a possible implementation, just saw there is the same for Html: https://package.elm-lang.org/packages/arowM/html/latest/
I guess it would be easier to just convert Element.Attribute to a have two cases: Batched and Single.