Ради исключения варнингов из лога?)

Ради исключения варнингов из лога?)

на новый грейдл переходил и всякие такие места патчил

https://snack.expo.io/@jjjhhhhjjh/104eaa Собственно вот. Если потянуть флэтлист вниз, то появится refresh control

ну по крайней мере на моем iphone 6s не тормозит https://snack.expo.io/BJgW9tPJr

Всем привет! Столкнулся с проблемой рендера больших списков (FlatList уже не особо справляется) и выбор пал на ВОт такую либу: https://github.com/Flipkart/recyclerlistview Либа не совсем удобная, но свою задачу по рендеру более 300 элементов выполняет на отлично. Но столкнулся со следующей проблемой, касательно либы: - Если рендерить список На экране без какого-либо дерева компонентов, т.е рендерить только список и все <RecyclerListView … />, то айтемы рендерятся полностью правильно и как нужно, НО если есть какое-то дерево, а список нужно отрендерить, условно, в конкретном месте на экране (скажем, вверху есть шапка, потом еще какие-то блоки, а потом идет список), то начинаются какие-то не понятные вещи (требует для родителя minWidth: 1, minHeight: 1, Рендерит только 5 айтемов, а дальше прокрутка идет просто пустой, хотя скролится будто их там 200, но вижу пустой экран). От некоторых вещей спасает флаг canChangeSize={true} (с ним рендерится 5 компонентов, но прокрутив почти в самый низ начинаются рендериться все пустые, создавая такую пустую яму), но у меня контент не меняется (его size) Следовательно вопрос. Кто работал с подобной либой и кто сталкивался с проблемами рендера айтемов внутри каких-то компонентов, а не просто как root для экрана? Или, быть может, кто-то очень круто оптимизировал FlatList, заставив его работать с большими списками?

В смысле FlatList не справляется с 300+ элементов?)

Вот так не справляется, идут не совсем понятные мне ререндеры

Тогда лучше разобраться с этим, а не искать другое решение)

ну по крайней мере на моем iphone 6s не тормозит https://snack.expo.io/BJgW9tPJr

если конечно у вас не 300 элементов одновременно в один экран влезают то значит где то косяк)

нет, не влезают 🙂 ПРосто я не совсем видимо понял, что не так. Я условно взял в компоненте и сделал Random на появление замочка. И после рендера у меня замочек на одном и том-же компоненте прыгал. То он был, то нет, шли какие-то ну дикие ререндеры. Я не совсем понял от куда они

нет, не влезают 🙂 ПРосто я не совсем видимо понял, что не так. Я условно взял в компоненте и сделал Random на появление замочка. И после рендера у меня замочек на одном и том-же компоненте прыгал. То он был, то нет, шли какие-то ну дикие ререндеры. Я не совсем понял от куда они

А вот этот кейс можно по-подробнее

Мой FlatList рендерит компоненты, которые ведут к платному контенту, но ведут не все. Часть контента бесплатная. Флаг isPremium приходит извне и я чтобы сделать эмитацию (пока флаг еще не приходит) Сделал что-то типа const isPremium = Math.random(0, 1) > 0.5 Вот так выглядит входная точка туда: https://paste.ubuntu.com/p/zk2yT7H3YP/ Получается <Item {...item} navigate={navigate} /> внутри себя имеет этот const isPremium = Math.random(0, 1) > 0.5 и решает, поставить замочек (убрать кликабельность) или оставить Так вот при рендере этот замочек прыгает по всем айтемам, т.е одного и того-же айтема происходит РЕРЕНДЕР очень много раз, попадая то в isPremium = 0 или isPremium = 1

