jQuery 1.7 Released

http://blog.jquery.com/2011/11/03/jquery-1-7-released/
  • Перевод
jQuery 1.7 готов к загрузке! Можно скачать с jQuery CDN:
code.jquery.com/jquery-1.7.js
code.jquery.com/jquery-1.7.min.js

Так же этот релиз будет готов к загрузке с Google и Microsoft CDNs в течении дня или двух.

Команда jQuery благодарит всех, кто принимал участие в тестировании и и поиске багов в бета-версиях и верит в прочность и стабильность релиза. И просит всех, кто найдёт какие-либо баги, рапортовать о них на баг-трекер и по-возможности подкреплять тестами для воспроизведения на jsFiddle для более быстрого анализа проблем.

Что нового в версии 1.7


Краткий список нововведений можно быстро получить просмотрев описание API с тегом 1.7, а ниже будет описание больших новшеств версии 1.7 и некоторые вещи, которые пока ещё не вошли в документацию по API.

Новый API событий: .on() и .off()

Новый .on() и .off() API делает универсальным и более удобным привязку к событиям в документе.
$(elements).on( events [, selector] [, data] , handler );
$(elements).off( [ events ] [, selector] [, handler] );

Когда указан selector, то метод .on() работает так же, как .delegate() — привязывает обработчики события, фильтруя элементы по селектору. Если же selector не указан или равен null, то вызов работает как обычный .bind(). Существует некоторая неоднозначность: если аргумент data является строкой, требуется явно передавать аргумент selector в виде строки или null, чтобы data не был ошибочно принят за селектор. Передавая в качестве data объект, не требуется специально беспокоится об указании селектора.

Все существующие виды привязок к событиям (и соответствующие им метода отвязки от событий) доступны и в версии 1.7, но рекомендуется использовать именно .on() для новых проектов, где гарантированно будет использоваться версия 1.7 или старше. Ниже приведены небольшие примеры, демонстрирующие аналогичные привязки к событиям с использованием старого и нового API:
$('a').bind('click', myHandler);
$('a').on('click', myHandler);

$('form').bind('submit', { val: 42 }, fn);
$('form').on('submit', { val: 42 }, fn);

$(window).unbind('scroll.myPlugin');
$(window).off('scroll.myPlugin');

$('.comment').delegate('a.add', 'click', addNew);
$('.comment').on('click', 'a.add', addNew);

$('.dialog').undelegate('a', 'click.myDlg');
$('.dialog').off('click.myDlg', 'a');

$('a').live('click', fn);
$(document).on('click', 'a', fn);

$('a').die('click');
$(document).off('click', 'a');


Улучшена производительность делегированных событий (Delegated Events)

Делегирование событий (event delegation) приобретает всё большую важность с ростом размера и сложности страниц. Такие фреймворки, как Backbone и Sproutcore, широко используют делегирование событий. Имея это в виду, обработка событий в jQuery 1.7 была переработана с целью ускорить процесс обработки событий, особенно для наиболее распространённых случаев.

Чтобы оптимизировать код для часто встречающихся видов селекторов, команда jQuery рассмотрела срез с Google Codesearch. Почти две третьих всех селекторов, используемых в .live() и .delegate(), имеют вид tag#id.class, где используются один или несколько тегов, id или классов. В оптимизации разбора этих простых селекторов команда jQuery добилась таких успехов, что смогла обойти даже время нативного matchesSelector браузеров во время обработки событий. Для разбора более сложных селекторов по-прежнему используется Sizzle движок.

В конечном результате имеет почти двукратное ускорение по сравнению с версией 1.6.4:
image

Улучшение поддержки HTML 5 в IE 6/7/8

Любой, кто пробовал использовать новые теги из HTML5, например, такие как <section>, гарантировано имели проблемы не только с тем, что IE 6/7/8 не понимают этих тегов, но ещё и совсем удаляют их из документа. В jQuery 1.7 есть встроенная поддержка тегов HTML5 для старых IE в таких методах, как .html(). Этот механизм реализован на том же уровне, что и ранее innerShiv. По-прежнему требуется подключать HTML5Shiv в секции head документа для поддержки HTML5-тегов в старых IE. Подробности смотрите на The Story of the HTML5 Shiv.

Интуитивная работа переключения анимации

В предыдущих версиях jQuery переключение анимации, такое как .slideToggle() или .fadeToggle(), не срабатывало правильно, если несколько анимаций были запущены последовательно и предыдущая была прервана методом .stop(). Это было исправлено в версии 1.7, теперь перед запуском анимации запоминаются начальные значения, и происходит сброс значений, если переключение анимации было прервано преждевременно.

Asynchronous Module Definition (AMD)

