diff --git a/.htaccess b/.htaccess
index 53149128..c81172cb 100644
--- a/.htaccess
+++ b/.htaccess
@@ -16,7 +16,7 @@
   RewriteRule ^(.*)/$ /$1 [L,R=301]
 
   # Whitelist only index.php, robots.txt, and some special routes
-  RewriteRule ^(?!($|index\.php|robots\.txt|(public|api)/|remote|api-docs)) - [R=404,L]
+  RewriteRule ^(?!($|index\.php|robots\.txt|(public|api)/|remote|api-docs|sw\.js)) - [R=404,L]
 
   # Handle Front Controller...
   RewriteCond %{REQUEST_FILENAME} !-d
diff --git a/public/manifest.json b/public/manifest.json
index f00b792a..e02a92dc 100644
--- a/public/manifest.json
+++ b/public/manifest.json
@@ -2,7 +2,7 @@
     "name": "Koel",
     "start_url": "/",
     "display": "standalone",
-    "orientation": "portrait",
+    "orientation": "landscape",
     "icons": [{
       "src": "/public/img/icon.png",
       "sizes": "192x192",
diff --git a/sw.js b/sw.js
new file mode 100644
index 00000000..c5148ed9
--- /dev/null
+++ b/sw.js
@@ -0,0 +1,19 @@
+importScripts('https://storage.googleapis.com/workbox-cdn/releases/4.0.0/workbox-sw.js')
+
+workbox.routing.registerRoute(
+  new RegExp('.*\.js'),
+  new workbox.strategies.NetworkFirst()
+)
+
+workbox.routing.registerRoute(
+  /\.(?:png|jpg|jpeg|svg|gif|eot|ttf|woff2?|otf)$/,
+  new workbox.strategies.CacheFirst({
+    cacheName: 'image-font-cache',
+    plugins: [
+      new workbox.expiration.Plugin({
+        maxEntries: 20,
+        maxAgeSeconds: 7 * 24 * 60 * 60
+      })
+    ]
+  })
+)