Всем привет! Столкнулся с проблемой рендера больших списков (FlatList уже не особо справляется) и выбор пал на ВОт такую либу: https://github.com/Flipkart/recyclerlistview Либа не совсем удобная, но свою задачу по рендеру более 300 элементов выполняет на отлично. Но столкнулся со следующей проблемой, касательно либы: - Если рендерить список На экране без какого-либо дерева компонентов, т.е рендерить только список и все <RecyclerListView … />, то айтемы рендерятся полностью правильно и как нужно, НО если есть какое-то дерево, а список нужно отрендерить, условно, в конкретном месте на экране (скажем, вверху есть шапка, потом еще какие-то блоки, а потом идет список), то начинаются какие-то не понятные вещи (требует для родителя minWidth: 1, minHeight: 1, Рендерит только 5 айтемов, а дальше прокрутка идет просто пустой, хотя скролится будто их там 200, но вижу пустой экран). От некоторых вещей спасает флаг canChangeSize={true} (с ним рендерится 5 компонентов, но прокрутив почти в самый низ начинаются рендериться все пустые, создавая такую пустую яму), но у меня контент не меняется (его size) Следовательно вопрос. Кто работал с подобной либой и кто сталкивался с проблемами рендера айтемов внутри каких-то компонентов, а не просто как root для экрана? Или, быть может, кто-то очень круто оптимизировал FlatList, заставив его работать с большими списками?

а что у вас за данные во FlatList ?Мы рендерим 7000 элементов(картинка плюс пара текстов) и все ок

Мой вопрос - от куда столько ререндеров?

И компонент, который внутри renderItem рендерится должен быть PURE? right?

На виртуализацию и разбиение рендера на несколько асинхронных, на "чистоту" компонента, на измерение размеров...

как это победить? Была мысль просто сделать lazy load по 10 элементов и проблема бы ушла

да просто не нужно готовить данные на рандоме внутри рендера

Абстрагируемся от рандома, его не будет. Ве будет приходить извне

подготовь их заранее

Или это надо вообще уносить за sCU, а внутри компоненты через forceUpdate обновлять при смене внутренностей... (Это если что, как всякие react-redux и mobx-react работают)

Или это надо вообще уносить за sCU, а внутри компоненты через forceUpdate обновлять при смене внутренностей... (Это если что, как всякие react-redux и mobx-react работают)

Если я верно понял - https://paste.ubuntu.com/p/zk2yT7H3YP/ Вот тут return <Item {...item} navigate={navigate} /> Мой компонент <Item / > должен быть Pure

так там extraData есть же

он не должен ререндериться просто

Ну есть разница - реконсайлинг всего FlatList после extraData или forceUpdate только одного айтема ) extraData скорее нужна, если у нас есть массив (или другая модель), которая апдейтится инплейсом и FlatList не "видит" этого...

Моя идея в том, чтобы не рендерить то, что сейчас не на экране. Такого можно добиться FLatList?

ну я обходился без scu и forceUpdate при этом итем были обычными Component, но данные в них прокидывались по персональной подписке в редакс, то есть когда менялся итем в редаксе, то ререндерился только 1 итем в FlatList

НУ собственно я рендерю как показал выше, но при прокрутке я не могу даже кликнуть на айтем т.к идут ререндеры

Ну я их тоже не пишу, просто заворачиваю каждый айтем в обзервер из react-mobx...

выпилите то что заставляет ререндериться или запилите в каком случае он должен ререндериться

Я их пытался крутить... сомнительное удовольствие. Сложилось ощущение, что они нужны для тонкой подстройки, которая мне уже была не нужна. Т.е. принципиально ими исправить ничего нельзя, можно только слегка улучшить. Т.е. если есть тормоза в рендере, то надо фиксить тормоза в рендере, уменьшать объем рендера, уменьшать их кол-во... а эти крутилки уже потом, но мне после вот этого "уже потом" было не нужно, всё и так начинало нормально работать.

ага, понял. Спасибо А еще такой вопрос. Если Рендерить картинки - как-то их можно кешировать? Я имею ввиду FlatList рендерит <Item / > внутри которого картинка будет доставаться по path

Народ, ни с того ни с сего начала вылетать ошибки resource android:attr/fontVariationSettings not found resource android:attr/ttcIndex not found Execution failed for task ':app:processDebugResources'. > Failed to process resources, see aapt output above for details. кто то сталкивался?