[SOLVED] F7 Vue 3.5 rendering speed

Hi, there are three related F7-list lists. That is, selecting an element in the first, I get another list in the second and third. I allocate in the second I receive other list in the third. All lists via V-for from arrays, :key="item.id " present. It works, but… brakes. After clicking on the first list takes five seconds, the second three seconds. How to speed up the rendering of Vue? Preferably without a Virtual List. And one more question, what is better, to load the whole list and filter it through v-if or better to prepare a filtered array through javacript and load it through v-for? Thanks in advance!

Live example or JSFiddle will be good to see with the issue

Сбросил на учебный сайт, http://autogie1.bget.ru логин 2, пароль 2

Что то точно происходит не то. Во первых, да, лучше сделать фильтрованный массив однозначно. Если не поможет пробуйте убрать все лишнее чтобы понять откуда такая потеря производительности:

  • Убрать FAB
  • Убрать Sortable

Попробую, отпишусь, что и как

Всё таки самые большие тормоза это оказался FAB, как только убрал сразу убыстрилось, Sortable никак не повлиял. Насчет фильтрованного массива, то по крайне мере на вскидку никак не повлияло. Видать массивы не такие большие, а может Vue сам эффективно фильтрует.
Вообщем пробелма решена, FAB в большом количестве это зло ))).

Спасибо за подсказку!

1 Like