add section for universal code

1 files changed, 9 insertions, 5 deletions

diff --git a/doc/development/fe_guide/performance.md b/doc/development/fe_guide/performance.md
index 82e110ba8e3..70cd79ecb3a 100644
--- a/doc/development/fe_guide/performance.md
+++ b/doc/development/fe_guide/performance.md
@@ -47,6 +47,15 @@ properties once, and handle the actual animation with transforms.
 
 ## Reducing Asset Footprint
 
+### Universal code
+
+Code that is contained within `main.js` and `commons/index.js` are loaded and
+run on _all_ pages. **DO NOT ADD** anything to these files unless it is truly
+needed _everywhere_. This includes ubiquitous libraries like `vue`, `axios`,
+and `jQuery`, as well as code for the main navigation and sidebar. Where
+possible we should aim to remove modules from these bundles to reduce our code
+footprint.
+
 ### Page-specific JavaScript
 
 Webpack has been configured to automatically generate entry point bundles based
@@ -75,11 +84,6 @@ In addition to these page-specific bundles, the code within `main.js` and
   can find this out by checking `document.body.dataset.page` while on any page
   within gitlab.com.
 
-- Since `main.js` and `commons/index.js` are imported on all pages, it is
-  important to not add anything to these bundles unless it is truly needed
-  _everywhere_.  This includes ubiquitous libraries like `vue`, `axios`, and
-  `jQuery`, as well as code for the main navigation and sidebar.
-
 - Page-specific javascript entry points should be as lite as possible.  These
   files are exempt from tests, and should be used primarily for instantiation
   and dependency injection of classes and methods that live in modules outside