Что такое jQuery и зачем он нужен?
Те, кто давно меня читают — знают что я люблю jQuery. Когда-то я любил нативный JavaScript и писал все на нем, но потом понял что в этом нет особого смысла почти всегда.
Но обо всем по порядку.
Что такое jQuery?
Это JavaScript-фреймворк. Ничего страшного в этом слове нет. Можете считать, что это набор полезных функций, которые позволяют удобно делать то, что обычно требуется делать при помощи JavaScript.
Первый довод за использование jQuery — кроссбраузерность. Реально, вы знаете сколько разных синтаксисов у JS? Туча! Чего стоят хотя бы способы работы с Ajax. Во всех браузерах работа эта организована по-разному. С jQuery все единообразно.
Второй довод, кстати, тоже касается Ajax. С jQuery использовать его становится очень просто. Достаточно написать одну строку кода. Вообще, многие задачи, которые решаются на JavaScript небольшими функциями на jQuery решаются одной строкой. А если мы говорим о визуальных эффектах, так там вообще.
В общем, аякс на jQuery сделан очень просто и понятно. Это две функции get() и post() для разных методов отправки данных соответственно.
Третий довод — прозиводительность. Я использую jQuery и никуда не хочу с него слезать. Существует множество других фреймворков, которые делают примерно то же самое. Но jQuery самый быстрый из них.
Четвертый довод — общедоступность и распространение. На данный момент jQuery используют Яндекс и Google. И брать ее можно с их серверов. Например, вот JavaScript-хостинг Яндекса. Для того, чтобы подключить jQuery на любую вашу страницу достаточно просто вставить строку:
<script type="text/javascript" src="http://yandex.st/jquery/1.6.0/jquery.min.js"></script>
Все. Теперь jQuery у вас подключена. Можно пользоваться.
Пятый довод — это наличие не большого, а просто огромного количества плагинов для jQuery. Хотите фотогалерею? Тыщи их! Хотите возможность делать диалоговые окна? Тултипы? Балуны? Экранные лупы? Клавиатуры? Пользовательские интерфейсы? Что? Что вам надо? Я уверен, jQuery это умеет — надо лишь найти плагин.
Что, я еще не убедил вас?
А как на счет большого сообщества (в том числе — русскоязычного) и внятнейшей документации с примерами?
В общем, если мне нужно на сайте написать что-то большее чем alert — я использую jQuery. Конечно, не всегда оно нужно — надо головой соображать все-таки. Но попробовав раз, слезть реально трудно.
Спонсор этого поста — рекламное агенство Паровоз, которое предлагает купить рекламные стенды. Это будет вам интересно если вы из Нижнего Новгорода. Не забывайте, что стенды считаются одним из наиболее эффективных носителей для размещения рекламы.
Еще решил ради прикола зарегиться на блоговаре. Вот код подтверждения: f5097c45aa0ab9b76025ba6553fbaa97. Посмотрим что из этого выйдет. Если вы тоже там — знайте — я выращиваю трафку.
Твитнуть
Понравилась статья? Поставь плюс один!
Что такое jquery – общие понятия и определения
Приветствую всех читателей и подписчиков моего блога! Изучая JavaScript, я несколько раз упоминал о библиотеке jQuery и давал вам только поверхностные знания о ней. Начиная с текущей публикации, вы сможете детально изучить, что такое jQuery и для чего он нужен, познакомиться с основными инструментами библиотеки, узнать, где применяются скрипты и какими преимуществами обладает сам jQuery. Но это чуть попозже, а сегодня я введу вас в курс дела. Ну что ж, поехали!
Экскурс в историю
Создателем библиотеки стал Джон Резиг, американец, который в свое время был JavaScript-евангелистом. В начале своей программистской карьеры Джон работал в Brand Logic на полставки и заинтересовался языком JavaScript, который впоследствии изучил вдоль и поперек.
Немного позже после написания множества приложений он создал библиотеку jQuery. Впервые она была представлена в 2006 году на «BarCamp» – международной конференции, проходящей в Нью-Йорке.
Главной целью своего детища Резиг назвал возможность написать такой код, который будет упрощать JS и при этом позволит не беспокоится о кроссбраузерности. И это действительно так.
Библиотека значительно упрощает множество решений на JavaScript и превращает увесистые куски кода в несколько строк. К тому же она прекрасно работает во всех браузерах и самое главное одинаково. Так что разработчику не надо заморачиваться с настройкой работы кода под особенности последних.
Преимущества и недостатки
Для того чтобы у вас сложилось некоторое впечатление о данной технологии, я расскажу вам о ее особенностях.
jQuery обладает множеством преимуществ, которые действуют как бальзам на душу в большинстве ситуаций. Для удобства я их структурировал и перечислил ниже.
- Кроссбраузерность. Как я уже упоминал выше, данная библиотека поддерживается во всех браузерах и приложения работают практически идентично в любом из них. Такого, к сожалению, не всегда можно сказать о JavaScript.
- Простота. Несмотря на огромное количество дополнительных функций и несколько отличающийся синтаксис от основного языка, jQuery очень прост как для изучения, так и для понимания. А если вы уже плавали среди программного кода на JS, то изучение описываемой библиотеки не составит труда.
- Компактность. Одно из моих любимых преимуществ, так как реализация многих задач значительно сокращается в плане количества написанных строк. Всего лишь грамотно продуманное решение таска и код можно сократить втрое!
- Совместимость. К огромному счастью, все версии библиотеки полностью совместимы друг с другом. Поэтому переход от старых версий к новым не должен вызвать у вас трудностей.
- Дружба с AJAX. Считаю это также нужно вынести в преимущества. В jQuery очень удобно работать с AJAX, а без него не обходится большинство качественных сайтов. Для тех, кто не знает скажу, что AJAX нужен для построения интерактивных интерфейсов веб-приложений для пользователей. Он позволяет перегружать не всю страницу, а только ту часть, которую стоит изменить вследствие каких-то действий юзера, что значительно ускоряет работу сервиса.
- Возможности. Детище Резига наделено огромным количеством дополнительных возможностей, функций и теперь уже дополнительными библиотеками, основанными на jQuery. В качестве примера я назову две наиболее популярные. Начнем с Query UI. Это библиотека, благодаря которой можно получить готовые плагины, эффекты, темы, виджеты и многое другое. Для работы ее нужно скачать и после подключать в хедере документа. Второй не менее популярной считается jQuery Mobile. Эта библиотека облегчает жизнь разработчикам мобильных приложений.
Как видите, положительных моментов достаточно для того, чтобы захотеть работать с этой технологией. Однако моя публикация была бы односторонней, если бы сейчас мы не перешли к недостаткам.
- Типизация. Так как библиотека написана на JavaScript, у нее отсутствует типизация данных. Это несколько замедляет работу кода. К тому же «словить» ошибку можно только во время выполнения этой строки с багом. До этого программа не знает, какие типы переменных задействованы, а значит компилятор никак не поможет.
- Время компиляции. При открытии любого веб-ресурса запускаются и скрипты. Это также влияет на скорость выполнения приложения.
Из главных недостатков это, пожалуй, все. Они не катастрофичны, но все же существуют.
А как же подключить библиотеку в программном коде?
Для начала необходимо скачать нужную версию jQuery себе на компьютер. Я прикрепил ссылку на официальный сайт, откуда желательно скачивать данную технологию: http://jquery.com/download.
Просто определитесь с ссылкой, нажмите на нее правой кнопкой мышки и выберете «Сохранить как…». Если вы не можете определиться с версией, то сначала прочтите документацию на официальном сайте о каждой из них.
Следующий этап – загрузка полученного документа на сервер с приложением и после подключение к самому коду через тег <script>:
<script type=»text/javascript» src=»js/jquery.min.js»></script>
Однако это не единственный вариант. Если нет желания качать библиотеку, то можно совершить подключение с CDN. Для этого в атрибуте src нужно написать полный путь к хранилищу.
В качестве примера я приведу строку с ссылкой на CDN, организованный создателями описываемого инструмента.
<script src=»http://code.jquery.com/jquery-1.8.3.js»></script>
Хочу отметить важную деталь: как вы уже поняли, в зависимости от того, откуда вы взяли jQuery, src может отличаться. Так что перед подключением уточняйте данный параметр.
Стоит подытожить
Вот и подошли к окончанию вводной публикации. Я постарался составить общее впечатление о технологии и рассказать о ее создании. Как видно, библиотеке около 10 лет, однако благодаря своим создателям, она совершенствовалась и дополнялась каждый год.
Поэтому сегодня ее подключают ко многим веб-сервисам, в том числе написанным и на движках таких как Joomla, WordPress и другие. jQuery нельзя назвать самой лучшей библиотекой, ведь существуют и другие мощные решения, однако она входит в группу лидеров.
Если вам интересно дальше изучать описываемый инструмент, то добро пожаловать в текущую рубрику! Здесь вы найдете полезные статье о том, как его использовать и в каких ситуациях, узнаете об интересных плюшках и сможете опробовать библиотеку, решая практические задания.
Так же я рекомендую вам курс Евгения Попова Javascript + jQuery для начинающих, в котором для новичков рассказываются все азы работы с библиотекой jquery. Ознакомиться с курсом можно по ссылке.
Обязательно подписывайтесь на обновления моего блога и рассказывайте о нем своим друзьям. Желаю удачи в обучении! Пока-пока!
С уважением, Роман Чуешов
Загрузка…Прочитано: 132 раз
Почему говорят что jquery не нужен? — Хабр Q&A
Скрипач не нужен, родной (с)Аргументы против jq:
— современные браузеры достаточно хорошо поддерживают единый синтаксис современного екмаскрипт(native js)(на самом деле нет).
— сторонняя библиотека, работает медленнее чем натив и в основном состоит из с-сахара (тоже не совсем правда)
— тащить еще один ресурс весом от 64 кб до 200 кб, еще и со сторонних ресурсов замедляет загрузку( правда, но бред)
Аргументы за:
— Современные браузеры как и всегда один другого «ровнее», всегда есть косяки и «нюансы», на которые еще и попадаешь обычно в самый неподходящий момент, в жк обычно все работает одинаково везде, ну или лучше чем в нативе.
— В жк реализована куча плюшек в 1 функцию которые в нативе занимают «многабукав», не каждый начинающий напишет их правильно, да и профи не все напишут оптимально, уверен что в большинстве случаев написанный нативом функционал будет хуже аналога из жк.
— размер мин пакета жк 64 кб, и все они лежат на быстрых цдн серверах. Думаю это последнее что может повлиять на скорость загрузки страницы.
— есть ОГРОМНОЕ количество скриптов написанных с учетом жк, не использовать их глупо, писать свой велосипед — вообще только в целях обучения(не берем крайние случаи когда плагин писал упоротый пингвин).
— Синтаксис и краткость записи — вообще вне конкуренции.
— Старые браузеры никто не отменял, часто заказчик требует чтобы работало в ие8, натив не канает или доставляет море анального удовольствия.
Вывод: Если ты крут в жс, еще и работаешь в ангуларе/ещечетамдляфронта и тебе нужно сделать 2 действия в очень современных браузерах — jquery не нужен, и ты это сам знаешь. Если слова ангулар, вуе и проч для тебя не больше чем шум листвы за окном, а навесить плагинов и эффектов нужно — jquery наше все.
UPD: для всех кто там отписался а ля «в связи (…), исчезновением проблемы совместимости со старыми IE (что и было основным назначением jQuery).
Нужен ли вам jQuery? По полочкам. Сниппеты You Don’t Need jQuery / VSC, Sublime Text
Всем привет, друзья! Сообщество веб-разработчиков в последнее время разрывает дикий баттхёрт относительно того, стоит ли использовать jQuery в своей работе. Одни топят за то, что нужно использовать эту библиотеку во всех проектах без исключения, другие не могут понять, что вообще происходит и продолжают делать то, что делали раньше. Третьи, чтобы не отрываться от коллектива, осваивают последний ECMAScript, всячески открещиваются от jQuery и бомбят при любом упоминании этой библиотеки. Сегодня мы разберёмся в вопросе более подробно, без крайностей и максимализма.
Поделиться
Твитнуть
Поделиться
Класснуть
Запинить
Полезные ресурсы урока:
В конце выпуска мы познакомимся с коллекцией сниппетов You Don’t Need jQuery, которую я подготовил для редакторов Visual Studio Code и Sublime Text. Эта коллекция послужит отличным помощником, если вы вдруг проснулись и поняли, что жизнь слишком проста и нужно писать код исключительно на ванильном JS. Кроме того, в грядущем большом курсе Джедай вёрстки 8, в качестве академического примера, мы будем верстать без использования jQuery, на чистом JS и представленная коллекция будет очень кстати.
jQuery – это самая популярная в мире JS библиотека, позволяющая значительно упростить процесс взаимодействия с элементами DOM, а также предоставляющая удобный API для работы с событиями и AJAX.
Здесь я не буду защищать ни одну из сторон, так как это бессмысленно. Это не конкуренция и сокращение «vs» (versus) ставить между jQuery и нативным JS просто некорректно. Когда надо, я использую jQuery, когда не надо, не использую. jQuery — это инструмент, созданный для того, чтобы максимально сократить время разработки. Здесь я даже не говорю о краткости записи, ведь нативный JS не стоит на месте, стандарты ES развиваются и нативный код становится короче. Дело не в этом.
Главное преимущество jQuery – это тысячи готовых плагинов и расширений, которые можно подключить к проекту и настроить всего за несколько минут. Второе важнейшее преимущество — это проверенная, оттестированная, железобетонная кроссбраузерность и поддержка всего, что может отображать веб-страницы с поддержкой JavaScript.
Но, давайте по-порядку рассмотрим все аргументы «за» и «против» использования jQuery, а затем перейдём к примерам проектов, в которых целесообразно использовать эту библиотеку.
Аргументы в пользу jQuery
- Кроссбраузерность. jQuery учитывает особенности работы со всеми возможными браузерами (с поддержкой JS, конечно-же), имеет все необходимые фолбеки и запасные варианты реализации. Ваш код будет работать везде. В противовес, НЕ использование jQuery потребует от вас больше временных затрат и усилий для написания и тестирования вашего кода.
- Вариативность. Функции jQuery включают огромное количество вариантов и возможностей использования, что делает их максимально универсальными и лаконичными. Использование ванильного JS предполагает написание намного большего количества кода, условий и проверок для реализации аналогичного функционала, даже если речь идёт о какой-то специфической задаче, где не требуется особая универсальность.
- Расширения. Тысячи готовых плагинов, расширений, примеров, сниппетов готовы к использованию. Вам не придётся писать свой велосипед для решения типовой задачи. Можно сказать, что это самое важное преимущество jQuery. Писать плагины для jQuery также легко, как писать любой другой код с использованием этой библиотеки. Именно поэтому jQuery так нравится многим веб-разработчикам. Сейчас можно найти абсолютно любой плагин, который поможет быстро решить любую задачу в условиях коммерческого проекта. А в заказной разработке, если вы фрилансер или студия, время — деньги.
- Сообщество. Огромное количество уроков, примеров кода, решений на сайтах QA. Можно очень быстро найти решение любой задачи, моментально найти ответ на любой вопрос и продолжить работу.
- Краткость записи. Нативный JS, не смотря на своё развитие, пока что не может предложить такие-же возможности краткой записи. jQuery – это простой, лаконичный код, понятный даже начинающим и довольно простой в изучении.
- CMS. Практически все популярные CMS, такие, как OpenCart, Joomla, WordPress, используют библиотеку jQuery. Это огромный плюс, ведь возможности этой библиотеки как во фронтенде, так и в бэкенде любой CMS, как правило, реализованы по максимуму и вопроса — подключать jQuery для десяти кастомных строк кода или нет, не стоит. Пользуйтесь в своё удовольствие.
Аргументы против jQuery
- Библиотека jQuery загружается в проект как дополнительный ресурс. Можно много спорить относительно того, стоит ли загружать файл, весом 100кб к проекту, чтобы написать всего 5 строчек кода, в то время, когда каждая из картинок на странице весит гораздо больше, а их там, на минуточку, могут быть сотни. Также, следует учитывать и все подключённые плагины, сниппеты и другие ресурсы, использующие jQuery, чтобы понять целесообразность подключения библиотеки.
Зачастую это главный и единственный аргумент против использования jQuery и предмет спора в сообществе. jQuery хоть и крайне маленький ресурс, однако его нерациональное использование может серьёзно пошатнуть психику кодера-перфекциониста.
Само по себе понятие «библиотека» в программировании довольно простое для понимания. В процессе работы с каким-либо языком программирования, разработчики сталкивались с определёнными задачами, однотипными проблемами, решения которых в результате были объединены в библиотеки для удобного повторного использования. Отсюда и возникают все плюсы и минусы использования библиотек. Плюс — проверенный код на любой случай жизни, минус — много того, что не используется здесь и сейчас также подтягивается в проект.
Можно услышать и некоторые другие аргументы против использования jQuery, вроде того, что эта библиотека замедляет работу браузера и работает медленнее нативного кода. Это весьма сомнительные заявления, не подкреплённые никакими фактами, экспериментальными выводами и результатами тестов. Как показывает практика, никакого негативного влияния на скорость работы браузера библиотека не оказывает, а код работает также быстро, как и нативный, ведь он, по-сути и является нативным — все функции jQuery не имеют какой-то космически-сложной структуры, которая хоть как-то влияла бы на скорость исполнения.
Использовать или не использовать jQuery?
В первую очередь, не стоит отказываться от jQuery в заказной или тиражной разработке сайтов. Эти области достаточно хорошо стандартизированы и автоматизированы. Можно получить потрясающий результат, используя популярные фреймворки, вроде Bootstrap и библиотеки, вроде jQuery, совместно с крутыми известными плагинами. Если вы видите в дизайне элементы, блоки или секции, которые проще и быстрее реализовать с использованием jQuery и плагинов, вперёд!
Вообще, jQuery можно использовать практически в любых проектах, если вы уверены, что будет задействована достаточная часть библиотеки и не используется какой-либо JS-фреймворк. Конечно, никто не запретит подключить библиотеку к проекту и написать пресловутые 5 строк кода. Осудить вас может, пожалуй, только вышеупомянутый кодер-перфекционист, если случайно заглянет в ваши исходники. Ему лучше на глаза не попадаться, чтобы не случился очередной приступ паранойи и неконтролируемого гнева. А если серьёзно, то в таких случаях библиотеку можно и не использовать, а посмотреть вариант решения задачи в сниппетах для редакторов кода, которые я подготовил к данному выпуску (см. Полезные ресурсы урока).
Кроме того, не стоит использовать jQuery, если вы планируете делать уникальный сложный проект, который будет бесконечно развиваться. Зачастую, над такими проектами работает большая команда и функционал фронтенда выходит далеко за пределы возможностей библиотеки jQuery.
В настоящее время огромное количество контентных проектов, крупных СМИ, коммерческих сайтов и многих известных ресурсов используют jQuery, так как функционал этой библиотеки достаточен и значительная его часть реализована. Это и есть основные критерии грамотного использования любого ресурса.
Коллекция сниппетов для Visual Studio Code и Sublime Text.
Для того, чтобы облегчить написание нативного JS, если до этого вы использовали только jQuery, я подготовил коллекцию сниппетов для редакторов Visual Studio Code и Sublime Text, основанную на популярных примерах You Don’t Need jQuery (см. Полезные ресурсы урока). Сниппеты устанавливаются и работают с редакторами кода штатным образом. В коде каждого сниппета есть закомментированный пример, написанный с использованием jQuery и его альтернатива в нативном исполнении:
Установка в Sublime Text
Для установки сниппетов в редактор Sublime Text достаточно скачать архив с GitHub и распаковать папку «YDNjQ — Sublime Text Snippets» в директорию «ПОЛЬЗОВАТЕЛЬ \ AppData \ Roaming \ Sublime Text 3 \ Packages \ User», которую можно открыть из редактора: Меню «Preferences > Browse Packages…», затем перейти в папку User:
Установка в Visual Studio Code
Процесс установки сниппетов в кодовый редактор Visual Studio Code не на много сложнее. Скачиваем тот-же самый архив с GitHub и выгружаем содержимое папки «YDNjQ — Visual Studio Code Snippets» в папку «ПОЛЬЗОВАТЕЛЬ \ AppData \ Roaming \ Code \ User \ snippets». Обратите внимание, что необходимо выгрузить именно содержимое папки «YDNjQ — Visual Studio Code Snippets», то-есть весь список файлов:
После установки сниппеты доступны по ключевым словам jQuery-функций. Например, «hide», «fade», «load» и т. д. Для использования в Sublime Text достаточно набрать нужное сокращение и нажать Tab, или нажав Ctrl+Shift+P, ввести ключевое слово и выбрать нужный сниппет с префиксом YDNjQ. В редакторе Visual Studio Code достаточно нажать F1 > Insert Snippet, ввести ключ сниппета и выбрать нужный.
И в заключение. Хотите использовать jQuery или какую-либо другую библиотеку в вашем проекте — используйте на здоровье. Грамотно и рационально.
Премиум уроки от WebDesign Master
Другие уроки по теме «jQuery»
Рассказ о том, почему я до сих пор использую jQuery / RUVDS.com corporate blog / Habr
Многие, когда речь заходит о jQuery, говорят так: «Просто пользуйтесь обычным JavaScript. Библиотека jQuery вам не нужна». Что тут сказать? Я не нуждаюсь во многих вещах, но, несмотря на это, хорошо, когда они есть. Так и jQuery. Я в этой библиотеке не нуждаюсь, но её, определённо, приятно иметь под рукой.Сайты наподобие You might not need jQuery (YMNJQ) продвигают идею, в соответствии с которой от jQuery очень легко избавиться. Но самый первый пример на этом сайте демонстрирует вескую причину jQuery использовать. Там строка простого кода на jQuery заменяется на 10 строк обычного JS!
Большинство API JavaScript, в особенности те из них, которые нацелены на работу с DOM, оскорбляют мои эстетические чувства. Это — если мягко выразить моё к ним отношение. Если же говорить прямо, то я думаю, что эти API — полный кошмар. Например, конструкция el.insertAdjacentElement('afterend', other)
, безусловно, работает. Но куда приятнее выглядит $(el).after(other)
. Хотя мне никогда особо не нравился внешний вид функции $()
, она несравненно лучше, чем то, что дают нам стандартные API для работы с DOM. Я знаю о том, что вместо $()
можно использовать нечто вроде jQuery(sel)
или window.jq = jQuery
. Но программирую я не в безвоздушном пространстве. Поэтому предпочитаю пользоваться стандартными приёмами. Не знаю, хорошо это или плохо, но стандартом при использовании jQuery стала конструкция $()
.
Попытайтесь быстро вспомнить о том, как получить элемент-сосед другого элемента средствами DOM. Что для этого использовать — nextSibling
или nextElementSibling
? А в чём разница? А какие браузеры поддерживают тот или иной метод? Пока вы пытаетесь это вспомнить и заглядываете на MDN, проверяя себя, я, пользуясь jQuery, просто пишу next()
или prev()
.
Выполнение многих обычных операций реализовано в JavaScript-API неудобно. Я мог бы привести тут целый список таких операций, но за меня это отлично сделано на странице YMNJQ.
Для решения различных простых задач средствами JS нужны вспомогательные функции. И на сайте YMNJQ, опять же, можно найти немало примеров. Использование jQuery представляет собой стандартный способ включения в код проектов таких вспомогательных функций. При этом программисту не нужно каждый раз, когда ему что-то подобное понадобится, выхватывать куски кода из первых подвернувшихся под руку ответов на Stack Overflow.
Хотя в наши дни проблемы совместимости браузеров потеряли былую остроту, они всё ещё актуальны. Особенно — для тех, кто не относится к лагерю разработчиков, считающих, что если что-то работает в 85% браузеров, то им это подходит. Кстати, вот материал о том, почему Hello CSS не использует CSS-переменные.
Следует ли всегда пользоваться jQuery? Нет, конечно нет. Любая дополнительная зависимость — это рост сложности проекта и рост объёма его кода. Но jQuery — библиотека не такая уж и большая. Стандартная сборка, минифицированная и сжатая, занимает 30 Кб. Кастомная сборка без ajax и без редко используемых возможностей — это 23 Кб. А сборка, в которой вместо SizzleJS
используется querySelector
, занимает всего 17 Кб. Меня, для решения множества задач, вполне устраивает и стандартная сборка размером 30 Кб, и оптимизированная, размером 17 Кб.
Тут можно посмотреть на то, сколько усилий приложено к тому, чтобы убрать jQuery из Bootstrap и перейти на обычный JS.
Разработчики написали собственные вспомогательные функции. Им пришлось отказаться от поддержки IE, так как такую поддержку оказалось очень сложно реализовать. Они сделали несовместимым API («мы всё сломали») и потратили на всё это полтора года. Не могу сказать, что то, что получилось, намного лучше того, что было.
Я понимаю причины перевода Bootstrap на обычный JS. Например, разработчики хотят использовать Bootstrap с Vue.js, или ещё с чем-то подобным. А Vue.js и jQuery в одном проекте — это уже малость перебор. Я — большой сторонник сокращения объёмов ненужного кода в вебе (вот и вот — пара материалов об этом). Но тут я предлагаю смотреть на ситуацию с прагматичной и реалистичной точки зрения. Неужели включение в Bootstrap 17 Кб кода jQuery — это так плохо? Когда я говорю, что для просмотра сайтов вроде Medium или New York Times нужно загрузить больше мегабайта JavaScript-кода, меня, защищая сложившуюся ситуацию, спрашивают о том, не сижу ли я на какой-нибудь 56-килобитной модемной линии. Мегабайт JS — это нормально. Неужто 17 Кб jQuery — это неподъёмная ноша?
Существуют и веские причины jQuery не использовать. Например, jQuery не нужна в том случае, если вы пишете код, которым вы хотите поделиться с другими, или если вы создаёте какую-нибудь маленькую функцию. Но зачем выворачиваться наизнанку только ради того, чтобы не пользоваться jQuery? Зачем все эти усилия, если можно просто написать $()
? Я не думаю, что jQuery стоит использовать везде и всегда, но и не считаю правильным фанатичный отказ от jQuery.
Хочу отметить, что я не женат на jQuery. Я с удовольствием буду пользоваться чем-то вроде «jQuery light» — некой библиотекой, которая перекрывает недостатки стандартных API, давая программисту что-то более приятное. Сайт YMNJQ рекомендует, кроме прочих, библиотеки bonzo и $dom, предназначенные для решения разных задач. Но многие из них, как кажется, давно не поддерживаются. Кроме того, многие уже знают jQuery. Зачем менять jQuery на что-то другое без веских причин?
Многие читатели могут задаться вопросом о том, что я, в русле этого материала, могу сказать по поводу Vue.js, React и других современных фреймворков. Но цель этой статьи — сопоставить обычный JavaScript и jQuery, а не предлагать сообществу «Грандиозную общую теорию фронтенд-разработки».
Учитывая вышесказанное, я полагаю, что могу обнаружить совсем немного причин использовать обычный JS там, где можно воспользоваться jQuery. Это так преимущественно из-за того, что я хочу создавать быстрые страницы и использовать при этом простейшие рабочие конструкции. При этом я стремлюсь к тому, чтобы мои страницы смогло бы просмотреть как можно большее количество пользователей Сети. Опыт подсказывает мне, что кратчайшим путём к достижению этой цели служат шаблоны, сгенерированные на сервере, которые слегка, в стиле «прогрессивного улучшения», приправлены JavaScript. Если сравнить такие проекты с чем-то, в чём используется нечто более сложное, то оказывается, что их часто бывает проще разрабатывать. Такие проекты обычно быстрее, в них обычно меньше ошибок, а в ходе работы над ними вентилятор ноутбука не издаёт шум, способный разбудить весь дом.
Означает ли это, что современные веб-фреймворки и мощные библиотеки — это всегда плохо? Нет, не означает. Очень немногое достойно того, чтобы «всегда» называться плохим или хорошим. Но использовать фреймворк — значит идти на некие компромиссы (это, конечно, справедливо и для jQuery).
В целом, веб мне видится средой для просмотра документов, а не чем-то вроде операционной системы. И «документный подход» хорош не только для обычных сайтов, но и для многих «веб-приложений» (что бы так ни называли).
Уважаемые читатели! Пользуетесь ли вы jQuery?
Стоит ли использовать jQuery в 2019 году: сравнение с vanilla JavaScript
От автора: многие люди выступают за «просто используйте vanilla JavaScript, вам не нужен jQuery». Ну, многие вещи мне не нужны, но, тем не менее, их приятно иметь. Мне не обязательно нужен JQuery в 2019 году, у него есть не только плюсы, но и минусы. Но его, конечно, приятно иметь!
Такие страницы, как You might not need jQuery, пытаются продвигать идею, что вы можете легко отказаться от jQuery, но самый простой пример того, почему — это хорошая идея использовать jQuery: одна строка обычного кода jQuery заменяет 10 строк vanilla JS!
Большая часть JavaScript API — особенно DOM API — оскорбляет мое чувство эстетики, и это просто вежливый способ сказать, что я думаю, что JavaScript — это отстой.
el.insertAdjacentElement(‘afterend’, other) несомненно работает, но $(el).after(other) на самом деле более приятно. Хотя я никогда не был большим поклонником того, как выглядит функция $(), она намного лучше, чем то, что дает нам DOM.
Простой пример: как вы получаете элемент одного уровня? Это nextSibling или nextElementSibling? Какая разница? Какие браузеры поддерживают что? Пока вы заняты тем, что пытаетесь свериться с MDN, я просто буду использовать в jQuery next() или prev().
JavaScript. Быстрый старт
Изучите основы JavaScript на практическом примере по созданию веб-приложения
Узнать подробнееМногие обычные операции в стандартных API-интерфейсах JavaScript неудобны; я мог бы привести целый список, но страница You might not need jQuery (YMNJQ) уже сделала это.
Вам по-прежнему понадобятся вспомогательные функции для различных общих задач. Опять же, на странице YMNJQ перечислены некоторые из них. Использование jQuery является стандартным способом включения этих вспомогательных функций вместо копирования / вставки их из случайных тем Stack Overflow каждый раз, когда они вам нужны.
Хотя совместимость браузеров является гораздо менее существенной проблемой , но она все еще актуальна, особенно если вы не принадлежите к типу людей «если это работает для 85% всего мира , то это достаточно хорошо для меня».
Вы всегда должны использовать JQuery? Нет, конечно нет. Добавление любой зависимости сопряжено с увеличением сложности и размера файла, но jQuery не так уж велик: сборка по умолчанию составляет 30 КБ, сжатая, пользовательская сборка без ajax и необычных вещей 23 КБ, а сборка, использующая querySelector вместо SizzleJS, составляет 17 КБ. И оригинальные 30K, и оптимизированные 17K кажутся мне вполне приемлемыми для многих целей.
Вы можете посмотреть на Bootstrap удаляет jQuery, чтобы увидеть пример того, как много усилий может потребоваться для использования vanilla JS: они написали свои собственные хелперы, пришлось отказаться от поддержки IE, так как ее было слишком сложно добавить, сделали API несовместимым («мы сломали все») и потратили на это полтора года. Если я посмотрю на конечный результат, я не могу сказать, что это намного лучше.
Я понимаю, почему они это сделали; люди хотят использовать Bootstrap с Vue.js и еще много чего, а использовать и Vue.js, и jQuery немного глупо. Я за то, чтобы уменьшить «веб-раздутие», но мы должны быть прагматичными и реалистичными. Включение ~17K jQuery действительно так плохо? Когда я упоминаю, что вам нужен более чем мегабайт JavaScript для такого сайта, как Medium или New York Times, то что, 17 КБ jQuery такое уж невыносимое бремя?
Есть несколько веских причин не использовать jQuery: если вы пишете код, который хотите использовать повторно, или если вы пишете только небольшую функцию. Но делать что-то, просто чтобы избежать jQuery? Просто используйте jQuery! «JQuery для всего», вероятно, не была такой уж хорошей идеей, но и «jQuery ни для чего» не лучше.
Я не зациклен на jQuery, и я с радостью использую «jQuery light», который соединяет JS API с чем-то более привлекательным. YMNJQ рекомендует bonzo и $dom, а также несколько других для AJAX и тому подобного, но многие из них, кажется, не поддерживаются достаточно. Кроме того, все уже знают jQuery. Зачем заменять его чем-то другим, если для этого нет веских причин?
Некоторые читатели могут задаться вопросом «а как же Vue.js, React или какой-либо другой современный фреймворк?» Цель этого поста — сравнить vanilla JavaScript с jQuery, а не предлагать Великую унифицированную теорию развития веб-интерфейса.
При этом, я думаю, есть несколько причин придерживаться простого JavaScript; прежде всего потому, что я хочу создавать быстрые веб-страницы, использовать простейший из возможных кодов и быть доступным как можно большему количеству людей. По моему опыту, сгенерированные на стороне сервера шаблоны, слегка присыпанные «прогрессивным улучшением», часто являются лучшим способом сделать это в стиле JavaScript. Зачастую это легче разрабатывается, быстрее, меньше подвержено ошибкам, и вентилятор вашего ноутбука не разбудит соседей.
Означает ли это, что эти веб-фреймворки всегда плохи? Нет, не так уж много вещей плохи «всегда» (или хороши), чаще всего это набор компромиссов (как, впрочем, и в случае jQuery).
По сути, я думаю, что Интернет — это система для просмотра документов, а не операционная система. Даже для многих «веб-приложений» (что бы вы ни имели ввиду) подход к документам работает достаточно хорошо (эта тема заслуживает отдельной публикации… может, когда-то в будущем).
Автор: Martin Tournoij
Источник: https://arp242.net
Редакция: Команда webformyself.
JavaScript. Быстрый старт
Изучите основы JavaScript на практическом примере по созданию веб-приложения
Узнать подробнее