docs(performance): Add performance config documentation

content/configuration/index.md

@@ -282,6 +282,19 @@ T> Notice that throughout the configuration we use Node's built-in [path module]
     </details>
   },
 
+  [performance](/configuration/performance): {
+    <details><summary>[hints](/configuration/performance#performance-hints): "warning", // enum </summary>
+    [hints](/configuration/performance#performance-hints): "error", // emit errors for perf hints
+    [hints](/configuration/performance#performance-hints): false, // turn off perf hints
+    </details>
+    [maxAssetSize](/configuration/performance#performance-maxassetsize): 200000, // int (in bytes),
+    [maxEntrypointSize](/configuration/performance#performance-maxentrypointsize): 400000, // int (in bytes)
+    [assetFilter](/configuration/performance#performance-assetfilter): function(assetFilename) { 
+      // Function predicate that provides asset filenames
+      return assetName.endsWith('.css') || assetName.endsWith('.js');
+    }
+  },
+
   <details><summary>[devtool](/configuration/devtool): "source-map", // enum </summary>
   [devtool](/configuration/devtool): "inline-source-map", // inlines SourceMap into orginal file
   [devtool](/configuration/devtool): "eval-source-map", // inlines SourceMap per module
@@ -338,7 +351,8 @@ T> Notice that throughout the configuration we use Node's built-in [path module]
     // ...
   ],
   // list of additional plugins
-
+
+
   <details><summary>/* Advanced configuration (click to show) */</summary>
 
   [resolveLoader](/configuration/resolve#resolveloader): { /* same as resolve */ }

content/configuration/performance.md

@@ -0,0 +1,97 @@
+---
+title: Performance
+sort: 14
+contributors:
+  - thelarkinn
+---
+
+These options allows you to control how webpack notifies you of assets and entrypoints that exceed a specific file limit. 
+This feature was inspired by the idea of [webpack Performance Budgets](https://github.com/webpack/webpack/issues/3216).
+
+## `performance`
+
+`object`
+
+Configure how performance hints are shown. For example if you have an asset that is over 250kb, webpack will emit a warning notifiying you of this.
+
+
+## `performance.hints`
+
+`boolean | "error" | "warning"`
+
+Turns hints on/off. In addition, tells webpack to throw either an error or a warning when hints are found. This property is set to `"warning"` by default.
+
+Given an asset is created that is over 250kb:
+
+```js
+performance: {
+  hints: false
+}
+```
+
+No hint warnings or errors are shown.
+
+```js
+performance: {
+  hints: "warning"
+}
+```
+
+A warning will be displayed notifying you of a large asset. We recommend something like this for development environments.
+
+```js
+performance: {
+  hints: "error"
+}
+```
+
+An error will be displayed notifying you of a large asset. We recommend using `hints: "error"` during production builds to help prevent deploying production bundles that are too large, impacting webpage performance. 
+
+## `performance.maxEntrypointSize`
+
+`int`
+
+An entrypoint represents all assets that would be utilized during initial load time for a specific entry. This option controls when webpack should emit performance hints based on the maximum entrypoint size. The default value is `250000` (bytes).
+
+```js
+performance: {
+  maxEntrypointSize: 400000
+}
+```
+
+## `performance.maxAssetSize`
+
+`int`
+
+An asset is any emitted file from webpack. This option controls when webpack emits a performance hint based on individual asset size. The default value is `250000` (bytes).
+
+
+```js
+performance: {
+  maxAssetSize: 100000
+}
+```
+
+## `performance.assetFilter`
+
+`Function`
+
+This property allows webpack to control what files are used to calculate performance hints. The default function is seen below: 
+
+```js
+function(assetFilename) {
+	return !(/\.map$/.test(assetFilename))
+};
+```
+
+You can override this property by passing your own function in: 
+
+```js 
+performance: {
+  assetFilter: function(assetFilename) {
+    return assetFilename.endsWith('.js');
+  }
+}
+```
+
+The example above will only give you performance hints based on `.js` files.