Теперь jQuery поддерживает асинхронное определение модуля — AMD API. Это не означает, что jQuery является загрузчиком скриптов (script loader); jQuery всего лишь использует AMD-совместимую модель определения модуля, поддерживаемую, например, RequireJS или curl.js, поэтому jQuery может быть подключена динамически таким загрузчиком, и событие ready также является подконтрольным ему. Теперь AMD-совместимые загрузчики могут подключать немодифицированную версию jQuery с CDN (например, от Google или Microsoft). Особая благодарность выражается James Burke (@jrburke) за предоставленные патч и тесты и ожидание включения их сборку.

jQuery.Deferred

Объект jQuery.Deferred был расширен новыми обработчиками прогресса и методами уведомления, вызывающими этими обработчики. Это позволяет асинхронно уведомлять слушателей о прогрессе исполнения без завершения или отмены запроса. Дополнительно появился метод state(), который возвращает состояние Deferred-объекта, это в первую очередь полезно при отладке.

Теперь Deferreds реализованы через использование новой функциональности — jQuery.Callbacks, обобщающей функции вызова очереди или серии колбэков. Эта новая функциональность может быть интересно писателям плагинов, хотя Deferreds и система событий обеспечивают более высокий уровень подобной функциональности.

jQuery.isNumeric()

Внутри jQuery было найдено несколько ситуаций, когда необходимо знать, является ли аргумент числом или может быть успешно сконвертирован в число. И было решено написать и задокументировать метод jQuery.isNumeric() как полезную утилиту. Передайте внутрь него любой аргумент и получите true или false в качестве результата.

Удаленная функциональность


event.layerX и event.layerY: в версии 1.7 удалены эти нестандартные свойства. Хотя ранее они никому не мешали, Chrome 16 показывает множество предупреждений в консоли. Поэтому было решено отказаться от них и удалить. Там, где ещё поддерживаются эти свойства, они будут доступны через event.originalEvent.layerX и event.originalEvent.layerY.

jQuery.isNaN(): эта недокументированная утилита была также удалена. Она имела имя встроенной функции JavaScript, но семантически не соответствовала ей. Новая функция jQuery.isNumeric() позволяет делать тоже самое. Несмотря на то, что функция jQuery.isNaN() была недокументирована, некоторые проекты на Github использовали её. Команда jQuery связалась с ними и предупредили о проблеме и возможных решениях.

jQuery.event.proxy(): этот недокументированный и устаревший метод был удалён. Вместо него следует использовать задокуентированный метод jQuery.proxy.

Прочие благодарности и change log со списком всех поправленных багов можно прочитать в конце оригинальной статьи blog.jquery.com/2011/11/03/jquery-1-7-released
Поделиться публикацией
Похожие публикации
AdBlock похитил этот баннер, но баннеры не зубы — отрастут

