I have this function in my Backbone view for creating a new object through an API in the backend:
// *** called when remote hardware signal triggered
createConference: function () {
var self = this;
console.log("ScheduleLocationArea.js - createConference() ")
const startTime = performance.now();
this.sysLocation.create().then((response) => {
self.model.collection.add(response);
});
const duration = performance.now() - startTime;
console.log(`PERFORMANACE CHECK: ScheduleLocationArea.js - the function createConference() took ${duration}ms`);
},
It calling this function:
// called from within createConference
async create() {
console.log("Location.js - create() ")
const startTime = performance.now();
return await this.sync('create', this, {
url: this.create.url(this.id)
}, { silent: true });
const duration = performance.now() - startTime;
console.log(`PERFORMANACE CHECK: Location.js - the function create() took ${duration}ms`);
},
As you can see, I'm trying to check performance issues.
But for some reason that I cant figure out, it's not finishing the create() function. I never see the PERFORMANACE CHECK for that function.
Here is my console output:
ScheduleLocationArea.js - createConference()
Location.js:22 Location.js - create()
ScheduleLocationArea.js:269 PERFORMANACE CHECK: ScheduleLocationArea.js - the function createConference() took 1.7000000476837158ms
The browser writes out all the above console messages really fast.
And even though it says it only took 1.7ms...it actually takes about 3 seconds.
So I can't figure out whats taking so long and why it's not writing out the performance numbers for the create() function.
Is there something I'm doing wrong?
Thanks!
You are returning from your function before calling console.log in your first snippet. Any code following a return statement isn't run:
// called from within createConference
async create() {
console.log("Location.js - create() ")
const startTime = performance.now();
return await this.sync('create', this, {
url: this.create.url(this.id)
}, { silent: true });
// this following code never runs as screate(0 has returned already
const duration = performance.now() - startTime;
console.log(`PERFORMANACE CHECK: Location.js - the function create() took ${duration}ms`);
},
Change your code from:
// called from within createConference
async create() {
console.log("Location.js - create() ")
const startTime = performance.now();
return await this.sync('create', this, {
url: this.create.url(this.id)
}, { silent: true });
const duration = performance.now() - startTime;
console.log(`PERFORMANACE CHECK: Location.js - the function create() took ${duration}ms`);
},
to
// called from within createConference
async create() {
console.log("Location.js - create() ")
const startTime = performance.now();
const newUrl = await this.sync('create', this, {
url: this.create.url(this.id)
}, { silent: true });
const duration = performance.now() - startTime;
console.log(`PERFORMANACE CHECK: Location.js - the function create() took ${duration}ms`);
return newUrl;
},
This will allow your function to show the performance logs before returning the created value.