diff --git a/.ci/azure-pipelines.yml b/.ci/azure-pipelines.yml
index 7505f9ab5d..48f042d729 100644
--- a/.ci/azure-pipelines.yml
+++ b/.ci/azure-pipelines.yml
@@ -16,19 +16,18 @@ jobs:
   - job: build
     displayName: 'Build'
 
-    dependsOn: lint
-    condition: succeeded()
-
     pool:
       vmImage: 'ubuntu-latest'
 
     strategy:
       matrix:
-        bundle:
-          BuildConfiguration: Bundle
-        standalone:
-          BuildConfiguration: Standalone
-      maxParallel: 2
+        Development:
+          BuildConfiguration: development
+        Production:
+          BuildConfiguration: production
+        Standalone:
+          BuildConfiguration: standalone
+      maxParallel: 3
 
     steps:
     - task: NodeTool@0
@@ -36,24 +35,42 @@ jobs:
       inputs:
         versionSpec: '10.x'
 
-    - script: 'yarn install'
-      displayName: 'Install Dependencies'
+    - task: Cache@2
+      displayName: 'Check Cache'
+      inputs:
+        key: 'yarn | yarn.lock'
+        path: 'node_modules'
+        cacheHitVar: CACHE_RESTORED
 
-    - script: 'yarn build'
-      displayName: 'Build'
+    - script: 'yarn install --frozen-lockfile'
+      displayName: 'Install Dependencies'
+      condition: ne(variables.CACHE_RESTORED, 'true')
+
+    - script: 'yarn build:development'
+      displayName: 'Build Development'
+      condition: eq(variables['BuildConfiguration'], 'development')
+
+    - script: 'yarn build:production'
+      displayName: 'Build Bundle'
+      condition: eq(variables['BuildConfiguration'], 'production')
+
+    - script: 'yarn build:standalone'
+      displayName: 'Build Standalone'
+      condition: eq(variables['BuildConfiguration'], 'standalone')
 
     - script: 'test -d dist'
       displayName: 'Check Build'
 
-    - script: 'yarn pack --filename jellyfin-web.tgz'
-      displayName: 'Bundle Release'
+    - script: 'mv dist jellyfin-web'
+      displayName: 'Rename Directory'
+      condition: succeeded()
 
     - task: PublishPipelineArtifact@1
       displayName: 'Publish Release'
       condition: succeeded()
       inputs:
-        targetPath: '$(Build.SourcesDirectory)/jellyfin-web.tgz'
-        artifactName: 'jellyfin-web'
+        targetPath: '$(Build.SourcesDirectory)/jellyfin-web'
+        artifactName: 'jellyfin-web-$(BuildConfiguration)'
 
   - job: lint
     displayName: 'Lint'
@@ -67,8 +84,16 @@ jobs:
       inputs:
         versionSpec: '10.x'
 
-    - script: 'yarn install'
+    - task: Cache@2
+      displayName: 'Check Cache'
+      inputs:
+        key: 'yarn | yarn.lock'
+        path: 'node_modules'
+        cacheHitVar: CACHE_RESTORED
+
+    - script: 'yarn install --frozen-lockfile'
       displayName: 'Install Dependencies'
+      condition: ne(variables.CACHE_RESTORED, 'true')
 
     - script: 'yarn run lint'
       displayName: 'Run ESLint'
diff --git a/README.md b/README.md
index 4ee78ed786..e2aac6b155 100644
--- a/README.md
+++ b/README.md
@@ -50,25 +50,32 @@ Jellyfin Web is the frontend used for most of the clients available for end user
 ### Getting Started
 
 1. Clone or download this repository.
+
    ```sh
    git clone https://github.com/jellyfin/jellyfin-web.git
    cd jellyfin-web
    ```
+
 2. Install build dependencies in the project directory.
+
    ```sh
    yarn install
    ```
 
 3. Run the web client with webpack for local development.
+
    ```sh
    yarn serve
    ```
 
 4. Build the client with sourcemaps.
-   '''sh
-   yarn
-   '''
-   Or without sourcemaps
-   '''sh
-   yarn --production
-   '''
\ No newline at end of file
+
+   ```sh
+   yarn build:development
+   ```
+
+   You can build a nginx compatible version as well.
+
+   ```sh
+   yarn build:standalone
+   ```
\ No newline at end of file
diff --git a/gulpfile.js b/gulpfile.js
index f49805d346..ca6cf36dd2 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -10,7 +10,7 @@ const htmlmin = require('gulp-htmlmin');
 const imagemin = require('gulp-imagemin');
 const sourcemaps = require('gulp-sourcemaps');
 const mode = require('gulp-mode')({
-    modes: ["development", "bundle", "standalone"],
+    modes: ["development", "production"],
     default: "development",
     verbose: false
 });
@@ -22,7 +22,7 @@ const sass = require('gulp-sass');
 sass.compiler = require('node-sass')
 
 
-if (mode.bundle() || mode.standalone()) {
+if (mode.production()) {
     var config = require('./webpack.prod.js');
 } else {
     var config = require('./webpack.dev.js');
@@ -91,15 +91,14 @@ function css() {
 
 function html() {
     return src(['src/**/*.html', '!src/index.html'], { base: './src/' })
-        .pipe(mode.bundle(htmlmin({ collapseWhitespace: true })))
-        .pipe(mode.standalone(htmlmin({ collapseWhitespace: true })))
+        .pipe(mode.production(htmlmin({ collapseWhitespace: true })))
         .pipe(dest('dist/'))
         .pipe(browserSync.stream());
 }
 
 function images() {
     return src(['src/**/*.png', 'src/**/*.jpg', 'src/**/*.gif', 'src/**/*.svg'], { base: './src/' })
-        .pipe(imagemin())
+        .pipe(mode.production(imagemin()))
         .pipe(dest('dist/'))
         .pipe(browserSync.stream());
 }
@@ -120,4 +119,5 @@ function injectBundle() {
 }
 
 exports.default = series(clean, parallel(javascript, webpack, css, html, images, copy), injectBundle)
-exports.serve = series(exports.default, standalone, serve)
+exports.standalone = series(exports.default, standalone)
+exports.serve = series(exports.standalone, serve)
diff --git a/package.json b/package.json
index 90d463fb4d..90cfa954a8 100644
--- a/package.json
+++ b/package.json
@@ -90,9 +90,10 @@
   ],
   "scripts": {
     "serve": "gulp serve",
-    "build": "gulp --bundle",
-    "build standalone": "gulp --standalone",
-    "build development": "gulp",
+    "prepare": "gulp --production",
+    "build:development": "gulp --development",
+    "build:production": "gulp --production",
+    "build:standalone": "gulp standalone --development",
     "lint": "eslint \"src\"",
     "stylelint": "stylelint \"src/**/*.css\""
   }