Подробнее
Реклама
Комментарии 63
  • +18
    Классно! Классно то, что проект очень быстро развивается. Классно, что ребята огромное внимание уделяют производительности и каждый новый релиз это подтверждает.
    Но блин! Ребята, я не успеваю за вами ))))
    PS: Пойду, change log почитаю.
    • –20
      Ребята, все круто, я понимаю, что здесь большинство Web-программистов, но вы реально собираетесь писать о каждом релизе jQuery?.. Давайте тогда анонсировать каждый новый выход C++ Boost, например…
      • –11
        Зарелизился jQuery — напиши на Хабре.
        • +2
          Если понимаешь, зачем чушь спрашиваешь?
          • +13
            А по-вашему такие релизы случаются каждый вторник? Весьма существенное обновление.
            • +12
              Так анонсируйте же. Или за вас это должны делать web-программисты?
              • +2
                Слушайте, это большой интересный релиз, изменения в котором скажутся на моей повседневной работе.
                Как же об это не писать?
            • +3
              Двойственные чувства вызывают .on() и .off(). С одной стороны, унифицировать все и вся это очень JQuery way, а с другой стороны, когда видишь в коде
              $('.hello').delegate('click', '.world', fn);
              вместо
              $('.hello .world').click(fn);
              это дополнительный звоночек о том, что с этим самым '.world' может что-то оказаться «нечисто».
              • 0
                А они старые методы никуда не дели. Пока что .bind(), .delegate(), .live() остаются, но не рекомендуемы, а .click() и прочие т.п. сокращения так и останутся и далее — их никто отменять не собирается.
                Так что замените в вашем примере .delegate() на .on() (даже список параметров менять не надо) и продолжайте подозревать «нечисто» :)
                • 0
                  По присутствию селектора появится дополнительный звоночек что может что-то оказаться не чисто =)
                  • 0
                    Ещё если document в наборе — то тоже :)
                  • 0
                    Насколько я правильно помню метод .delegate(), в первом случае, если в селектор .hello после загрузки DOM вставить селектор .world и нажать на последний, то вызовется функция fn, во втором вашем случае, если внутри .hello вдруг появится .world и кто-то по нему кликнет, ничего не произойдет.
                    • 0
                      Да, все верно. Под «нечисто» я понимал как раз то, что '.world' это какой-то динамически появляющийся элемент
                  • 0
                    В чем разница между $('a').on('click', myHandler); и $(document).on('click', 'a', fn);?
                    • +1
                      Первое повесит хендлер единожды, второе будет кроме этого отслеживать появление
                      <a>
                      в DOM'e.
                      Собственно .live малость устарело еще до 1.7 и нужно было юзать .delegate вместо этого.
                      • 0
                        As of jQuery 1.7, the .live() method is deprecated.

                        Название у метода, мягко говоря, несемантичное.
                        • +4
                          У лайва клёвый обратный метод был — die.
                        • +5
                          > второе будет кроме этого отслеживать появление <a> в DOM'e.
                          Неверно. Никто не будет отслеживать никакого появления элементов. События в DOM всплывают на родительские элементы, поэтому document получит все клики, на каком бы элементе они не были. Следовательно, повесив один обработчик на document и проверяя event.target на соответствие селектору 'a', можно обрабатывать все события клика на этих элементах.
                          • +1
                            В одном из комментариев выше кто-то сравнил два варианта:
                            $('.hello').delegate('click', '.world', fn);
                            $('.hello .world').click(fn);
                            Безотносительно того комментария, из которого взят пример, задам свой вопрос. Правильно ли я понимаю, что:
                            1. в первой строке сначала будут найдены все элементы класса hello и на каждый из них будет повешен делегат, который будет отслеживать всплытие событий click от дочерних .world
                            2. во второй строке никаких делегатов нет, просто на все элементы удовлетворяющие селектору ".hello .world" будут повешены обработчики click.

                            Соответственно, строки не равнозначны. В первом случае, при динамической вставке нового .world элемента в один из ранее существовавших .hello, при клике на новый .world будет вызвана функция fn. Во втором случае, в аналогичном эксперименте, функция fn вызвана не будет.

                            Я правильно всё понял?
                      • +1
                        Второй вариант работает абсолютно так же, как метод .live(), а первый — как обычный .bind(). Если знаете подробности — то вот она разница, если нет — то я дал вам подсказку, куда копать.
                      • +10
                        Нужно уже включить jQuery в состав JS всеми браузерами изначально и оперативно обновлять его. :) Думаю, что jQ имеет большую популярность, чем MooTools, PrototypeJS, YUI, ExtJS итп. Даже яндекс юзает jQ.
                        • 0
                          А вас не смущает при этом, что jQuery для производительности удаляют код для обратной совместимости? Думаете по какой причине амазон до сих пор пользуется jQuery версии 1.2.6?
                          • 0
                            ИМХО, достаточно и самых ранних версий. Хватит хорошего селектора и бинда на события + .css, .val, .attr, .animate ну и fadeIn/Out, slideDown/Up/Toggle анимаций. Большего и не нужно. :)
                            • –2
                              1. «хорошего селектора» — document.querySelector, .querySelectorAll
                              2. «бинда на события» — есть Function.prototype.bind

                              А всё остальное весьма спорно. Как минимум будет 10 точек зрения относительно синтаксиса.
                            • +1
                              А windows и x86 делали обратное. Очень совместимо, но сегодняшний офис грузится дольше чем хп или 1997 версия в соответствующих годах. Если учесть закон Мура, то становится страшно за то что они там воротят в потрохах системы.
                              • 0
                                Скорее по причине оттестированности амазоном именно этой версии кода. Обновлять библиотеку и тестировать весь js на совместимость с новой версией — это дорого.
                                • 0
                                  угу я тоже недавно обновился с 1.2.6.

                                    $('#something').css('borderWidth',10);
                                    var a = $('#something').css('borderWidth');
                                  


                                  Угадайте чему равно a в 1.2.6 и в более поздних релизах.
                                • 0
                                  Лишние 80Кб иногда не особо хорошо кладутся в высоконагруженные сервера.
                                  • +2
                                    Если я не ошибаюсь, то jQuery уж можно точно положить в кэш. Со стороны nginx'а или(и) со стороны браузера. Физически посылать заголовки о кэшировании. Не слышал ни разу, что высоконагруженные сервера — это минимум css, js файлов… Простите, но ИМХО — бред.
                                    • 0
                                      Посмотрите сорцы www.ya.ru, например.
                                      • +2
                                        <script src="//yandex.st/jquery/1.4.2/jquery.min.js"></script>

                                        Вы про это? CDN никто не отменял.
                                        • 0
                                          Что я там могу нового увидеть?
                                          Даже яндекс юзает jQ.

                                          Когда я это писал выше — это я и имел ввиду.
                                      • 0
                                        Теоретически jQuery можно пересобрать, выкинув лишнее. Об этом говорил Paul Irish.
                                        • +1
                                          Теоретически — да, на практике же форкать такую махину (да и любую либу) окажется себе дороже.
                                          • +2
                                            Да не то чтоб и махина. Я в своё время именно прочитав его исходники изучил яваскрипт и влюбился в него. Другое дело Ext.js.
                                      • 0
                                        У меня тоже часто возникают мысли о такой конструкции
                                        <script type="text/javascript" src="jq.js" commonly-used-library="jquery;version=1.7"></script>
                                        <script type="text/javascript" src="less.js" commonly-used-library="less;version=1.1.3"></script>
                                        • 0
                                          Кто-нибудь может сравнить (или видел внятное сравнение в интернете) jQuery и YUI 3.x?
                                        • 0
                                          С такой скоростью выхода новых версий, после ознакомления со спецификацией и внедрения всех возможностей в проекте понимаешь, что уже снова требуется ознакамливаться с новой спецификацией и заниматься внедрением новой версии в проекте. Никто конечно не заставляет поддерживать в своем проекте актуальную версию, но тем не менее, при желании так делать, ситуация получается забавная.
                                          • +1
                                            Жизнь каждый день ставит перед нами задачи разного уровня сложности.
                                            Обновления jQuery — ничтожнейшая из проблем.
                                          • +1
                                            Еще порадовало, что документацию обновили. Особенно довабили jQuery UI в общую документацию.
                                            Очень порадовала модульность. Только еще-бы пример, как jQuery в качестве модуля к requireJS запустить, скажем.
                                            Жаль также не упомянули про темплейты. Они хоть в бете, но все равно интересно.
                                          • –2
                                            Как лучше всего изучить jQuery?
                                            я имею в виду не примеры по созданию слайдеров и менюшек, а подробное рассмотрение всех функций. Книги тоже быстро устаревают, появляются новые методы, старые становятся запрещенными. Что делать?
                                            • +1
                                              http://code.jquery.com/jquery-1.7.js — и, к сожалению ли, к счастью ли, никак иначе.
                                            • 0
                                              А документация чем вам не угодила?
                                              • 0
                                                насколько я заметил там не пишут о том, какие методы лучше использовать, не раскрываются основы работы. Конкретно методы и функции и их использование.
                                                • 0
                                                  Конкретно методы и функции и их использование.

                                                  Там и есть именно методы, функции и их использование.

                                                  Или вы про работу самого jQuery?
                                                  • +1
                                                    Читайте книги, благо их есть.

                                                    Очень часто сайты с примерами грешат тем, что не указывают версию.
                                                    В результате некоторые пытаются применить .index() в том варианте, в котором его нет в используемой версии.
                                                    • 0
                                                      я про книги и говорю, описанные в них методы работы уже не актуальны к выходу книги в свет
                                                      • 0
                                                        Безусловно, некоторое отставание есть, но вы его преувеличили. А если дружить с языками, то отставание ещё меньше.

                                                        Отличной книги jQuery in Action habrahabr.ru/blogs/books/105968/ будет достаточно, чтобы взять рубеж. Копить по периферии в любом случае придётся самостоятельно из разрозненных источников.
                                              • 0
                                                А вообще, конечно, смотря как ставить вопрос: «Как с этой хренью работать» или «Как эта хрень работает». Ключ к ответу на первый вопрос — в опыте и исследовании документации применительно к конкретной задаче (копать в воздух и писать хэллоуволды занятие скучное и малопознавательное). А второй вопрос решается изучением исходников.
                                                  • 0
                                                    Попробуйте начать писать на jQuery чтобы изучить его
                                                    • 0
                                                      вопреки расхожему мнению я не считаю, что писать на языке (а jquery я не считаю библиотекой, его можно назвать уже полноценным языком) нужно сразу, не понимая принципов работы.
                                                      • +2
                                                        Конечно не нужно, но принципы работы понимаются действительно из домунтации, а опыт использования jQuery API (тонкости и подводные камни) понимаются только при использовании.

                                                        А еще я категорически несогласен с утверждением, что jQuery это больше чем библиотека. Это именно библиотека, и если вы плохо знакомы с JavaScript, то врят ли по-настоящему поймете как она работает и что происходит внутри.

                                                        Мне вот недавно коллега показывал неработающий код на JS (с использование jQuery), и сказал «наверное тут проблема в том, что когда jQuery парсит код ...». Коллега отнюдь не глупый человек и хороший программист в других языках программирования.
                                                        • 0
                                                          да, пожалуй, вы правы
                                                    • +1
                                                      Меня смущают ваши 70% знания jQuery из резюме.
                                                      • +1
                                                        Начните с этого www.rsdn.ru/article/inet/jQuery.xml
                                                    • НЛО прилетело и опубликовало эту надпись здесь
                                                      • 0
                                                        Мой лозунгомер зашкалило.

                                                      Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.