search

torch2424 / link-drops

A collection of your links that you find across the internet, made with the help of @julianpoy
http://linkdrops.com/#/
Apache License 2.0
2 stars 1 forks source link

Increase Performance #96

Closed torch2424 closed 8 years ago

torch2424 commented 8 years ago

Currently, It takes 1 minute for me to load up my link drops, since I have a lot of drops. We need to find out what is using all of this process.

I think it is the iframe, and I Suggest we simply include a button that will be shown on embeddable links, instead of embedding everything everytime the app opens

torch2424 commented 8 years ago

Thought about it, and Thought, possibly it is not a memory leak, as mentioned ion #56 . As like I described, it has a typical memory usage. so I thought, possibly the javascript is just sucking up our cpu. and Looking at the Chrome Javascript CPU profiler, I pinpointed the javascript that is actually taking 40,000ms of processing power, and I stopped recording early. I noticed the more drops I have the slower the app is. And I discovered the problem...

drumroll please...

$scope.computePositions

Where is this? It is in our grid directive that calculates the position of every card. That doesnt sound like too much, but if you think about it, on page load, every single card is being found a position, and everytime something is updated, such as an image, or an iframe, everything needs to be updated, again, and again, and again. and this just DESTROYS the cpu.

However, I will admit this function was originally written in coffee script. so, possibly it may be an error in how the coffeescript to javascript. And I am currently optimizing. However, we should still be using the cpu analyzer, And here is some guides I found on improving angular CPU usage, and pinpointing it.

http://addyosmani.com/blog/performance-optimisation-with-timeline-profiles/ http://bahmutov.calepin.co/improving-angular-web-app-performance-example.html http://stackoverflow.com/questions/23066422/how-do-i-measure-the-performance-of-my-angularjs-apps-digest-cycle http://stackoverflow.com/questions/15643467/how-to-speed-up-an-angularjs-application

Here is the original guide that introduced us to $scope.computePositions http://microblog.anthonyestebe.com/2013-12-14/grid-pinterest-like-with-angular/

torch2424 commented 8 years ago

Doing this in the increasePerformance branch, I already sped things up by alot so it feels

torch2424 commented 8 years ago

Compute positions is being called like a million times, @julianpoy Would you be down to look at this. your a performance genius. At this point I suggest we can either optimize this, or go back to css columns and perhaps do the math to get the objects in the correct order, or move to a flexbox, where all of our cards will be the same size.

See huge calling below:

screenshot from 2015-12-25 20 28 41

julianpoy commented 8 years ago

@torch2424 Will take a look at this in the next few days before work starts back up again.

torch2424 commented 8 years ago

@julianpoy Okay thank you! I would like your input on this before I continue any more :) <3

torch2424 commented 8 years ago

Going to dump some super awesome things I've found on increasing angular performance, or other random cool angular stuff!

http://stackoverflow.com/questions/19601028/using-ng-repeat-and-limitto-to-limit-the-number-of-visible-items-displayed

http://stackoverflow.com/questions/15304562/how-to-put-a-delay-on-angularjs-instant-search

https://docs.angularjs.org/api/ngAnimate

http://stackoverflow.com/questions/17348058/how-to-improve-performance-of-ngrepeat-over-a-huge-dataset-angular-js

torch2424 commented 8 years ago

goign to add pagination in branch littleFixes

torch2424 commented 8 years ago

http://kamilkp.github.io/angular-vs-repeat/#?tab=6