javascript - website gets slow when huge amount of data is being loaded -
i have internal team website build using python django , angularjs
. website works fine when there low data/ content on it. when website gets scrolled , more data loaded. becomes slow. major problem occurs when try open modal
or try write text in textarea
. text lags while writing , modal
open slowly.
i have used nested ng-repeat
there 5 nested ng-repeat
.
<div ng-repeat="x in xyz"> <div ng-repeat="y in xyz"> </div> <div ng-repeat="img in xyz"> </div> <div ng-repeat="y in xyz"> <div ng-repeat="z in xyz"> </div> </div> </div>
above example of structure being used in website. above snippet repeat around 100 times thorughout page. these having images, forms, text, input , user tagging facebook. ngcachebuster,ui.bootstrap, ngtagsinput, ui.mention,monospaced.elastic these external library being used in website. website built using bootstrap. there specific reason why website becomes heavy. each size of image around 100kb on average.
really? page loads slow when there alot of data? :d
anyway simple method speed-up heavy data apps conditionally load , render parts of it, example:
<div ng-repeat="x in bla" ng-click="showl1 = true"> <div ng-repeat="y in boo" ng-if="showl1 === true"> //more... </div> </div>
on other part double check architecture, since there limited amount of data person can take page , therefor start thinking tabs , paging
Comments
Post a Comment