diff options
Diffstat (limited to 'app/assets/javascripts/design_management/components/image.vue')
-rw-r--r-- | app/assets/javascripts/design_management/components/image.vue | 14 |
1 files changed, 13 insertions, 1 deletions
diff --git a/app/assets/javascripts/design_management/components/image.vue b/app/assets/javascripts/design_management/components/image.vue index e64ee4a5a34..8ab94cd2c4b 100644 --- a/app/assets/javascripts/design_management/components/image.vue +++ b/app/assets/javascripts/design_management/components/image.vue @@ -1,6 +1,8 @@ <script> import { GlIcon } from '@gitlab/ui'; import { throttle } from 'lodash'; +import { DESIGN_MARK_APP_START, DESIGN_MAIN_IMAGE_OUTPUT } from '~/performance/constants'; +import { performanceMarkAndMeasure } from '~/performance/utils'; export default { components: { @@ -39,7 +41,9 @@ export default { window.removeEventListener('resize', this.resizeThrottled, false); }, mounted() { - this.onImgLoad(); + if (!this.image) { + this.onImgLoad(); + } this.resizeThrottled = throttle(() => { // NOTE: if imageStyle is set, then baseImageSize @@ -53,6 +57,14 @@ export default { methods: { onImgLoad() { requestIdleCallback(this.setBaseImageSize, { timeout: 1000 }); + performanceMarkAndMeasure({ + measures: [ + { + name: DESIGN_MAIN_IMAGE_OUTPUT, + start: DESIGN_MARK_APP_START, + }, + ], + }); }, onImgError() { this.imageError = true; |