FreeCodeCamp/HelpFrontEnd

Get help on our Front End Development projects.

Brad

@bradtaniguchi

and the .map, without async/await

return Promise.all(categoriesIdArray.map(categoryID => getSearchResults(' ', categoryID)));

@siliconchild

siliconchild

@siliconchild

@bradtaniguchi thank a lot, let me try that

Brad

@bradtaniguchi

Just a word of warning, I don't advise this approach for large lists. Not because the code is wrong, its that if your on the client-side making X number of calls things can slow dramatically

siliconchild

@siliconchild

@bradtaniguchi i understand that, i am thinking to run this a cloud function on netlify that i can call

i dont have access to the server api

to create new apis there

Brad

@bradtaniguchi

Ah, if your calling an API it isn't as bad, but still non-optimal if the list is large. If the api your interfacing with is designed for it tho, then it shouldn't matter too much

siliconchild

@siliconchild

@bradtaniguchi yes this is hacky solution, since there is no api to fetch deals, i am writing this intermediary api to create one. is there a better solution if i can't create an api in the original server

@bradtaniguchi is the issue with this, creating too many reads of the database?

Brad

@bradtaniguchi

Well for each request you make you go through the "entire flow" of a request in the api, so the webserver is called, logic is checked, potentially multiple database calls are called (for security+your data) and thats for each call

siliconchild

@siliconchild

@bradtaniguchi so this would bog down the server considerably?

the list has currently less than 1000 items

Brad

@bradtaniguchi

Whoa, it could get up to 1k calls? :O

Its impact on the server depends on how its implemented

if its a nodejs server, and lets say there is 0 security, your still looking at 1k individual database calls, and 1k router hits all at the same time. Heck that could bring up DDOS protection with some web servers (idk if that applies here tho)

siliconchild

@siliconchild

@bradtaniguchi i don't much about server side, but when this logic is written on the server side, woudn't the all the data needs to read to filter and create this api?

so that would create a similar load on the database right?

Brad

@bradtaniguchi

Not sure what you mean by "woudn't the all the data needs to read to filter and create this api?"

Kaz Baig

@kbaig

What brad said, you're going to be waiting for each call to end before moving on to the next one in the array unless you use Promise.all

siliconchild

@siliconchild

so promise.all runs in parallel ?

Brad

@bradtaniguchi

yes

Kaz Baig

@kbaig

yep

Brad

@bradtaniguchi

Lets say you had access to the DB yourself, you'd make 1 call/request to it with a query, and get 1 response back with all your data. Its a lot less processing to handle the network transfers at each level

siliconchild

@siliconchild

const fetchAllProducts = async () => {
    const categories = await GetActiveCategories();
    const categoriesIdArray = categories.map(category => category.CategoryId);
    return Promise.all(categoriesIdArray.map(categoryID => getSearchResults(' ', categoryID)));
 }

is this enough, this is still returning a promise

Brad

@bradtaniguchi

Your in an async function, it always is a promise

siliconchild

@siliconchild

ok so i just need to write another async function to await fetchAllProducts?

Brad

@bradtaniguchi

what? I thought thats what you already had?

const hotDeals = async () => {
    const products = await fetchAllProducts();
    return products.forEach(product => product.MRP/product.SellingPrice > .8)
}

siliconchild

@siliconchild

yes i have that

Brad

@bradtaniguchi

yea that stays the same

siliconchild

@siliconchild

ok, what you said about the database makes sense

thank you

Brad

@bradtaniguchi

np, there are a few ways you can cut down on calls that lean on the fact your netlify api can "cache" previous values, but this increases complexity and creates a layer of caching that needs to be cleared

siliconchild

@siliconchild

so i can cache the products list for an hour until i update it again

that is a good idea

Brad

@bradtaniguchi

netlify will automatically "clears the cache" if the server turns off aswell so there is that

siliconchild

@siliconchild

btw the server admin said, to implement this feature it is too much work for him and he would need to rewrite a lot of code, i don't know if he is bluffing or if it actually takes a lot of work to create a new api like this, could you tell me your opinion

Kaz Baig

@kbaig

We don't know what goes into building on api on your platform tho

Brad

@bradtaniguchi

Couldn't be that bad honestly, even if we cranked up the complexity to 100, being able to do an "OR" request essentially it seems kinda important

unless of course the API is just optimized for the individual api calls

siliconchild

@siliconchild

const fetchAllProducts = async () => {
    const categories = await GetActiveCategories();
    const categoriesIdArray = categories.map(category => category.CategoryId);
    return Promise.all(categoriesIdArray.map(categoryID => getSearchResults(' ', categoryID)));
 }

const hotDeals = async () => {
    const products = await fetchAllProducts();
    console.log('PRODUCT DATA', products)
    return products.forEach(product => product.MRP/product.SellingPrice > .8)
}

const displayHotDeals = async () => {
    const data = await hotDeals();
    console.log('DATA',data)
}

displayHotDeals();

the filter is returning undefined

the first console.log gives out the array

when i download the array and then run the filter on the browser console it works

i don't know why that is

Brad

@bradtaniguchi

your using forEach not filter, forEach returns nothing

siliconchild

@siliconchild

shit, i am so stupid. how did i not notice that

sorry :D

Where communities thrive

People

Repo info

Activity