ui: speed up compute instance listing by yadvr · Pull Request #7911 · apache/cloudstack

yadvr · 2023-08-25T07:23:35Z

The default listVirtualMachinesMetrics APIs assumings details=all which isn't really used in the list view. By changing this to a subset of details, we can see gains upto 10x in listing speed in the UI. When moving to the resource/detail view of the UI, don't pass state or details so all the details of the instance are returned.

Possibly fixes#7910

In the screenshot below, we can see passing details=min, and other combinations show significant reduction in network time (from 300-400ms to 20-40ms)

Types of changes

Breaking change (fix or feature that would cause existing functionality to change)
New feature (non-breaking change which adds functionality)
Bug fix (non-breaking change which fixes an issue)
Enhancement (improves an existing feature and functionality)
Cleanup (Code refactoring and cleanup, that may add test cases)

The default listVirtualMachinesMetrics APIs assumings details=all which isn't really used in the list view. By changing this to a subset of details, we can see gains upto 10x in listing speed in the UI. When moving to the resource/detail view of the UI, don't pass state or details so `all` the details of the instance are returned. Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>

yadvr · 2023-08-25T07:24:23Z

@blueorangutan ui

blueorangutan · 2023-08-25T07:25:03Z

@rohityadavcloud a Jenkins job has been kicked to build UI QA env. I'll keep you posted as I make progress.

yadvr · 2023-08-25T07:25:10Z

