ns.modelCollection не поддерживает разреженные данные #161

chestozo · 2013-09-13T20:39:17Z

Вот такой вот пример:

var col = ns.Model.get('collection', {});
col.insert( [1, 2], 2 );

Приведёт к такому массиву элементов:

[ 1, 2 ]

Ожидаю:

[ undefined, undefined, 1, 2 ]

Это by design?
/cc @edoroshenko @doochik

edoroshenko · 2013-09-13T12:05:10Z

Поговорили голосом. Роман решил сделать заход на поддержку разреженных коллекций

chestozo · 2013-09-13T21:04:21Z

Краткое содержание изменений:

метод insert теперь умеет вставлять разреженно данные:

// было
[ m1, m2 ]
insert( [m4, m5], 3 );
// стало
[ m1, m2, undefined, m4, m5 ]
// важно: insert вставляет:
insert(m3, 2);
[ m1, m2, m3, undefined, m4, m5 ]
// Чтобы установать элемент (с заменой) нужно использовать setModels()

добавлен метод ns.ModelCollection.prototype.setModels = function(models, index).
Данный метод нужен для установки элементов коллекции (с затиранием).

// было
[ m1, m2 ]
setModels( [m4, m5], 3 );
// стало
[ m1, m2, undefined, m4, m5 ]
// и главное:
setModels(m3, 2);
[ m1, m2, m3, m4, m5 ]

Пустые элементы во viewCollection рендерятся на ряду с готовыми элементами коллекции.
Для них создаются фейковые вьюхи ns-collection-item-fake (название можно поправить).

chestozo · 2013-09-13T21:06:55Z

А ещё может переименовать для единообразия:
insert - insertItems
remove - removeItems
и тогда:
setModels - setItems
?
Я могу пока оставить insert и remove как алиасы...

chestozo · 2013-09-13T21:49:15Z

переименовал setModels в setItems
добавил метод unsetItems (аналог remove, но оставляет дыру и не схлопывает её)
setItems вызывает unsetItems для затираемых элементов коллекции

edoroshenko · 2013-09-14T11:07:53Z

Есть замечания по мелочам, но о них можно поговорить позже.
Если честно, я так и не понял, зачем ты усложнил и без того сложный механизм? Для какой конкретно практической задачи?

chestozo · 2013-09-14T11:43:11Z

Практическая задача может быть такая например:

у меня есть альбом с 1000 фоток
есть страница просмотра этого альбома (тумбнейлы фоток из альбома)
пользователь гуляет по страницам альбома
на 3ей странице ему нравится фотка и он в неё тыкает
открывается страница просмотра и слайдер с фотками из альбома
в слайдере я покажу только фотки с 3ей страницы
к примеру, он закрывает страницу просмотра и опять гуляет по альбому
на 7ой странице опять нажимает на фото
открывается страница просмотра со слайдером, в слейдере 7ая страница с фотками и 3яя где-то в глубине слайдера
между 3ей и 7ой - дыра (неподгруженные данные)

chestozo · 2013-09-14T11:45:58Z

Итоговый changelog такой:

новый метод modelCollection.setItems(models, index=)
новый метод modelCollection.unsetItems(models, index=)
новое свойство в декларации viewCollection - split.empty_view_id. Если оно указано, для пустых элементов коллекции будут рендериться view этого типа. Если не указано - пустые модели не рендерятся вообще.

edoroshenko · 2013-09-14T14:05:51Z

src/ns.modelCollection.js

    model.eventListeners[this.key] = this;

    // если ранее мы не переопределяли прототипный тригер
    // то переопеделим его
+    // XXX это очень жёсткий bad practice... Лучше модэли элементы коллекции тогда наследовать от какого-то ns.Model.CollectionItem, где всё это прописать.


почему bad practice?

Потому что модель могла уже как-то переопределить этот метод и здесь это переопределение может затереться.

