How to test performance / load of a modern angular application

The best way of testing client-side performance is profiling the application using browser developer tools

If you want to automate the process - you should go for the browser automation framework, the most popular one is Selenium. You will be also capable of executing JavaScript calls to access Performance object in general and Navigation Timing / User Timing APIs in particular.

I would also recommend keeping in mind server-side performance, i.e. you might want to check how many concurrent users you application can handle without issues, what are the saturation point / first bottleneck, when response time starts increasing or errors start occurring. So consider combining client-side performance tests with conducting the anticipated load onto your application as it can be the case that from client perspective rendering is very fast but server responds slowly causing bad user experience. Depending on your test lab hardware you can either go for Selenium Grid to kick off many browser instances or go for a dedicated load testing tool

You can not truly stress test your application using only UI browser testing, ideally, you would like to do both stress test all your application API calls, while also running UI/browser test.

One option to consider could be endly e2e runner, it can do both of these tasks, load test and run selenium test in parallel

It may look like the following, where "data" folder contains previously recorded http requests with optional desired validation rules hiting your API

@test.yaml

defaults:  target:    URL: ssh://127.0.0.1/    credentials: localhostpipeline:  init:    action: selenium:start    version: 3.4.0    port: 8085    sdk: jdk    sdkVersion: 1.8  test:    multiAction: true    stressTest:      action: run      request: @load_test      async: true    testUI:      action: selenium:run      browser: firefox      remoteSelenium:        URL: http://127.0.0.1:8085      commands:        - get(http://play.golang.org/?simple=1)        - (#code).clear        - (#code).sendKeys(package main          import "fmt"          func main() {          fmt.Println("Hello Endly!")          }          )        - (#run).click        - command: output = (#output).text          exit: $output.Text:/Endly/          sleepTimeMs: 1000          repeat: 10        - close      expect:        output:          Text: /Hello Endly!/

where @load_test.yaml

init  testEndpoint: rest.myapp.compipeline:  test:    data:      []Requests: '@data/*request.json'    range: '1..1'    template:      info:        action: print        message: starting load testing      load:        action: 'http/runner:load'        threadCount: 3        '@repeat': 100000        requests: $data.Requests      load-info:        action: print        message: 'QPS: $load.QPS: Response: min: $load.MinResponseTimeInMs ms, avg: $load.AvgResponseTimeInMs ms max: $load.MaxResponseTimeInMs ms'