- var params = {}
+ var params = { details: 'servoff,tmpl,nics' }
 if (store.getters.metrics) {
- params = { state: 'running' }


I've removed running as otherwise metrics doesn't return all VMs in the list. One can select VM state explicitly in the compute/instance page if they want.

just realised I can remove state from the params

yadvr · 2023-08-25T07:25:16Z

 export const DARK_MODE = 'DARK_MODE'
 export const VUE_VERSION = 'VUE_VERSION'
 export const CUSTOM_COLUMNS = 'CUSTOM_COLUMNS'
+export const RELOAD_ALL_PROJECTS = 'RELOAD_ALL_PROJECTS'


This fixes a warning

yadvr · 2023-08-25T07:25:47Z

+ var params = { details: 'servoff,tmpl,nics' }
 if (store.getters.metrics) {
- params = { state: 'running' }
+ params = { details: 'servoff,tmpl,nics,stats' }


VM stats in the API response can cause 5-10x delay compared to normal list API response

is tmpl needed in the details? or stats?

my concern is opposite to @DaanHoogland :-D
is 'servoff,tmpl,nics' or servoff,tmpl,nics,stats enough for UI ?

Yes, these are enough just for list view (table view); the stats are only needed when the metrics button is clicked. For the resource view, we delete the params.details, so by default details=all is used when listing a single VM.

@weizhouapache @DaanHoogland
I tested this again both as root admin and normal user account; for VMs and templates with and without resource icons; these are enough details to render the list view (table); when the user clicks any VM/instance, then we call the API remove the details and all details are listed/used in the resource view. While not ideal, this speeds up the listing.

great, thanks @rohityadavcloud
I will test it

blueorangutan · 2023-08-25T07:37:56Z

UI build: ✔️
Live QA URL: https://qa.cloudstack.cloud/simulator/pr/7911 (QA-JID-169)

weizhouapache · 2023-08-25T07:41:45Z

+ if (['listVirtualMachinesMetrics'].includes(this.apiName) && this.dataView) {
+ delete params.state
+ delete params.details
+ }


@rohityadavcloud
can you explain why state and details are removed ?
all others look good

These are added by the router config, I'll ping you on that code; so we must remove if the keys exists for dataView (or resource view, when only one item is being listed such as the VM)

DaanHoogland

code looks good. I can't judge the performance gain in qa, but am relying on the author in this case.

DaanHoogland · 2023-08-25T07:43:55Z

+ var params = { details: 'servoff,tmpl,nics' }
 if (store.getters.metrics) {
- params = { state: 'running' }
+ params = { details: 'servoff,tmpl,nics,stats' }


is tmpl needed in the details? or stats?

yadvr · 2023-08-25T11:32:13Z

 resourceType: 'UserVm',
 params: () => {
- var params = {}
+ var params = { details: 'servoff,tmpl,nics' }


@weizhouapache because of these params, details and state...

yadvr · 2023-08-25T11:34:20Z

 }

+ if (['listVirtualMachinesMetrics'].includes(this.apiName) && this.dataView) {
+ delete params.details


we remove the details as it may not be all, and set for the list view (tabular view)

codecov · 2023-08-25T11:35:38Z

Codecov Report

Merging #7911 (b4629ad) into 4.18 (3c38ed7) will decrease coverage by 0.01%.
Report is 4 commits behind head on 4.18.
The diff coverage is n/a.

❗ Current head b4629ad differs from pull request most recent head c10873e. Consider uploading reports for the commit c10873e to get more accurate results

@@ Coverage Diff @@## 4.18 #7911 +/- ##
============================================
- Coverage 13.06% 13.06% -0.01% - Complexity 9088 9091 +3 
============================================
Files 2720 2720 Lines 257391 257415 +24 Branches 40130 40136 +6 ============================================
Hits 33621 33621 - Misses 219548 219569 +21 - Partials 4222 4225 +3

see 6 files with indirect coverage changes

📣 We’re building smart automated test selection to slash your CI/CD build times. Learn more

yadvr · 2023-08-25T11:43:29Z

@blueorangutan ui

blueorangutan · 2023-08-25T11:44:03Z

@rohityadavcloud a Jenkins job has been kicked to build UI QA env. I'll keep you posted as I make progress.

blueorangutan · 2023-08-25T11:56:25Z

UI build: ✔️
Live QA URL: https://qa.cloudstack.cloud/simulator/pr/7911 (QA-JID-170)

weizhouapache

code lgtm

the display is almost identical to the original page

without this PR

with this PR

dseralathan · 2024-02-12T23:35:02Z

the VM search give exact VM and is not changing to the first VM in list after we exclude state,IP of VM at filter in field

boring-cyborgBot added the component:UI label Aug 25, 2023

yadvr added this to the 4.18.1.0 milestone Aug 25, 2023

yadvr requested review from DaanHoogland, Pearl1594, shwstppr and weizhouapache August 25, 2023 07:23

yadvr commented Aug 25, 2023
View reviewed changes

weizhouapache reviewed Aug 25, 2023
View reviewed changes

DaanHoogland approved these changes Aug 25, 2023
View reviewed changes

weizhouapache linked an issue Aug 25, 2023 that may be closed by this pull request
GUI - search instance always give the first VM name and GUI is very slow #7910
Closed

Pearl1594 approved these changes Aug 25, 2023
View reviewed changes

yadvr commented Aug 25, 2023
View reviewed changes

Update AutogenView.vue
c10873e

yadvr commented Aug 25, 2023
View reviewed changes

yadvr requested a review from weizhouapache August 25, 2023 11:40

weizhouapache approved these changes Aug 25, 2023
View reviewed changes

weizhouapache merged commit 93bd5b7 into apache:4.18Aug 25, 2023

weizhouapache mentioned this pull request Aug 25, 2023
GUI - search instance always give the first VM name and GUI is very slow #7910
Closed

DaanHoogland deleted the list-vm-speedup branch August 25, 2023 12:04

Uh oh!

Conversation

yadvr commented Aug 25, 2023• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Types of changes

Uh oh!

yadvr commented Aug 25, 2023

Uh oh!

blueorangutan commented Aug 25, 2023

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

blueorangutan commented Aug 25, 2023

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

DaanHoogland left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

yadvrAug 25, 2023• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

codecovBot commented Aug 25, 2023

Codecov Report

Uh oh!

yadvr commented Aug 25, 2023

Uh oh!

blueorangutan commented Aug 25, 2023

Uh oh!

blueorangutan commented Aug 25, 2023

Uh oh!

weizhouapache left a comment

Choose a reason for hiding this comment

Uh oh!

dseralathan commented Feb 12, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

yadvr commented Aug 25, 2023•
edited
Loading

yadvrAug 25, 2023•
edited
Loading