Venues page is doing lots of AJAX requests on first load

[ttocskcaj]

The below screenshot was taken just after loading the page for the first time. For some reason there's 6 XHR (Ajax) requests to the API just to load the data.

We should probably try to get this down to 1 (perhaps 2) as it will start to affect users with slow connections and will put a higher load on our cloud server/database.

[lxdnz254]

/api/genres could be trimmed down to 1 call by bringing the SearchController into the $scope of VenueController or by setting the $scope of both the form genre drop downs and the search dropdown to $rootScope (this isn't the best practice though). I'm not sure why api/venues is called three times on first load, maybe we need to step through the VenueController functions to see where and why the extra calls are being made?

[ttocskcaj]

Yea, I just created the issue to take note that there's (probably) a problem to fix. It's not really urgent at the moment.

Even on dial-up speeds, each XHR request is < 1s as it's just a couple bytes of JSON. The CSS and JS on the other hand make dial-up loads take about 1min

[lxdnz254]

Yeah all good, 3s is the max time a user will wait for a web page, (maybe longer if they're on dial-up?) so keeping our calls to a minimum and package sizes small will be something to bear in mind. Still a bit of a mystery as to why /api/venues is called 3 times, as I can only see it making one call?

[ttocskcaj]

I don't think those rules apply for dial-up users haha.

I'm getting 3 calls on each browser I've tried.

[lxdnz254]

Maybe we need to put a wait for response method on client side? Because the $scope.other_venues hasn't been filled angular will call again until it's completed..

On 3/08/2017 1:13 PM, "Jack Scott" notifications@github.com wrote:

I don't think those rules apply for dial-up users haha.

I'm getting 3 calls on each browser I've tried.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/OpenPolytechnicBITProjectGroup/Musician-Venue_App/issues/32#issuecomment-319840557, or mute the thread https://github.com/notifications/unsubscribe-auth/AHxQwki9YwyRWaq_IrCcO8cIXhSceXijks5sUR67gaJpZM4Or0Rw .

[ttocskcaj]

I think stepping through the code line by line is the only way to find it. Chrome's dev tools just tell me it's Angular's HTTP method doing the call, not what's calling that method :(

[lxdnz254]

Yes that's what I was thinking, it's not our code. It's how angular is reading the html file, because the div is empty it makes a call again until the div has received data and not empty, hence putting a wait in our code so the call doesn't fire again

On 3/08/2017 1:20 PM, "Jack Scott" notifications@github.com wrote:

I think stepping through the code line by line is the only way to find it. Chrome's dev tools just tell me it's Angular's HTTP method doing the call, not what's calling that method :(

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/OpenPolytechnicBITProjectGroup/Musician-Venue_App/issues/32#issuecomment-319841398, or mute the thread https://github.com/notifications/unsubscribe-auth/AHxQwt-dHFrpyXHD4_-izRPbtfKSWDJtks5sUSBAgaJpZM4Or0Rw .

[lxdnz254]

I'll stackExchange a solution tonight.

On 3/08/2017 1:42 PM, "Alex McBride" lxdnz34@gmail.com wrote:

Yes that's what I was thinking, it's not our code. It's how angular is reading the html file, because the div is empty it makes a call again until the div has received data and not empty, hence putting a wait in our code so the call doesn't fire again

On 3/08/2017 1:20 PM, "Jack Scott" notifications@github.com wrote:

I think stepping through the code line by line is the only way to find it. Chrome's dev tools just tell me it's Angular's HTTP method doing the call, not what's calling that method :(

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/OpenPolytechnicBITProjectGroup/Musician-Venue_App/issues/32#issuecomment-319841398, or mute the thread https://github.com/notifications/unsubscribe-auth/AHxQwt-dHFrpyXHD4_-izRPbtfKSWDJtks5sUSBAgaJpZM4Or0Rw .

[lxdnz254]

I think I have found the solution.. Because $routeProvider also calls the controller, we must remove ng-controller from html file. I will test out and see how that goes.

Solution from https://stackoverflow.com/questions/17967437/angularjs-calls-http-multiple-times-in-controller