Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как быстро переместить всех детей одного элемента в другой? (https://javascript.ru/forum/misc/34445-kak-bystro-peremestit-vsekh-detejj-odnogo-ehlementa-v-drugojj.html)

godofjavascript 05.01.2013 03:24

Как быстро переместить всех детей одного элемента в другой?
 
Как быстро переместить всех детей одного элемента в другой?

пока остановились на этом

function replaceChilds(from, to) {

	var fragment = document.createDocumentFragment();

	while (from.firstChild)
		fragment.appendChild(from.firstChild);
	
	to.appendChild(fragment);
}

Deff 05.01.2013 03:26

godofjavascript,
innerHTML

godofjavascript 05.01.2013 03:29

Цитата:

Сообщение от Deff
innerHTML

а если там обработчики и прочее?

godofjavascript 05.01.2013 05:24

Цитата:

Сообщение от Дзен-трансгуманист
Ты должно быть имел ввиду

нет, именно так как я сделал, так как апенд чайлдПеремещает а не копирует

while (from.firstChild)

а , ну да)

Цитата:

Сообщение от Дзен-трансгуманист
ps: а все равно с этим фрагментом - мартышкин труд.

проведем тест? перемещать напрямую в элемент назначения или сначала в фрагмент и что быстрее?


п.с. я просто пилю Юракс (мега систему виджетов и шаблонизатор) и там шаблоны хранятся в свойстве нод .template так что innerHTML тут не катит, он же все перепарсит)

melky 05.01.2013 12:59

Цитата:

Сообщение от Дзен-трансгуманист (Сообщение 225354)
Да, это я тупанул.)


Сам проводи, мне если честно пофиг.)

Фрагмент нужен для копирования некоего шаблона, что абстрагирует тебя от его внутренней структуры.
А для перемещения?... ну типа, выберем ведро А, создадим бумажное ведро Б и пересыплем туда по одному все яблоки из ведра А, потом возьмем ведро Б, поместим его в ведро Ц и рванем на себя - теперь все яблоки в Ц! Гениально. (было бы немного странно, если это и впрямь окажется быстрее, чем сразу из А в Ц)

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

godofjavascript 05.01.2013 14:46

Ты обращаешься в апи 1 раз фрагментом, и рендерится он один раз (грубо говоря)

а если по одному элементу пихаешь, то рендерится каждый раз грубо говоря. ГРУБО говоря.

melky 05.01.2013 14:57

Цитата:

Сообщение от godofjavascript
ГРУБО говоря.

грубо говоря, когда ты во фрагмент элементы перемещаешь, они тоже должны вызывать перерасчёт (!) и перерисовку

это не пакетное перемещение, это простое перемещение по-одному.

это плохо, и можно лучше - вот, что я хотел сказать.

(я могу подсказать, как сделать лучше, но попробуй сам додумать :))

godofjavascript 05.01.2013 15:15

Цитата:

Сообщение от melky
они тоже должны вызывать перерасчёт (!) и перерисовку

с чего ты взял?? он не находится в дом это обычный javascript обьект

Цитата:

Сообщение от melky
(я могу подсказать, как сделать лучше, но попробуй сам додумать )

подскажи, иначе нахрена я топик создал же) если ты знаешь то решение в студию

Deff 05.01.2013 15:20

может через clone родителя... ?

melky 05.01.2013 15:25

Цитата:

Сообщение от Deff
может через clone родителя... ?

если клонировать с потомками, то собьются обработчики

да и вообще их искать придётся заново -> клонирование не вариант
Цитата:

Сообщение от godofjavascript
с чего ты взял?? он не находится в дом это обычный javascript обьект

ну так ты же от родителя убираешь его (перемещаешь во фрагмент)

Цитата:

Сообщение от godofjavascript
подскажи, иначе нахрена я топик создал же) если ты знаешь то решение в студию

попробуй на момент перемещения потомков во фрагмент скрывать контейнер.

причём не через display: none, а лучше через visibility: hidden, мне так кажется.

godofjavascript 05.01.2013 16:01

ну я думал что то новое будет)
все ровно спасибо, чем display: none не угодил?

godofjavascript 06.01.2013 00:00

ща

godofjavascript 06.01.2013 00:16

блин вломы, проверьте кто нить(?

я работаю жэ

melky 06.01.2013 17:04

Цитата:

Сообщение от godofjavascript (Сообщение 225429)
ну я думал что то новое будет)
все ровно спасибо, чем display: none не угодил?

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

хотя. с другой стороны, разницы нет - детей то мы удалили, элемент стал пустым и сплющился (если ширина не задана)

так что display: none , всё-таки, будет лучше, мне кажется :))

danik.js 06.01.2013 17:21

Жду тестов (на jsperf.com ? ) !!! Болею за documentFragment.

melky 06.01.2013 18:50

http://jsperf.com/best-children-moving-strategy

дополняйте (дописывайте справа /edit )

по-моему, я что-то в тесте намудрил :D

monolithed 06.01.2013 22:50

http://jsperf.com/children-moving

monolithed 07.01.2013 01:32

В IE кто-нибудь нажмите кнопку (желательно в разных)
http://jsperf.com/children-moving

monolithed 07.01.2013 01:52

Благодарю :thanks:

PS: а 9-10 нет ни у кого?

Deff 07.01.2013 02:49

http://s3.uploads.ru/NTzZU.jpg
ИЕ8

danik.js 07.01.2013 07:17

Чтож, самый быстрый способ не в ие - через applyElement, так что используем только его!
Шучу конечно.

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

melky 07.01.2013 12:49

Цитата:

Сообщение от monolithed (Сообщение 225734)
Благодарю :thanks:

PS: а 9-10 нет ни у кого?

IE10 засчитал как IE9 , режим эмуляции выключен:blink:

godofjavascript 08.01.2013 00:21

Цитата:

Сообщение от Дзен-трансгуманист
Ну что, отведал тухлых помидоров?

а я не понял как тесты смотреть, чем шкала длиннее тем хуже)?

monolithed 08.01.2013 04:05

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

godofjavascript 09.01.2013 02:15

Цитата:

Сообщение от Дзен-трансгуманист
Ахаха, вот это отрыв!

godofjavascript,
Ну что, отведал тухлых помидоров?

в очередной раз теория всосала на практике)

то есть логика такая что мы просто берем и перемещаем детей по одному пока они не кончатся)???? понаоптимизрировали блин.


Часовой пояс GMT +3, время: 08:19.