rtfeldman / elm-css

Typed CSS in Elm.
https://package.elm-lang.org/packages/rtfeldman/elm-css/latest
BSD 3-Clause "New" or "Revised" License
1.23k stars 196 forks source link

Optimize string concatination. #544

Closed robinheghan closed 2 years ago

robinheghan commented 2 years ago

I recently setup an elm-css benchmark based on code from our production code base, and after profiling said benchmark, I discovered that string concatination and hashing is where elm-css spends most of its time.

This PR improves the performance of elm-css by combining several map+join and filter+join operations into a single operation. It also replaces certain String.join "" calls with normal string concatination using the ++ operator.

From my testing, this improves performance by 15-20% depending on the browser being run.

The benchmark I ran can be found here: https://github.com/robinheghan/elm-css-playground

Check out the reduce-string-joins branch to test this particular optimization in isolation.

robinheghan commented 2 years ago

I believe this branch is ready to be merged.

I haven't changed mapJoin calls to String.concat, because I'm very certain it would be slower. String.concat does a String.join "", which again converts the List to a JsArray. It would also require that we'd perform the map as a seperate action, which performs a List.foldr under the hood.

mapJoin iterates the list directly, which only requires iterating the list once.