'Vue with axios need 5 to 7 seconds for api call with small data
Good day,
I have quite a problem with my VUE application, namely my API calls are very very slow.
I have a Laravel backend that provides the data in a timely manner, which responds accordingly via a domain https://api.example.com.
However, with my dashboard, where I make three API calls, it takes me between 5 and 8 seconds for the content to load:

As a result, users complain massively about the loading times. In the code, I currently call the calls as follows:
async mounted() {
this.personalDeletegatesId = userInfo.user.delegatesid
this.getTasks()
this.getAddresses()
this.getRequestTypes()
},
The functions were each created as an async method. Neither in production nor in local is the application fast.
getAddresses: async function () {
this.$http.get('/addresses/delegates/' + userInfo.user.delegatesid)
.then(function (response) {
this.items = uniqueElementsBy(response.data[0], (a, b) => a.id == b.id)
this.itemsnotasks = uniqueElementsBy(response.data[1], (a, b) => a.id == b.id)
this.itemsfav = uniqueElementsBy(response.data[2], (a, b) => a.id == b.id)
this.getCounts()
}.bind(this))
},
getTasks: async function () {
this.$http.get('/salestasks/delegates/' + userInfo.user.delegatesid)
.then(function (response) {
this.itemsTasks = uniqueElementsBy(response.data, (a, b) => a.salestasks_id == b.salestasks_id)
}.bind(this))
},
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
