Welcome to mirror list, hosted at ThFree Co, Russian Federation.

gitlab.com/gitlab-org/gitlab-foss.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat (limited to 'doc/development/fe_guide/performance.md')
-rw-r--r--doc/development/fe_guide/performance.md44
1 files changed, 0 insertions, 44 deletions
diff --git a/doc/development/fe_guide/performance.md b/doc/development/fe_guide/performance.md
index 432e66bee33..5e8581663b6 100644
--- a/doc/development/fe_guide/performance.md
+++ b/doc/development/fe_guide/performance.md
@@ -366,50 +366,6 @@ browser's developer console from any page in GitLab.
parsed, `DOMContentLoaded` is not needed to bootstrap applications because all
the DOM nodes are already at our disposal.
-- **JavaScript that relies on CSS for calculations should use [`waitForCSSLoaded()`](https://gitlab.com/gitlab-org/gitlab/-/blob/master/app/assets/javascripts/helpers/startup_css_helper.js#L34):**
- GitLab uses [Startup.css](https://gitlab.com/gitlab-org/gitlab/-/merge_requests/38052)
- to improve page performance. This can cause issues if JavaScript relies on CSS
- for calculations. To fix this the JavaScript can be wrapped in the
- [`waitForCSSLoaded()`](https://gitlab.com/gitlab-org/gitlab/-/blob/master/app/assets/javascripts/helpers/startup_css_helper.js#L34)
- helper function.
-
- ```javascript
- import initMyWidget from './my_widget';
- import { waitForCSSLoaded } from '~/helpers/startup_css_helper';
-
- waitForCSSLoaded(initMyWidget);
- ```
-
- Note that `waitForCSSLoaded()` methods supports receiving the action in different ways:
-
- - With a callback:
-
- ```javascript
- waitForCSSLoaded(action)
- ```
-
- - With `then()`:
-
- ```javascript
- waitForCSSLoaded().then(action);
- ```
-
- - With `await` followed by `action`:
-
- ```javascript
- await waitForCSSLoaded;
- action();
- ```
-
- For example, see how we use this in [`app/assets/javascripts/pages/projects/graphs/charts/index.js`](https://gitlab.com/gitlab-org/gitlab/-/commit/5e90885d6afd4497002df55bf015b338efcfc3c5#02e81de37f5b1716a3ef3222fa7f7edf22c40969_9_8):
-
- ```javascript
- waitForCSSLoaded(() => {
- const languagesContainer = document.getElementById('js-languages-chart');
- //...
- });
- ```
-
- **Supporting Module Placement:**
- If a class or a module is _specific to a particular route_, try to locate
it close to the entry point in which it is used. For instance, if