Самое лучше — сделать базовый тип ns.ModelCollectionItem где и переопределить trigger.
И добавить проверку, что подмодель наследуется от ns.ModelCollectionItem.

Но и это плоховато, потому что у нас получается standalone модель и модель, когда она становится подмоделью коллекции себя по-разному ведут.

edoroshenko · 2013-09-14T14:18:13Z

С названиями методов в корне не согласен. Получается:
insert(items, index)
setItems(items, index)
По имени метода невозможно понять, что он делает.
Метод insert реализует какую-то странную логику с раздвиганием.
unsetItems - непонятное название, а когда читаешь комметарий - становится ещё непонятнее. Где связть между unsetItems и "затиранием"? "Затирание" - это м.б. replace, но никак не unset.

Нужно хорошо проработать API, иначе все будут вечно путаться.

edoroshenko · 2013-09-14T14:20:58Z

split.empty_view_id - плохо.
Правильный подход (который используется для других похожих случаев) - это специальное свойство в декларации view, на которое матчится отдельный шаблон. Пример - см. как работает async и placeholder.

edoroshenko · 2013-09-14T14:23:52Z

src/ns.viewCollection.js

+            } else {
+                itemViewId = split.view_id;
+                itemParams = no.extend({}, params, model.params);
+            }


Этот блок кода - корявый костыль, который ещё и дублируется.

Это правда, но пока мне показалось легче оставить так. Могу поправить.

Да, там сам метод вообще больше похож на костыль (изначальный метод).
Он в 200 строк и это реальная каша, которую надо всю переписывать.
Я старался поменьше трогать существующий код.

edoroshenko · 2013-09-14T14:24:40Z

Ром, ещё раз, почему ты не хочешь создать пустые модели и по ним отрендерить вьюшки? Мы так делаем и всё отлично работает. Ты вместо того, чтобы использовать практику, которая уже где-то используется, искривляешь API и усложняешь логику работы.
Можно даже сделать так, чтобы пустые модели создавала сама modelCollection при вставке с "дыркой". И тогда всё будет работать ровно и просто.
Даже с точки зрения "правильности" этот подход лучше, потомучто ты создаёшь модели объектов, которые физически существуют. Просто их данные ещё не приехали с сервера

chestozo · 2013-09-14T15:06:04Z

Ох, многовато комментов, сложно отвечать.
Отвечу кратко, детально можно при встрече поговорить.

Названия методов.
insert, кмк, надо переименовать в insertItems (для единообразия)
Логика раздвигания - ровно та, которая и была, я её не менял.
unsetItems я выбрал как антипод setItems
replace в данном случае хуже, потому что по факту я затираю элементы, а не заменяю

split.empty_view_id - плохо.
Правильный подход (который используется для других похожих случаев) - это специальное свойство в декларации view, на которое матчится отдельный шаблон. Пример - см. как работает async и placeholder.

Тут ничего не понял.
empty_view_id сделано вот так:

ns.View.define('collection', {
  params: {},
  models: {},
  split: {
    view_id: 'item-view',
    empty_view_id: 'empty-item-view'
  }
});

Что в этом плохо - не понимаю.

chestozo · 2013-09-14T15:10:42Z

Ром, ещё раз, почему ты не хочешь создать пустые модели и по ним отрендерить вьюшки?

Есть 2 варианта: делать фейковые модели и не делать их.
Чем лучше создавать фейковую модель в сравнении с тем, чтобы не создавать её вообще?

Где я искривляю API я не понял.

edoroshenko · 2013-09-14T16:52:34Z

Чем лучше создавать фейковую модель в сравнении с тем, чтобы не создавать её вообще?

Тем, что не нужно обрабатывать её отсутствие. Логика будет проще

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

chestozo · 2013-09-14T18:13:21Z

А чем логика пустой модели проще логики фейковой view?
Мне кажется специально создавать и добавлять кучу пустых моделей не лучше )

edoroshenko · 2013-09-14T18:23:48Z

