Learn More
Resend Email
1
Wesley
4y

HI all.

I'm a novice in Web Development and I've made simple Web App I've just publish on Github. I just wanted to play a little to learn API manipulation and JavaScript's Fetch. So I decided to build an app based on Discogs' API for my personal use.

ShuffleBum is an app, which after providing a username in the dedicated field, retrieves all items of user's collection then randomize one of them before displaying it. That's help me to find my next listening records (I have 400+ vinyls in my collection and I always listenning too many time the same records ^^).

Because of Discogs' API construction, I must perform two fetch to retrieve all the items (Items are stacked at 50 per page). So, for my collection, there is 10 pages with 50 items. So, I used a foreach and a fetch to scan items and store them into an array.

But, this is really slow (800ms for each request), so for 10 pages, that's a lot. But I can't see how to improve those request. I can't do otherwise. Well, I guess.

Hope I will have so recommandation, hints, tricks.

Thank you.

question

fetch

slowlyness

javascript
Favorite
Ranter
Comments
  • 0
    4y
    Is the request time something you can't change?

    You could always eagerly load the next page's data so the user doesn't have to wait unless they're flipping through really quickly.
  • 0
    4y
    @spongessuck Thank you for your answer. I appreciate.

    Did you think of faking the result ? Like instead of waiting to fetch the entire collection (mine for example, there is 10 pages so 10 fetch), maybe I can push the first fetch into an other array (a temporary one) and randomize this array first while doing the rest of fetch.

    Your comment made me think of this, maybe it's a good idea and good practice.
  • 0
    4y
    I don't get why you want to randomize but sure.
  • 0
    4y
    Because this is the idea behind my app ^^
  • 0
    4y
    Just make it async.
  • 0
    4y
    @example-user I already use async / wait.
  • 0
    4y
    @Wesley Do you wait in each cycle? If you make them all non-blocking they all finish within that 800ms timespan. Well, more or less. But it’s significantly less than 800ms*10.

    Maybe map each page into an array of promises, then, you can use Promise.all
  • 0
    4y
    @example-user Hi. This is already what I'm doing.. well I guess. See attachment.
  • 1
    4y
    @Wesley You don’t, each cycle in the loop waits until both the request and the body parsing is done, then it’s getting the next page. Remove the „await“ keyword and put the pending promise in an array.
  • 1
    4y
    @Wesley I've made a fiddle for you, have fun!

    https://jsfiddle.net/q8m1c2gd/9/
  • 0
    4y
    @example-user Thank you so much for this and for the explanations. I will read it again and again till I figure it out. Maybe I'm not logical / good enough to become a good developer ^^
    Thank you for your help, really :)
  • 2
    4y
    Think of it this way: if you await each promise, you're keeping every promise after it from running. If you collect them all in an array and await them all at once, they'll run together.
  • 1
    4y
    @spongessuck Thanks. I understand the difference. I will try to update my code with the help of @example-user and yours. Thx a lot
Related Rants
devRant © 2021 Hexical Labs LLC
Privacy Policy  |  Terms of Service
Add Comment