Update background image format to WebP for improved performance

aelassas · Dec 28, 2024 · e523863 · e523863
1 parent 7a10b1d
commit e523863
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 2 deletions.
diff --git a/frontend/index.html b/frontend/index.html
@@ -3,7 +3,8 @@
   <head>
     <meta charset="utf-8" />
     <link rel="icon" href="/favicon.ico" />
-    <link rel="preload" href="/cover.png" as="image" type="image/png" />
+    <!-- <link rel="preload" href="/cover.png" as="image" type="image/png" /> -->
+    <link rel="preload" href="/cover.webp" as="image" type="image/webp" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="description" content="BookCars Rental Service" />
     <title>Movin' In Rental Service</title>

diff --git a/frontend/public/cover.webp b/frontend/public/cover.webp
diff --git a/frontend/src/assets/css/home.css b/frontend/src/assets/css/home.css
@@ -40,7 +40,8 @@ div.home div.home-content div.video-background {
   width: 100%;
   top: 0;
   left: 0;
-  background-image: url('/cover.png');
+  /* background-image: url('/cover.png'); */
+  background-image: url('/cover.webp');
   background-repeat: no-repeat;
   background-size: cover;
   background-position: 50%;