The company made a telephone directory on yii2 and angularjs. People up to 100 people. It works fast, everyone likes. Then I decided to test and fill 50,000 users. Result - the page is loaded a minute and then terribly slow. Reduced to 5000 - a little better, but also not ideal. In general, while I think that the directory is optimally no more than 1000 entries. The question is - angular in general is suitable for this?

I deduce records like this

<div ng-repeat="m in totalmans = (item.mans| filter:search)"> <div class="panel panel-info"> <div class="panel-heading"> <h3 class="panel-title"> <div><span ng-cloak ng-bind="m.name"></span>&nbsp;<span ng-cloak ng-bind="m.surname"></span></div> <div><span ng-bind="m.phone"></span></div> </h3> </div> <div class="panel-body"> <span ng-bind="m.email"> </span> </div> </div> </div> 

Where search

 <input ng-model="search" class="form-control input-lg" type="text" placeholder="Именя, фамилию или номер"> 

This type list

  { "id":"2", "name":"_administraciya_", "description":"Администрация", "mans":[ { "name":"Всеволод", "surname":"Кравчук", "phone":"102", "email":"skyq@skyq.ru", "dep_id":"2" }, { "name":"Захар", "surname":"Любимцев", "phone":"115", "email":"skyq@skyq.ru", "dep_id":"2" }] }, { "id":"2", "name":"_administraciya2_", "description":"Администрация2", "mans":[ { "name":"Всеволод1", "surname":"Кравчук1", "phone":"102", "dep_id":"2" }, { "name":"Захар", "surname":"Любимцев", "phone":"115", "dep_id":"2" }] } 

phones.skyq.ru

  • one
    you still bring the lines themselves. In general, there is no need to display 50,000 immediately, usually paginated. - Grundy
  • And then search how to organize the whole table by the forces of an angular? - Varfalamey Isoldin
  • The search will not change anything, you do not have a table, you have an array that is filtered. - Grundy
  • Let's say. And how to display with pagination? - Varfalamey Izoldin
  • you decide on which page you are now, and choose from the filtered collection a piece for the current page only - Grundy

1 answer 1

It is worth doing pagination or endless scrolling. It is impossible to display 50000 on the page immediately, because due to the large number of watchers, the page starts to have a lot of RAM.

  • one
    observers can and remove. - Grundy
  • @Grundy and what is the point of using Angulara if the content is static? - Vadizar
  • For example, fast acquisition and display. Filtering on the client. Plus a lot of opportunities that are not considered in this matter, the same routing - Grundy
  • You can quickly get and display it on Vanilla JS. I see no reason to connect the Framework for such tasks. - Vadizar
  • on empty JS - you can do anything. It turns out that frameworks are not needed at all? - Grundy