Site performance testing

[frankvp11]

Hey guys,
I've been load testing my nicegui website and it's not performing that amazing..
Now, here's the problem. I'm not sure of what to expect given the compute that I have allocated to this website ($6 droplet on digital ocean 😭)
I used k6 to test, with this script:

import http from 'k6/http';
import { sleep } from 'k6';

export const options = {
  stages: [
    { duration: '10s', target: 10 },
    { duration: '10s', target: 25 },
    { duration: '10s', target: 50 },
    { duration: '10s', target: 75 }, 
    { duration: '20s', target: 100 },
    { duration: '10s', target: 0 },
  ],
};


export default function () {
  http.get('{site}');
  sleep(1);
}

and I got these results:

     execution: local
        script: loadtest.js
        output: -

     scenarios: (100.00%) 1 scenario, 100 max VUs, 1m40s max duration (incl. graceful stop):
              * default: Up to 100 looping VUs for 1m10s over 6 stages (gracefulRampDown: 30s, gracefulStop: 30s)



  █ TOTAL RESULTS 

    HTTP
    http_req_duration.......................................................: avg=1.37s min=69.04ms med=974.58ms max=5.05s p(90)=3.19s p(95)=4.21s
      { expected_response:true }............................................: avg=1.37s min=69.04ms med=974.58ms max=5.05s p(90)=3.19s p(95)=4.21s
    http_req_failed.........................................................: 0.00%  0 out of 1553
    http_reqs...............................................................: 1553   21.891977/s

    EXECUTION
    iteration_duration......................................................: avg=2.37s min=1.06s   med=1.97s    max=6.06s p(90)=4.2s  p(95)=5.22s
    iterations..............................................................: 1553   21.891977/s
    vus.....................................................................: 26     min=1         max=99 
    vus_max.................................................................: 100    min=100       max=100

    NETWORK
    data_received...........................................................: 62 MB  878 kB/s
    data_sent...............................................................: 202 kB 2.9 kB/s




running (1m10.9s), 000/100 VUs, 1553 complete and 0 interrupted iterations
default ✓ [======================================] 000/100 VUs  1m10s

So I have a few questions.
Have there been performance comparisons done between NiceGUI and other web development frameworks (like React, and whatnot), what can I do to improve the performance (I expect about 75 people to use / access my site at peak usage), and is the problem in my case purely the cheap droplet / provider?
I've really enjoyed the NiceGUI project overall, but because of the amount of people and the fact that it's basically just a signup form for the app, I was hoping it'd perform better..

[rodja]

Thanks for bringing this up @frankvp11. We have not done a lot of performance testing yet. Have you tested with some special app code or a basic hello world example? In both cases we would appreciate if you could share the code for better comparison. Your k6 setup is just testing the http connection -- after we find the bottleneck there it would be interesting to see how we could establish the websocket connection and simulate some user interaction...

[rodja]

I just tested with one-Button NiceGUI app on the smallest Digital Ocean droplet (Basic, Regular, 1 vCPU, 512 MB, 10 GB, 0.5 TB) with Ubuntu:

from nicegui import ui

@ui.page('/')
def index():
    ui.button('Click me', on_click=lambda: ui.notify('Hello World'))

ui.run(port=80)

It crashed after 30-40 seconds with your test script. After enabling 1GB of swap the app stayed reachable and resulted in this test output:

     execution: local
        script: k6-test.js
        output: -

     scenarios: (100.00%) 1 scenario, 100 max VUs, 1m40s max duration (incl. graceful stop):
              * default: Up to 100 looping VUs for 1m10s over 6 stages (gracefulRampDown: 30s, gracefulStop: 30s)



  █ TOTAL RESULTS 

    HTTP
    http_req_duration.......................................................: avg=68.54ms min=23.25ms med=39.24ms max=531.97ms p(90)=166.4ms p(95)=197.27ms
      { expected_response:true }............................................: avg=68.54ms min=23.25ms med=39.24ms max=531.97ms p(90)=166.4ms p(95)=197.27ms
    http_req_failed.........................................................: 0.00%  0 out of 3280
    http_reqs...............................................................: 3280   46.767546/s

    EXECUTION
    iteration_duration......................................................: avg=1.06s   min=1.02s   med=1.04s   max=1.53s    p(90)=1.16s   p(95)=1.19s   
    iterations..............................................................: 3280   46.767546/s
    vus.....................................................................: 10     min=1         max=99 
    vus_max.................................................................: 100    min=100       max=100

    NETWORK
    data_received...........................................................: 45 MB  636 kB/s
    data_sent...............................................................: 230 kB 3.3 kB/s




running (1m10.1s), 000/100 VUs, 3280 complete and 0 interrupted iterations
default ✓ [======================================] 000/100 VUs  1m10s

Therefore, I suggest you also activate swap and then strip down you application until you find the performance issue.

[frankvp11]

Hmm, yeah I'll be sure to do that. Granted mine was a bit bigger of an example, but I'll look into it.
Good to hear that the performance wasn't that bad
Thanks!