0

I have an Angular app which has only one TS file and one html View.

I was given a synchronous function CreateData(int categoryCount, int SubCategoryCount) that has couple of for loops in it which will take category count and sub category count as inputs. Each category will get generated with multiple sub categories (generated data will be Cat1 => SubCat1, SubCat2, SubCat3...).

I need to display that list on the UI. User will be able to see all Categories on the left side of the page, and if he selects any category from them, then I need to show all its subCategories in right side pane.

If I give the inputs as (1k,5k) to CreateData function I don't experience any lag and I get the values on to UI very easy and if I click on category on the UI, it will fetch its respective subCategories within no time.

But as I increase the input range to (10K, 50K) the initial data creation is taking time, and if I click on a category in the UI then there is a 5 second lag to display subCategories.

Can I do any async/await or promise calls inside this ts file to reduce both initial data creation time and retrieving subCats time??

Mr.V
  • 17
  • 2
  • Creating the data in a synchronous process is not likely your bottleneck... the rendering of all those elements is – charlietfl Dec 28 '20 at 00:27
  • @charlietfl true!! Any idea on how can I use Async or Promise in Angular to improve the performance ?? I'm have limited idea on these concepts. – Mr.V Dec 28 '20 at 00:31
  • 1
    Read link above. Using promises will not speed up slow processes. Suggest you focus on less rendering and render on as needed basis – charlietfl Dec 28 '20 at 01:01

0 Answers0