ENGCOM-8925: Add WEBP + AVIF Support by default #32400

Author: gabrieldagama

nginx.conf.sample

@@ -112,7 +112,7 @@ location /static/ {
         rewrite ^/static/version\d*/(.*)$ /static/$1 last;
     }
 
-    location ~* \.(ico|jpg|jpeg|png|gif|svg|js|css|swf|eot|ttf|otf|woff|woff2|html|json)$ {
+    location ~* \.(ico|jpg|jpeg|png|gif|svg|svgz|webp|avif|avifs|js|css|eot|ttf|otf|woff|woff2|html|json|webmanifest)$ {
         add_header Cache-Control "public";
         add_header X-Frame-Options "SAMEORIGIN";
         expires +1y;
@@ -166,7 +166,7 @@ location /media/ {
         deny all;
     }
 
-    location ~* \.(ico|jpg|jpeg|png|gif|svg|js|css|swf|eot|ttf|otf|woff|woff2)$ {
+    location ~* \.(ico|jpg|jpeg|png|gif|svg|svgz|webp|avif|avifs|js|css|eot|ttf|otf|woff|woff2)$ {
         add_header Cache-Control "public";
         add_header X-Frame-Options "SAMEORIGIN";
         expires +1y;

pub/media/.htaccess

@@ -52,9 +52,12 @@ AddType image/gif gif
 AddType image/png png
 AddType image/jpeg jpg
 AddType image/jpeg jpeg
+AddType image/webp webp
+AddType image/avif avif
+AddType image/avif-sequence avifs
 
 # SVG
-AddType image/svg+xml svg
+AddType image/svg+xml svg svgz
 
 # Fonts
 AddType application/vnd.ms-fontobject eot
@@ -63,9 +66,6 @@ AddType application/x-font-otf otf
 AddType application/x-font-woff woff
 AddType application/font-woff2 woff2
 
-# Flash
-AddType application/x-shockwave-flash swf
-
 # Archives and exports
 AddType application/zip gzip
 AddType application/x-gzip gz gzip
@@ -75,7 +75,7 @@ AddType application/xml xml
 
 <IfModule mod_headers.c>
 
-    <FilesMatch .*\.(ico|jpg|jpeg|png|gif|svg|js|css|swf|eot|ttf|otf|woff|woff2)$>
+    <FilesMatch .*\.(ico|jpg|jpeg|png|gif|svg|svgz|webp|avif|avifs|js|css|eot|ttf|otf|woff|woff2)$>
         Header append Cache-Control public
     </FilesMatch>
 
@@ -111,15 +111,18 @@ AddType application/xml xml
     ExpiresByType text/css "access plus 1 year"
     ExpiresByType application/javascript "access plus 1 year"
 
-    # Favicon, images, flash
-    <FilesMatch \.(ico|gif|png|jpg|jpeg|swf|svg)$>
+    # Favicon, images
+    <FilesMatch \.(ico|gif|png|jpg|jpeg|svg|svgz|webp|avif|avifs)$>
         ExpiresDefault "access plus 1 year"
     </FilesMatch>
     ExpiresByType image/gif "access plus 1 year"
     ExpiresByType image/png "access plus 1 year"
     ExpiresByType image/jpg "access plus 1 year"
     ExpiresByType image/jpeg "access plus 1 year"
     ExpiresByType image/svg+xml "access plus 1 year"
+    ExpiresByType image/webp "access plus 1 year"
+    ExpiresByType image/avif "access plus 1 year"
+    ExpiresByType image/avif-sequence "access plus 1 year"
 
     # Fonts
     <FilesMatch \.(eot|ttf|otf|svg|woff|woff2)$>

pub/static/.htaccess

@@ -37,7 +37,6 @@ AddType application/javascript js jsonp
 AddType application/json json
 
 # HTML
-
 AddType text/html html
 
 # CSS
@@ -49,9 +48,12 @@ AddType image/gif gif
 AddType image/png png
 AddType image/jpeg jpg
 AddType image/jpeg jpeg
+AddType image/webp webp
+AddType image/avif avif
+AddType image/avif-sequence avifs
 
 # SVG
-AddType image/svg+xml svg
+AddType image/svg+xml svg svgz
 
 # Fonts
 AddType application/vnd.ms-fontobject eot
@@ -60,8 +62,8 @@ AddType application/x-font-otf otf
 AddType application/x-font-woff woff
 AddType application/font-woff2 woff2
 
-# Flash
-AddType application/x-shockwave-flash swf
+# Manifest
+AddType application/manifest+json webmanifest
 
 # Archives and exports
 AddType application/zip gzip
@@ -72,7 +74,7 @@ AddType application/xml xml
 
 <IfModule mod_headers.c>
 
-    <FilesMatch .*\.(ico|jpg|jpeg|png|gif|svg|js|css|swf|eot|ttf|otf|woff|woff2|html|json)$>
+    <FilesMatch .*\.(ico|jpg|jpeg|png|gif|svg|webp|avif|avifs|js|css|eot|ttf|otf|woff|woff2|html|json|webmanifest)$>
         Header append Cache-Control public
     </FilesMatch>
 
@@ -100,6 +102,12 @@ AddType application/xml xml
     ExpiresByType application/zip "access plus 0 seconds"
     ExpiresByType application/x-gzip "access plus 0 seconds"
     ExpiresByType application/x-bzip2 "access plus 0 seconds"
+    
+    # Manifest
+    <FilesMatch \.(webmanifest)$>
+        ExpiresDefault "access plus 0 seconds"
+    </FilesMatch>
+    ExpiresByType application/manifest+json "access plus 0 seconds"
 
     # CSS, JavaScript, html
     <FilesMatch \.(css|js|html|json)$>
@@ -111,14 +119,17 @@ AddType application/xml xml
     ExpiresByType application/json "access plus 1 year"
 
     # Favicon, images, flash
-    <FilesMatch \.(ico|gif|png|jpg|jpeg|swf|svg)$>
+    <FilesMatch \.(ico|gif|png|jpg|jpeg|svg|svgz|webp|avif|avifs)$>
         ExpiresDefault "access plus 1 year"
     </FilesMatch>
     ExpiresByType image/gif "access plus 1 year"
     ExpiresByType image/png "access plus 1 year"
     ExpiresByType image/jpg "access plus 1 year"
     ExpiresByType image/jpeg "access plus 1 year"
     ExpiresByType image/svg+xml "access plus 1 year"
+    ExpiresByType image/webp "access plus 1 year"
+    ExpiresByType image/avif "access plus 1 year"
+    ExpiresByType image/avif-sequence "access plus 1 year"
 
     # Fonts
     <FilesMatch \.(eot|ttf|otf|svg|woff|woff2)$>
@@ -129,5 +140,7 @@ AddType application/xml xml
     ExpiresByType application/x-font-otf "access plus 1 year"
     ExpiresByType application/x-font-woff "access plus 1 year"
     ExpiresByType application/font-woff2 "access plus 1 year"
+    ExpiresByType font/opentype "access plus 1 year"
+    ExpiresByType font/truetype "access plus 1 year"
 
 </IfModule>