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