Проще тем, что viewCollection ничего не знает о том, что это какая-то особенная ситуация. Он просто работает со списком каких-то моделей.

chestozo · 2013-09-14T18:29:02Z

Это так да.
Но зато ты снаружи коллекции должен об этом помнить и в нужный момент подменять пустые модели на настоящие.
И если тебе потребуется аналогичная коллекция - нужно будет это написать ещё раз. Ну или сразу сделать обёртку над коллекцией.

А с фейковыми вью не нужна обёртка, коллекция сама вставляет пустое вью на место дырки в данных.
А когда данные появятся - вставит туда нормальное view.

edoroshenko · 2013-09-14T19:07:07Z

Вид должен содержать только логику рисования моделей.
Давай подумаем о том, чтобы пустые модели создавала/заменяла ns.ModelCollection

chestozo · 2013-09-14T19:25:52Z

С фейковыми моделям есть одна засада: они совсем фейковые.
Это не незагруженная модель, это реальная заглушка.
Потому что не всегда ты знаешь параметры для создания этих пустых моделей.
А значит потом эту модель прийдётся полностью выкинуть и вставить новую.

У твоего варианта (чтобы пустые модели создавала/заменяла ns.ModelCollection) есть конечно плюс — не надо усложнять viewCollection.
Но, кмк, он не сильно усложнился ) судя по диффу. Надо только дублирование куска с проверкой существования модели пофиксить )

chestozo · 2013-09-14T20:00:53Z

И тут я понял, что ты, скорее всего, прав ) ...
Буду смотреть дальше )

chestozo · 2013-09-16T14:42:20Z

Поговорили голосом:

методы setItems / unsetItems не нужны
добавляем метод replace(items, index), который заменяем элементы коллекции
viewCollection перестаёт знать о том, что в modelCollection могут быть дыры в данных
ну и дыр в данных в modelCollection тоже больше не должно быть

Ещё вот надо подумать про:

создавать пустые элементы коллекции внутри коллекции
научить коллекцию саму запрашивать данные

edoroshenko · 2013-09-16T14:50:12Z

тут бы ещё вот о чём подумать: м.б. добавить модели статус empty? А то {empty: true} - это могут быть реальные данные...
При этом, она должна считаться валидной

edoroshenko · 2013-09-16T14:55:20Z

а на такой статус можно завязаться во viewCollection, и генерить такие декларации, на которые можно было бы матчиться в стандартном шаблоне.
Чтобы если ты сделал insert с дыркой и у тебя нет спец. шаблона для пустого view, у тебя всё работало правильно.

Conflicts: src/ns.modelCollection.js

chestozo · 2013-11-25T08:24:52Z

В общем: переделал у себя на текущую версию modelCollection / viewCollection.
Думаю, пока можно всё оставить как есть, раз @edoroshenko собирается всё переделать ещё )

chestozo · 2013-11-25T08:29:27Z

Больше всего мне не нравится в текущей версии, что:

надо руками создавать item-ы, которые грузятся (надо создавать fake-вые модели в коллекции)
когда подгрузились данные надо руками заменять fake на real модели в коллекции

chestozo · 2013-12-18T16:25:59Z

И тут попалась нам коллекция из 5800 элементов.
И всё стало сильно тормозить.
В profile вижу такое:

В любом случае, создавать 5800 view довольно большой оверхед.
И тут вы скажите мне "а не создавай!"
Но я вам отвечу - а как?

Это слайдер с фотками, открыли мы первую фотку и подгрузили первые 20 фоток в слайдер (всё равно больше пока не видно).
Но нажал пользователь назад и надо его на самую последнюю фотку проводить.
И создать попутно все остальные фейковые.
И это тормозит.

chestozo added 9 commits September 13, 2013 17:20

insert умеет работать разреженно

bf83c93

getData() возвращает как есть разреженный массив с данными

570bfdf

Комменты по коду на будущее и вообще

9e2ec1a

Array.isArray() is good

