Comments 52
Было бы интересно посмотреть матрешку со связыванием данных Angular.
Спасибо, очень интересно, поглядываю какое-то время на FRP/ClojureScript/Javelin, но руки как-то не доходят, а Матрешка вроде попроще)
UFO just landed and posted this here
Да, к сожалению. Но это пока.
Angular до сих пор не избавился
Откуда в angular вдруг зависимость от jquery?
Там есть встроенное средство JLite, если не ошибаюсь. JQuery подключается при необходимости, но зависимости от него нет.
Там есть встроенное средство JLite, если не ошибаюсь. JQuery подключается при необходимости, но зависимости от него нет.
Про Object.defineProperty в IE8 расскажите, пожалуйста. Очень интересно звучит
Для «обычных» объектов в IE8 это реально только через статический VBScript-класс. Ограничение VBScript это то, что статический класс невозможно расширить новыми свойствами. Единственный способ без VBScript — это проверка по таймеру каждые ~10+ мс не изменилось ли значение.
А в данной библиотеки используется экземпляр host-класса XDomainRequest. Над хост-объектами Object.defineProperty в IE8 работает.
В общем, реальных геттеров/сеттеров для любых объектов в IE8 нету и не будет.
А в данной библиотеки используется экземпляр host-класса XDomainRequest. Над хост-объектами Object.defineProperty в IE8 работает.
В общем, реальных геттеров/сеттеров для любых объектов в IE8 нету и не будет.
Ничто не мешает в ие создавать новый статический класс и подменять им тот что был. Так же скорее всего можно нанэстить прототипов и расширять через них.
> Ничто не мешает в ие создавать новый статический класс и подменять им тот что был.
Мешает ограниченность VBScript'а. Всё-таки VBScript-объекты и JS-объекты совсем разные. Я знаю о чем говорю, потому что много эксперементировал с этим.
> Можно нанэстить прототипов и расширять через них.
Я не понял эту фразу, если честно.
В IE8- host-объекты, VBScript-объекты и объекты JS нельзя смешивать — т.е. нельзя назначить прототипом JS-объекта VBScript-объект и наоборот.
Там конечно есть нюансы, но я очень долго изучал этот вопрос — все пути решения в результате приводят к мелким и неудобным ограничениям, из-за которых просто невозможно универсально использовать какое-либо решение. Например, если создавать экземпляр host-класса, то у него нельзя сменить некоторые встроенные свойства — самое распространённое из которых это «toString», а могут быть недоступны на запись (и на Object.defineProperty) и такие свойства как «length» и т.д.
Мешает ограниченность VBScript'а. Всё-таки VBScript-объекты и JS-объекты совсем разные. Я знаю о чем говорю, потому что много эксперементировал с этим.
> Можно нанэстить прототипов и расширять через них.
Я не понял эту фразу, если честно.
В IE8- host-объекты, VBScript-объекты и объекты JS нельзя смешивать — т.е. нельзя назначить прототипом JS-объекта VBScript-объект и наоборот.
Там конечно есть нюансы, но я очень долго изучал этот вопрос — все пути решения в результате приводят к мелким и неудобным ограничениям, из-за которых просто невозможно универсально использовать какое-либо решение. Например, если создавать экземпляр host-класса, то у него нельзя сменить некоторые встроенные свойства — самое распространённое из которых это «toString», а могут быть недоступны на запись (и на Object.defineProperty) и такие свойства как «length» и т.д.
UFO just landed and posted this here
В принципе, это работает, но есть нюанс:
1. DOM-объект нельзя назначить в качестве prototype JS-объекту
2. У DOM-объекта нельзя сменить prototype
3. У DOM-объекта нельзя установить некоторые свойства, например toString
Это же касается VB-объектов.
Короче, не юзабельно. Я очень долго экспериментировал.
Вот тут подробное обсуждение: github.com/kriskowal/es5-shim/issues/152
1. DOM-объект нельзя назначить в качестве prototype JS-объекту
2. У DOM-объекта нельзя сменить prototype
3. У DOM-объекта нельзя установить некоторые свойства, например toString
Это же касается VB-объектов.
Короче, не юзабельно. Я очень долго экспериментировал.
Вот тут подробное обсуждение: github.com/kriskowal/es5-shim/issues/152
Есть решение под ие6. Делается через vbScript. Используется как минимум в dojotoolkit. То есть делается функция на вбскрипте, которой передаётся объект, свойство, которое хотим ловить и пара функций на гет\сет. Так как вбскрипт\жс имеют общий скоуп, то в ие можно звать одно из другого.
Видит новый разработчик в команде строчку
и гадает, будет что-то обновляться визуально в этой строчке или нет. А если да, то как найти обработчик?
Ещё проблемный момент:
Обновлений в html будет много, а надо только одно, как этим управлять?
mk.x = 44;и гадает, будет что-то обновляться визуально в этой строчке или нет. А если да, то как найти обработчик?
Ещё проблемный момент:
mk.x = 44;
mk.x = 44;
....
mk.x = 44;
;Обновлений в html будет много, а надо только одно, как этим управлять?
и гадает, будет что-то обновляться визуально в этой строчке или нет
Мне очень сложно подобрать грамотный ответ на этот вопрос, так как не понимаю, в чем тут проблема. Предложите, пожалуйста, какой-нибудь вариант решения.
А если да, то как найти обработчик?Искать по bindElement
Ещё проблемный момент:Почему вы так решили? ДОМ изменяется только тогда, когда меняется значение свойства: github.com/finom/matreshka/blob/master/src/matreshka.js#L885
mk.x = 44; mk.x = 44;… mk.x = 44;;
Обновлений в html будет много, а надо только одно, как этим управлять?
Предложите, пожалуйста, какой-нибудь вариант решения.
Тут к сожалению нет решения, для js точно, в каком-нибудь TypeScript можно, а тут нет.
Искать по bindElement
Как-то нетривиально, а если ещё смешивать с какими-нибудь другими либами, вообще не представляю как люди будут ориентироваться в таком коде.
ДОМ изменяется только тогда, когда меняется значение свойства
Пример я не очень удачный привёл. Суть в том, что когда меняется много свойств у модели, нужно чтобы вьюха обновилась только один раз, как это сделать?
По хорошему надо давать работать с матрёшкой только вьюхам, получится один объект — модель, на его ченьжи вешается изменение объекта замэппленного на дом, хотя тогда весь смысл матрёшки думаю теряется.
Тут к сожалению нет решения, для js точно, в каком-нибудь TypeScript можно, а тут нет.Приведите на TypeScript (он всё равно в JS компилируется)
Пример я не очень удачный привёл. Суть в том, что когда меняется много свойств у модели, нужно чтобы вьюха обновилась только один раз, как это сделать?Она и будет обновляться один раз. По разу на каждую привязку.
Как-то нетривиально, а если ещё смешивать с какими-нибудь другими либами, вообще не представляю как люди будут ориентироваться в таком коде.Приводите, пожалуйста, примеры. Хотя бы скажите, где, в каком фреймворке и какие библиотеки используются.
Спасибо, заинтресовали. На выходных буду изучать кодовую базу. Не нашел на github roadmap, по возможности хотелось бы поучавствовать в разработке. А насколько сильная зависимость от jquery? Где он используется кроме поиска по DOM?
Роадмап пока только у меня в голове, давайте попробую:
— Допилить метод .addDependence (метод, который прописывает зависимость одного свойства от других). Лично мне этого часто не хватает. События иногда избыточны, а геттер мне не нравится из-за того, что вычисление значения может быть ресурсоёмким.
Здесь пример решения математической задачи, которая может зациклиться и убить окно, если формула не верна. Надо подумать, как избежать таких проблем.
— Реализовать возможность добавлять DOM события к привязанным элементам таким образом:
— Убрать зависимость от jQuery
— Сделать плагин MVVM
— Поправить опечатки в документации, допилить верстку (это только я могу сделать)
Зависимость от jQuery в основном в привязках, но она там серьезная.
— Допилить метод .addDependence (метод, который прописывает зависимость одного свойства от других). Лично мне этого часто не хватает. События иногда избыточны, а геттер мне не нравится из-за того, что вычисление значения может быть ресурсоёмким.
var mk = new MK;
mk.addDependence( 'perimeter', 'a b', function() { return ( this.a + this.b ) * 2} );
mk.addDependence( 'a', 'perimeter b', function() { return this.perimeter/2 - this.b } );
mk.addDependence( 'b', 'perimeter a', function() { return this.perimeter/2 - this.a } );
Здесь пример решения математической задачи, которая может зациклиться и убить окно, если формула не верна. Надо подумать, как избежать таких проблем.
— Реализовать возможность добавлять DOM события к привязанным элементам таким образом:
mk.on( 'click::myKey', f ); // dom_event::property
— Убрать зависимость от jQuery
— Сделать плагин MVVM
— Поправить опечатки в документации, допилить верстку (это только я могу сделать)
Зависимость от jQuery в основном в привязках, но она там серьезная.
Универсальный watch, который работает в том числе в IE8.
Но лично я использую Object Watch и доволен. IE8 просто динамлю…
Но лично я использую Object Watch и доволен. IE8 просто динамлю…
А где ссылка на TodoMVC?
finom.github.io/matreshka/todo/#/ вот здесь черновик todo.
а тесты производительности библиотеки при работе с большими и сложными формами или объемными UI проводились?
Если кратко, то нет. Но из опыта и ревизии кода могу утверждать, что код близок к оптимальному, кроме метода
.unbindElement. Субъективная оценка скорости приложений со многими элементами — отлично. Я не заметил разницы между кодом с Матрешкой и без неё.благодарю. Хотелось бы побольше примеров с Matreshka.Object, а то один пример это очень мало…
Скоро будет статья об MK.Object. Примеры на сайте со временем доработаю.
А вот и она: habrahabr.ru/post/196886/
А можно как-то подключить файлы исходники из src и запустить?
Да, просто подключайте их в порядке:
xclass.js (1)
matreshka.js (2)
object.mk.js (3 или 4)
array.mk.js (3 или 4)
xclass.js (1)
matreshka.js (2)
object.mk.js (3 или 4)
array.mk.js (3 или 4)
спасибо
У меня еще один вопрос, может я жутко туплю конечно, я разбирался с исходным кодом, но так и не пойму
При выполнении последней строчки, что вызывается?
bindElement не вызывается
var mk = new MK();
mk.on( 'change:x', function() {
alert( 'x is changed to ' + this.x );
});
mk.x = 2;
При выполнении последней строчки, что вызывается?
bindElement не вызывается
Алерт x is changed to 2
нет, я имею ввиду, в matreshka.js что вызывается?
что вызывает эту функцию мою?
или это не в matreshka.js
что вызывает эту функцию мою?
или это не в matreshka.js
Матрешка вызовет. Первое — создаете экземпляр Матрешки (MK и Matreshka — одно и то же), второе — навешиваете обработчик события изменения свойства x, третье — меняете x.
… Если я правильно понял ваш вопрос.
… Если я правильно понял ваш вопрос.
Мне интересно именно что происходит после присвоения mk.x = 2;
какая функция матрешки срабатывает именно в этот момент
как срабатывает такой обработчи, мы просто изменили свойство объекта присвоип просто значение, не методом, а напрямую
как метрешка узнает, что это событие произошло?
какая функция матрешки срабатывает именно в этот момент
как срабатывает такой обработчи, мы просто изменили свойство объекта присвоип просто значение, не методом, а напрямую
как метрешка узнает, что это событие произошло?
Сработает сеттер (см. Object.defineProperty)
mk.x = 2;
1. В «ангуларе» у меня есть объекты с данными (прилетают с сервера), атрибуты которых привязаны, и я просто присваиваю объект — все привязки работают, пример:
mk.movie = { title:'die hard', year:1995 };
mk.movie = movie2;
mk.movie = movie3;
Как быть с матрешкой?
2. Как я понял, «привязки» срабатывают сразу после изменения значения — это не всегда хорошо, т.к. иногда придется учитывать порядок обновления переменных, плюс эти переменные не желательно использовать «повсеместно» т.к. они «тяжелые».
Мне больше нравится подход ангулара — обновление происходит когда все переменные посчитаны, данные обновлены.
Sign up to leave a comment.
(Архив) Matreshka.js — Введение