Библиотека javascript RightJS в повседневном использовании
Удивительно, если кто-нибудь здесь может предложить какое-либо понимание взлетов/падений с использованием библиотеки RightJS, в частности, по сравнению с jQuery и в целом, по сравнению с тем, что, по вашему мнению, должна предложить библиотека.
Я не так сильно ищу функцию для сравнения, а скорее ощущение повседневного использования.
Такие вещи, как:
- Естественно ли это использовать, или это похоже на тяжелую битву?
- Является ли API выражением в понятной манере, или вам интересно, что означает код, который вы написали 3 недели назад?
- Вы считаете, что хотите, чтобы у него была какая-то функция jQuery (или какая-то функция вообще) или наоборот, вам нравится какая-то особенность, которой нет в других библиотеках?
- Общие философские соображения, которые, по вашему мнению, делают RightJS выше/ниже.
Не такие вещи, как:
- Mindshare/marketshare/plugins/CDN/соображения (победитель очевиден)
- Зачем вам беспокоиться... (спорный)
- jQuery делает x, y и z, а RightJS не предлагает, не понимая, как это влияет на ежедневное использование (могут быть философские причины, которые делают ненужными x, y и z).
Ответы
Ответ 1
На основе документации, образцов кода и того, что уже работает в RightJS 2, я очень впечатлен.
@Patrick - Спасибо, что указали функцию Call By Name в RightJS, которая кажется чрезвычайно полезной для удаления большинства анонимных функций со всей страницы, Для тех, кто не знаком с этим, идея заключается в том, чтобы указать имя метода и аргументы как параметры вместо создания анонимного обратного вызова. Например, если мы пытаемся отфильтровать все слова и фразы, начинающиеся с "hello" из массива,
var words = ['stack', 'hello world', 'overflow', 'hello there'];
Используя метод фильтрации на массивах, мы будем писать:
words.filter(function(word) {
return word.indexOf('hello') === 0;
});
Мы можем написать то же самое, используя Call By Name в RightJS as,
words.filter('startsWith', 'hello');
Довольно сладкий а?? // " >
Я также люблю идею использования строк в качестве селекторов напрямую. Хотя RightJS делает это для делегирования событий на данный момент, но мне бы хотелось полностью избавиться от функции $
для большинства целей и напрямую вызывать методы в строке. Например, чтобы прослушать все клики по любому абзацу на странице, напишите:
'p'.on('click', function() {
this.addClass('clicked');
});
Или, возможно, объединить это с Call By Name,
'p'.on('click', 'addClass', 'clicked');
То, что я взволнован в RightJS 2, - это возможность использовать виджеты в качестве нативных элементов.
var calendar = new Calendar();
calendar instanceof Calendar; // true
calendar instanceof Element; // true
Спасибо @patrick и @Nikolay за разъяснение моего предположения здесь. Виджет будет обернуть собственный элемент DOM, доступный как свойство _
для объекта.
document.body.appendChild(calendar._);
или используйте методы, предоставляемые каркасом.
calendar.insertTo(document.body)
Еще одна приятная функция - это унифицированный способ инициализации виджетов с использованием только декларативного синтаксиса:
<input data-calendar="{format: 'US', hideOnClick: true}" />
вместо того, чтобы самостоятельно создать объект, а затем добавить его на страницу:
var calendar = new Calendar({
format: 'US',
hideOnClick: true
});
calendar.insertTo(document.body);
Я взял слайды из презентации под названием Обзор библиотеки JavaScript от Джона Ресига и сравнил образцы кода для jQuery с RightJS. Эти образцы в основном сравнивают базовый синтаксис для обеих фреймворков, который более похож на другой, хотя RightJS представляется более гибким в его использовании.
Обход DOM
JQuery
$('div > p:nth-child(odd)')
RightJS
$$('div > p:nth-child(odd)')
Модификация DOM
JQuery
$('#list').append('<li>An Item</li>')
RightJS
$('list').insert('<li>An Item</li>')
События
jQuery
$('div').click(function() {
alert('div clicked')'
});
RightJS
$$('div').onClick(function() {
alert('div clicked');
});
AJAX
JQuery
$.get('test.html', function(html) {
$('#results').html(html);
});
или
$('#results').load('test.html');
RightJS
Xhr.load('test.html', {
onSuccess: function(request) {
$('#results').html(request.text);
}
}).send();
или
$('results').load('test.html');
Анимации
JQuery
$('#menu').animate({ opacity: 1 }, 600);
RightJS
$('menu').morph({ opacity: 1 }, { duration: 600 });
Обход массива
JQuery
$.each(myArray, function(index, element) {
console.log(element);
});
RightJS
myArray.each(function(element) {
console.log(element);
});
Ответ 2
Привет, ребята, Николай, автор RightJS.
Благодаря Анурагу он довольно хорошо описал RightJS. И пару нот.
На самом деле вы уже можете смешивать строку String и звонить по имени так же, как описано
"div.boo".on('click', 'toggleClass', 'marked');
Затем в RightJS2, который будет иметь право на выпуск RC2 примерно завтра, вы сможете делать такие вещи, как
"div.boo".onClick('toggleClass');
"div.boo".observes('click'); // true
"div.boo".stopObserving('click');
И вы также сможете использовать любые пользовательские события с ними, точно так же
"div.boo".on('something', 'addClass', 'something-happened');
Пользовательские события в пузыре RightJS2, имеют цели и все, что вам нужно.
Затем о оболочках dom и Calendar
, да, элементы и виджеты будут в одной иерархии dom-wrappers, и вы сможете бросить их так же, как это.
$(document.body).insert(new Calednar(...));
Вы также сможете манипулировать ими на уровне dom, используя прямой доступ к необработанному dom-объекту, например
var calendar = new Calendar();
document.body.appendChild(calendar._);
Кстати: Патрик. Если вы случайно используете Rails, вы также должны проверить плагин Right-rails, есть немало действительно хороших вещей в интеграции JavaScript и Rails.
Тогда, если вы спросите об истинном чувстве работы с RightJS, я бы сказал, это зависит. RightJS был создан для пользователей на стороне сервера, которые использовали для работы с классами и объектами, есть довольно много вещей для быстрой и гибкой разработки, чтобы легко решить простые задачи, но для того, чтобы максимально использовать их, вы должны думать об объектах. Если у вас также был опыт работы с Prototype или Ruby, большинство из них должно быть довольно знакомым, я попытался использовать столько имен методов, сколько мог.
Если все, что вам известно, это jQuery, некоторые вещи могут показаться немного странными с самого начала, но я увидел нескольких парней, которые с радостью перешли из jQuery. Так что, я думаю, все будет хорошо.
Что касается читаемости кода, имхо это абсолютно пинает задницу. Читаемость была одной из основных проблем в разработке RightJS, вы можете прочитать большую часть кода, как простой английский
"div.zing".on('click', 'toggleClass', 'marked');
$('my-element').update('with some text').highlight();
$$('li').each('onClick', 'toggleClass', 'marked');
И так один. Проверьте эту страницу, если вы еще не http://rightjs.org/philosophy
Это о нем. Спросите, есть ли у вас еще вопросы.
Ответ 3
Я конвертер RightJS. Я впечатлен философией, он, кажется, признает, что элементы DOM - это просто данные, где jQuery, кажется, основывает всю свою идентичность на DOM.
Я использую jQuery в своем dayjob, но мне нужно использовать его в сочетании с underscore.js, чтобы делать приятные функциональные функции программирования. В RightJS вы получаете много приятных фишек FP, доступных как методы для собственных объектов.
Вот небольшое сравнение, показывающее, как один и тот же метод работает на простых массивах и dom-коллекциях в правом js:
Некоторые html:
<ul id="test">
<li data-id="one">one</li>
<li data-id="two">two</li>
<li data-id="three">three</li>
</ul>
Массив:
var test = [{"data-id":"one"},{"data-id":"two"},{"data-id":"three"}];
Фильтрация html, довольно похоже:
//jQuery:
var filtered = $("#test li").filter(function(element) {
return $(element).attr("data-id") == "one";
});
//RightJS
var filtered = $$('#test li').filter(function(element) {
return element.get("data-id") == "one";
});
Фильтрация массива:
//you can't do this with jquery because it is DOM-specific.
//you need something like underscore:
//underscore:
var filtered = _.select(test, function(element) {
return element["data-id"] == "one";
});
//RightJS << uses the same .filter() method as used on the html!
var filtered = test.filter(function(element) {
return element["data-id"] == "one";
});
В RightJS я хотел бы видеть некоторые дополнительные вещи, которые подчеркиваются, например .range() и возможность писать в стиле "FP" или "ООП", поэтому я могу использовать RightJS исключительно. Думаю, мне лучше внести свой вклад:)
Сказав это, как я понимаю, большой упор в jQuery в наши дни - мобильная совместимость. Если это является серьезной проблемой, все же лучше всего пойти с jQuery.
Ответ 4
Я думаю, что это лучший возможный вариант естественным образом изменить от prototypeJS. Очень симпатично.
@Nikolay, вы были прототипом JS-пользователя?