⚡ Switch image format from PNG to WEBP to reduce file size

ccamel · Jul 19, 2024 · c3f081f · c3f081f
1 parent 65a81d4
commit c3f081f
Show file tree

Hide file tree

Showing 30 changed files with 5 additions and 5 deletions.
diff --git a/src/App/View.elm b/src/App/View.elm
@@ -177,7 +177,7 @@ showcase { flags } num page =
         [ div [ class "column is-12 showcase" ]
             [ article [ class "columns featured" ]
                 ([ div [ class "column is-7 showcase-img" ]
-                    [ img [ src <| interpolate "{0}{1}.png" [ flags.basePath, pageHash page ], width 450 ]
+                    [ img [ src <| interpolate "{0}{1}.webp" [ flags.basePath, pageHash page ], width 450 ]
                         []
                     ]
                  , div [ class "column is-5 featured-content va" ]

diff --git a/src/Page/About.elm b/src/Page/About.elm
@@ -78,19 +78,19 @@ view (Model model) =
         content =
             [ { title = "Simple"
               , text = "Fairly simple and understandable. Every showcase is implemented in a single elm file."
-              , img = "about-simple.png"
+              , img = "about-simple.webp"
               }
             , { title = "Exploratory"
               , text = "Highlight some aspects of the elm language, like immutability, reactiveness, performance and interoperability with other JS libraries. Explore some architectural/design patterns around reactive static/serverless SPA."
-              , img = "about-exploratory.png"
+              , img = "about-exploratory.webp"
               }
             , { title = "Playable"
               , text = "As much as possible, provides a useful and functional content."
-              , img = "about-playable.png"
+              , img = "about-playable.webp"
               }
             , { title = "Scalable"
               , text = "The structure of the playground is designed to easily accommodate additional examples and showcases. Contributors can effortlessly expand the repository, ensuring it remains a relevant and up-to-date resource for learners and enthusiasts."
-              , img = "about-scalable.png"
+              , img = "about-scalable.webp"
               }
             ]
     in

diff --git a/static/about-exploratory.png b/static/about-exploratory.png
diff --git a/static/about-exploratory.webp b/static/about-exploratory.webp
diff --git a/static/about-playable.png b/static/about-playable.png
diff --git a/static/about-playable.webp b/static/about-playable.webp
diff --git a/static/about-scalable.png b/static/about-scalable.png
diff --git a/static/about-scalable.webp b/static/about-scalable.webp
diff --git a/static/about-simple.png b/static/about-simple.png
diff --git a/static/about-simple.webp b/static/about-simple.webp
diff --git a/static/about.png b/static/about.png
diff --git a/static/about.webp b/static/about.webp
diff --git a/static/asteroids.png b/static/asteroids.png
diff --git a/static/asteroids.webp b/static/asteroids.webp
diff --git a/static/calc.png b/static/calc.png
diff --git a/static/calc.webp b/static/calc.webp
diff --git a/static/dapp.png b/static/dapp.png
diff --git a/static/dapp.webp b/static/dapp.webp
diff --git a/static/digital-clock.png b/static/digital-clock.png
diff --git a/static/digital-clock.webp b/static/digital-clock.webp
diff --git a/static/lissajous.png b/static/lissajous.png
diff --git a/static/lissajous.webp b/static/lissajous.webp
diff --git a/static/maze.png b/static/maze.png
diff --git a/static/maze.webp b/static/maze.webp
diff --git a/static/physics-engine.png b/static/physics-engine.png
diff --git a/static/physics-engine.webp b/static/physics-engine.webp
diff --git a/static/sound-wave-toggle.png b/static/sound-wave-toggle.png
diff --git a/static/sound-wave-toggle.webp b/static/sound-wave-toggle.webp
diff --git a/static/term.png b/static/term.png
diff --git a/static/term.webp b/static/term.webp