fba19ec

Могут попросить удалить элемент, которого сейчас нет

3a9fad7

Начал с создания подview + пофиксил баг в ns.View.getKeyAndParams()

f1362a0

Поправил updateHTML метод

a3a45af

fix: insert method and add setItems method

578fa08

fix jshint

f80f120

chestozo added 4 commits September 14, 2013 01:16

rename setModels to setItems

c7dafa5

unsetItems added

a9240b5

explicit unset for set model

5f16ddf

fix bug in remove method: could remove items with a wrong index

80d2dcd

new split property: empty_view_id

368e78d

edoroshenko reviewed Sep 14, 2013
View reviewed changes

fix: return empty elements in getData() also

7594126

Merge branch 'master' into collection.disperse

4e9b4d9

Conflicts: src/ns.modelCollection.js

chestozo closed this Nov 25, 2013

chestozo deleted the collection.disperse branch May 5, 2018 11:03

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

ns.modelCollection не поддерживает разреженные данные #161

ns.modelCollection не поддерживает разреженные данные #161

chestozo commented Sep 13, 2013

edoroshenko commented Sep 13, 2013

chestozo commented Sep 13, 2013

chestozo commented Sep 13, 2013

chestozo commented Sep 13, 2013

edoroshenko commented Sep 14, 2013

chestozo commented Sep 14, 2013

chestozo commented Sep 14, 2013

edoroshenko Sep 14, 2013

chestozo Sep 14, 2013

edoroshenko commented Sep 14, 2013

edoroshenko commented Sep 14, 2013

edoroshenko Sep 14, 2013

chestozo Sep 14, 2013

chestozo Sep 14, 2013

edoroshenko commented Sep 14, 2013

chestozo commented Sep 14, 2013

chestozo commented Sep 14, 2013

edoroshenko commented Sep 14, 2013

chestozo commented Sep 14, 2013

edoroshenko commented Sep 14, 2013

chestozo commented Sep 14, 2013

edoroshenko commented Sep 14, 2013

chestozo commented Sep 14, 2013

chestozo commented Sep 14, 2013

chestozo commented Sep 16, 2013

edoroshenko commented Sep 16, 2013

edoroshenko commented Sep 16, 2013

chestozo commented Nov 25, 2013

chestozo commented Nov 25, 2013

chestozo commented Dec 18, 2013

ns.modelCollection не поддерживает разреженные данные #161

ns.modelCollection не поддерживает разреженные данные #161

Conversation

chestozo commented Sep 13, 2013

edoroshenko commented Sep 13, 2013

chestozo commented Sep 13, 2013

chestozo commented Sep 13, 2013

chestozo commented Sep 13, 2013

edoroshenko commented Sep 14, 2013

chestozo commented Sep 14, 2013

chestozo commented Sep 14, 2013

edoroshenko Sep 14, 2013

Choose a reason for hiding this comment

chestozo Sep 14, 2013

Choose a reason for hiding this comment

edoroshenko commented Sep 14, 2013

edoroshenko commented Sep 14, 2013

edoroshenko Sep 14, 2013

Choose a reason for hiding this comment

chestozo Sep 14, 2013

Choose a reason for hiding this comment

chestozo Sep 14, 2013

Choose a reason for hiding this comment

edoroshenko commented Sep 14, 2013

chestozo commented Sep 14, 2013

chestozo commented Sep 14, 2013

edoroshenko commented Sep 14, 2013

chestozo commented Sep 14, 2013

edoroshenko commented Sep 14, 2013

chestozo commented Sep 14, 2013

edoroshenko commented Sep 14, 2013

chestozo commented Sep 14, 2013

chestozo commented Sep 14, 2013

chestozo commented Sep 16, 2013

edoroshenko commented Sep 16, 2013

edoroshenko commented Sep 16, 2013

chestozo commented Nov 25, 2013

chestozo commented Nov 25, 2013

chestozo commented Dec 18, 2013