Что такое jquery и для чего он нужен: Что такое jQuery и зачем он нужен?

Содержание

Что такое 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 и почему?

Часто можно увидеть в социальных сетях, как бывалые программисты внушают новичкам, что им не нужно тратить время на изучение библиотеки jQuery. Все это дескать прошлый век, устаревшая технология, на замену которой пришли JS фреймворки.


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


Новичок примерно спрашивает так: «Я выучил HTML/CSS, чуть-чуть JavaScript, теперь не знаю, что мне дальше учить и перечисляет (Angular, React, Vue, jQuery). Посоветуйте, пожалуйста.» И конечно все дружно советуют учить JS фреймворк, но только не jQuery.


В чем подвох в связке, простой вопрос – простой ответ? Большинство начинающих задают слишком абстрактные вопросы, вот и получают поверхностные ответы. Вот если бы вопрос прозвучал примерно так: «Я собираюсь брать заказы на фрилансе по созданию несложных сайтов, на которых будет реализованы форма заказа, слайдеры и прочие фишки для взаимодействия с пользователями. Что посоветуете мне ещё изучить, кроме HTML/CSS?»


В таком случае, ответ был бы совсем другим и человек пошел бы в нужном для него направлении. Друзья! Никто не хочет вас специально запутать, просто не ленитесь задавать конкретные вопросы, уточняя, что вы потом собираетесь делать.


jQuery не конкурент для нативного JS, он создан для сокращения затрачиваемого времени на разработку. Не так давно, программисты для всех проектов писали весь JS код с нуля. Вскоре программисты заметили, что у веб-сайтов есть много общего, а один и тот же код повторяется из проекта в проект. Было бы неплохо, где-то этот код сохранить и переиспользовать его в новых проектах.


Так и появилась библиотека jQuery, где описаны методы работы с файлами на все случаи жизни. Подключаешь библиотеку, выбираешь элемент, указываешь метод, и нужный код будет извлекаться из библиотеки. Вот и весь принцип. Но даже не это самое главное.


Какие главные достоинства у библиотеки jQuery


  1. Создано огромное количество плагинов и для решения типовой задачи не нужно ничего придумывать нового. Практически уже все придумано и реализовано другими разработчиками, ведь написать плагин с использованием библиотеки намного быстрее, чем на чистом JS.


  2. Код уже протестирован во всех возможных браузерах и является кроссбраузерным.


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


  4. Лаконичный код. Одна и та же задача, решается более короткой записью кода, чем пока ещё не может похвастаться нативный JS.

Все вышеперечисленные аргументы, экономят уйму времени.



Минусы jQuery


Библиотека влияет на скорость загрузки страницы, но не слишком существенно. Ведь её вес примерно такой же, как у большой оптимизированной фотографии — 64 кб, а таких фотографий может быть несколько десятков. Так стоит ли бояться подключать библиотеку, если она действительно нужна?


Большинство популярных CMS (WordPress, OpenCart) используют jQuery, а это значит что библиотека уже подключена. Вас не должны мучить угрызения совести, что вы вынуждены подключить всю библиотеку из-за 5-ти строчек кода. Это уже сделали за вас разработчики.


Почему jQuery хорошо подходит фрилансеру?


Типовая разработка сайтов на заказ достаточно хорошо проработана. В процессе разработки сайтов программисты сталкивались с одинаковыми задачами и решали похожие проблемы. В итоге все хорошие решения оказались в библиотеке. В свою очередь другие разработчики пользуясь библиотекой, написали тысячи плагинов и расширений на любой случай. Карусели, модальные окна – все, что может понадобиться на сайте, уже есть и доступно через пару строчек кода.


Главный вывод:


Использование библиотеки jQuery экономит время для решения типовых задач, а на фрилансе 90% заказов — типовые задачи.


Не слушайте никого, изучайте jQuery в рамках моего видеокурса. Для заказчика не важно, на какой технологии работает его сайт. Главное, чтобы он выполнял свои задачи.


  • Создано 02.10.2019 10:42:50



  • Михаил Русаков

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

Переход с jQuery на Vue.js Зачем, как и что из этого вышло

Опубликовано: 25 Июн 2019

Вернуться в блог

Меня зовут Сергей, я работаю в Студии Флаг с 2017 года и, когда я пришел, состояние фронтенда оставляло желать лучшего.

Введение

Меня зовут Сергей, я работаю в Студии Флаг с 2017 года и, когда я пришел, состояние фронтенда оставляло желать лучшего. Если CSS хоть как-то собирался, был разбит на модули, то на некоторых проектах весь JavaScript хранился в одном файле длиной несколько тысяч строк, не минифицировался, и периодически встречались комментарии типа «Не лезь, оно тебя сожрет». В другом месте JS-функция иногда возвращала “trulio” вместо true. Большая часть кодовой базы была написана на jQuery, что тоже не упрощало работу.

Такой подход может использоваться на небольших проектах, когда кода немного, а релиз один. Но, при развитии проекта и постоянных доработках, это быстро превращается в проблему. Для того, чтобы сделать задачу, нужно сначала найти место в файле (на это действительно может уходить много времени!), проверить зависимости, понять, что изменение функциональности в одном месте, не сломает ее в другом. В итоге, задачи делаются медленно, а количество ошибок растет пропорционально росту проекта.

Постепенно, мы занялись созданием сборки фронтенда, начали с минификации (сжатия) и транспиляции (трансформации кода таким образом, чтобы он работал в старых браузерах) JavaScript с помощью популярного сборщика Gulp. Позже стали разбивать код на модули. С 2017 года мы начинали постепенно внедрять php-фреймворк Laravel. Кстати, создатели Laravel (Taylor Otwell) и Vue.js (Evan You) много общаются и выступают на конференциях друг у друга.

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

Почему Vue

Vue.js – это прогрессивный фреймворк для создания пользовательских интерфейсов. Создателем Vue.js является Evan You, бывший сотрудник Google и Meteor Dev Group. Начал он разрабатывать фреймворк в 2013-м, а в феврале 2014-го состоялся первый публичный релиз.

Почему мы выбрали именно его?

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

Во-вторых, Vue довольно легко интегрируется с Laravel, backend-фреймворком, который мы используем.

В-третьих, он подходит для постепенного внедрения. Постепенно изучая фреймворк, мы могли начинать использовать его в существующих проектах, которые не были написаны на Vue.js с нуля.

Немаловажным является то, что фреймворк имеет доступную документацию(в том числе на хорошем русском языке).
Vue.js появился позже Angular и React, и, как обещали разработчики, взял лучшее от обоих. На тот момент он уже начал обгонять React по звездочкам на GitHub, и в рейтинге любви разработчиков имел позиции не ниже, чем React. Совокупность этих факторов привела к выбору Vue. js, который мы начали внедрять с начала 2018 года, и еще ни разу не пожалели об этом.

Использование Vue.js

Для изучения Vue.js требуется базовое знание HTML, CSS, JavaScript, желательно знание стандарта ES6 и выше. Vue поддерживает все современные браузеры и даже Internet Explorer 9-11 и весит всего около 20 кб (min + gzip).

Для старта простого проекта на Vue.js достаточно скачать JS-файл и подключить его на страницу с помощью тега <script>. Будет зарегистрирована глобальная переменная Vue. Также существует Vue CLI – инструмент, с помощью которого можно быстро развернуть проект, и использовать все продвинутые возможности Vue (о них расскажу далее) без потери времени на настройку конфигов систем сборки фронтенда. Мы же на своих проектах используем Webpack + Laravel Mix (пакет для Laravel, позволяющий быстро настраивать Webpack).

Основные концепции

Основными концепциями Vue являются:

  • конструктор
  • компоненты
  • директивы
  • переходы

Конструктор

Для начала работы с Vue требуется создать новый экземпляр Vue. В нем указывается элемент, который будет использоваться для рендеринга, описываются данные и вычисляемые свойства, методы, хуки жизненного цикла экземпляра Vue. Это и есть конструктор. Выглядит это так

Компоненты

Ключевое правило при разработке сложных вещей: «Никогда не делайте сложные вещи». Если что-то становится сложным – разбиваем это на части попроще и связываем их наиболее очевидным способом. Любой сложный интерфейс нужно делить на компоненты – сущности, для которых мы можем максимально однозначно и понятно указать, что это такое и что оно умеет делать.

Компоненты помогают расширить основные html элементы и внедрить переиспользуемый код. По сути, компоненты — повторно используемые части UI. На этапе проектирования мы разбиваем наше приложение на независимые части и получаем древовидную структуру компонентов. В примере ниже можно увидеть пример Vue-компонента — счетчика кликов, который можно вставить на страницу несколько раз и все реализации этого счетчика будут работать независимо друг от друга.

jQuery

Для jQuery тоже можно найти плагины, для реализации компонентного подхода, однако их почти никто не использует на практике.

Директивы

Директивы используются для добавления дополнительной функциональности html-элементам. Все директивы имеют префикс «v-». С их помощью можно добавлять обработчики событий, управлять отображением элементов, передавать данные и многое другое.

Например, в примере ниже элементу добавляется класс “active”, если переменная isActive возвращает “true”.

jQuery

В jQuery для реализации подобной функциональности пришлось бы добавить класс или id к этому элементу (хорошо, если он еще будет с префиксом js—), после этого обратиться к этому элементу и при изменении переменной isActive добавлять или убирать класс.

Переходы

Vue дает возможность самым разным образом анимировать переходы при обновлении объектов DOM, а также при их добавлении и удалении. Его инструменты дают возможность:

  • автоматически применять CSS-классы для анимаций и переходов
  • интегрировать сторонние библиотеки CSS-анимаций, такие как Animate. css
  • использовать JavaScript для работы с DOM напрямую в хуках переходов
  • интегрировать сторонние библиотеки JavaScript-анимаций, такие как Velocity.js
jQuery

jQuery тоже имеет встроенные эффекты переходов, что в свое время упростило жизнь многим разработчикам, но возможностей для кастомизации этих эффектов меньше, чем во Vue.

Отладка

Для отладки используется расширение для браузера vue-devtools, которое позволяет видеть компонентную структуру проекта. Это расширение позволяет отслеживать состояние каждого компонента, реактивно менять данные в нем, изменяя его состояние. Также в нем присутствуют возможности для отладки Vue Router и Vuex, о которых расскажу чуть позже.

Скриншот интерфейса Vue-devtools представлен ниже.

jQuery

Для jQuery также существует расширение для отладки, однако его возможностей часто бывает недостаточно.

Однофайловые компоненты

Для того, чтобы проект было легко масштабировать и отлаживать рекомендуется использовать однофайловые компоненты Vue, которые являются одной из киллер-фич фреймворка. При такой организации кода каждый компонент – это отдельный файл, который имеет три части: разметку, скрипт и стили. Это очень удобно – видеть всю логику компонента в одном файле. Причем писать можно на любом удобном вам препроцессоре (SASS, PostCSS, …) и языке, компилирующимся в JS (CoffeeScript, TypeScript). На иллюстрациях ниже можно увидеть пример такого компонента. В примере сперва идет HTML-разметка, затем JavaScript и, наконец, стили CSS. Все рядом, в одном файле, удобнее уже некуда!

jQuery

В jQuery такой реализации компонентного подхода нет.

Vuex

Сложность больших приложений нередко возрастает из-за распределения кусочков состояния по многим компонентам и связям между ними. Представьте, что вы работаете над большим веб-приложением с десятками маршрутов и компонентов. Будет не очень удобно передавать данные между компонентами, поскольку их много и легко запутаться в том, какие данные нужны конкретному компоненту.

Для решения этой проблемы Vue предлагает Vuex. Vuex – это паттерн и библиотека управления состоянием для приложений на Vue.js. Он позволяет хранить данные в одном месте в виде JSON-объекта, что упрощает работу при разработке больших приложений.

jQuery

Если снова вспомнить про jQuery, то подобных встроенных инструментов управления состоянием приложения он не имеет.

SPA

Для создания SPA (Single Page Application) предусмотрен модуль VueRouter. SPA – это веб-приложение, работающее на одной странице. На SPA-сайте при переходах между URL-адресами страница не перезагружается, а обновляется только то, что должно обновиться. Большая часть работы сайта производится на стороне клиента, а если нужно получить данные с сервера, то это обычно делается с помощью ajax.

В обычных сайтах очень часто можно встретить загрузку одного и того же содержимого. Например, шапка сайта, футер, меню и другие элементы, которые не меняются от страницы к странице, тем не менее, каждый раз загружаются с сервера. С использованием SPA подхода такой проблемы просто не будет, т. к. контент будет подгружаться по мере необходимости, что значительно повысит скорость работы приложения. Пример SPA-сайта: https://meduza.io/

Vue Router имеет мощные возможности по управлению роутингом приложения, и при этом доступную документацию. Она глубоко интегрируется с Vue.js и позволяет легко создавать SPA-приложения. Включает следующие возможности:

  • Вложенные маршруты/представления;
  • Модульная конфигурация маршрутизатора;
  • Доступ к параметрам маршрута, query, wildcards;
  • Анимация переходов представлений на основе Vue.js;
  • Удобный контроль навигации;
  • Автоматическое проставление активного CSS класса для ссылок;
  • Режимы работы HTML5 history или хэш, с автопереключением в IE9;
  • Настраиваемое поведение прокрутки страницы.

Есть инструменты и для серверного рендеринга HTML страниц.

jQuery

При желании, можно сделать SPA и на jQuery, однако все, что описано выше придется создавать самому или использовать для этого сторонние библиотеки.

Vuetify

Для того, чтобы быстро собрать приложение можно использовать набор готовых компонентов – Vuetify. Он соответствует концепции дизайна Material Design. С его помощью можно как использовать некоторые UI-элементы (селекты, датапикеры), так и готовые темы интерфейсов.
Ниже можно увидеть форму авторизации Vuetify.

jQuery

Надо сказать, что jQuery тоже имеет библиотеку готовых компонентов, однако их гораздо меньше, чем во Vuetify, и их дизайн и функциональность оставляют желать лучшего, так как последний релиз был в 2016 году.

Заключение

Таким образом, Vue предоставляет обширные возможности для разработчиков. С ним очень легко начать работать, даже если до этого вы не использовали JavaScript-фреймворки и постепенно двигаться от простого к сложному на реальных проектах. При использовании однофайловых компонентов вы получаете приложение с чистым кодом, разбитым на модули, которое легко масштабировать.

Вы можете начать создавать SPA и удобно управлять состоянием с помощью Vue Router и Vuex, а также использовать готовый набор компонентов Vuetify. А еще у Vue есть набор фирменных эмоджи! Мы работаем с Vue.js больше года, и за это время убедились, что как фреймворк, он удовлетворяет все наши потребности и стимулирует изучать новое и двигаться вперед.

Всем Vue!


Последние записи блога

Please enable JavaScript to view the comments
powered by Disqus.

Стоит ли учить JQuery в 2020 году

Автор статьи: admin

Не так давно, мне один человек сказал, что jquery учить в 2020, нет смысла, да и вообще многие так сейчас считают, и я хочу поспорить с такими людьми, в этой статье я объясню почему всё-таки стоит учить jquery в 2020 году.

JQuery на фрилансе:

Для начала посмотрим зачем он нужен на фрилансе, и первое что приходит в голову, это CMS система WordPress.

Что бы с ним работать, конечно, не обязательно знать JQuery, но фреймворки всё таки упрощают работу программисту, а WordPrress использует именно JQuery, как так получилось?

Всё очень просто WordPress уже очень старая CMS система, и один из первых JS фреймворков, если не единственный, появился JQuery, соответственно разработчики решили использовать именно его, для более простой разработки Fron-End части сайта, и если вы не хотите ещё нагружать сайт другими фреймворками, то используете сразу JQuery.

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

JQuery на работе в офисе:

Тут уже всё интересней, когда я искал работу не так много попадалось вакансий, где требуется знания JQuery, с чем же это связано?

Так происходит, что на фрилансе этот фреймворк популярен а на обычной работе нет, потому что, в офисе обычно нанимают людей для работы с новыми проектами, соответственно, надо и использовать последние технологии.

Но всё-таки, иногда, как и с фрилансом, вам могут дать работать над старым проектом, ну или просто по каким то причинам компании удобней работать с JQuery.

Какую версию JQuery учить:

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

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

Вывод:

Как можете заметить, JQuery до сих пор, очень полезно знать, особенно на фрилансе, тем более он не такой уж сложный, поэтому учить JQuery в 2020 году однозначно, хоть чуть-чуть, но стоит.

Подписываетесь на наш Telegram канал и группу Вконтакте.

 

Подписываетесь на соц-сети:

Также рекомендую:

Да не нужен вам фреймворк JavaScript!

Не устали ли мы от вездесущих фреймворков JavaScript? Возможно, что мы не обращаем внимание на эффективность и пакетные данные от наших пользователей?

Вернёмся в эпоху jQuery

Помните те дни, когда все на каждом шагу пользовались jQuery? jQuery до, jQuery после, все буквально пропиталось этим jQuery. В каждом веб-сайте или веб-приложении можно было найти jQuery. Почему?

Разработчики посчитали, что Vanilla JavaScript слишком сложный в управлении. В браузерах он показывал много значительных отличий.

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

Эра засилья JavaScript

Прямо сейчас, хотя 2020 год и начался относительно недавно, но мы уже успели создать слишком много веб-сайтов и веб-приложений на всём, что было доступно: Angular, React, Vue.js, Svelte, или Polymer. Не буду перечислять их все…

Возможно, вы подумаете: “ну окей, ты продолжай рассуждать и мы посмотрим”. Что ж, приступим, мои планы на эту статью именно такие. Я смотрю критическим взглядом на своё личное помешательство на JavaScript. 

Давайте честно. Никогда ещё не было так просто запустить приложение или сайт при помощи одной команды. В Angular мы пишем ng new project name, а на React мы делаем как-то иначе …, но аналогично коротко.

В основном мы выбираем то, что лучше всего подходит для конкретного случая. Но нам стоит меньше пользоваться JavaScript и более вдумчиво относится к тому, что мы грузим внутрь своего приложения. 

Потому что, возможно, HTML, CSS, и JavaScript будет вполне достаточно.

Когда я говорю о фреймворке JavaScript, я также имею в виду и библиотеку JavaScript. Angular, React, Vue.js и Svelte для меня относятся к этой же категории. Да, конечно, есть и намного больше технологий и инструментов…но речь не о них, сосредоточимся на сути.

Плюсы и минусы в работе фреймворка JavaScript

Если пользоваться фреймворком JavaScript, то он может принести и пользу, и вред. В одной и той же ситуации, одно будет лучше, чем другое, а в остальных случаях — наоборот. 

Я работаю с Angular каждый день и люблю экспериментировать с React или Vue.js. Иногда я пробую какую-то небольшую микро-библиотеку JavaScript, которая умеет делать хорошо только что-то одно.

Когда вам не стоит пользоваться JavaScript-фреймворком 

Есть несколько ситуаций, в которых я бы не советовал пользоваться фреймворком JavaScript, а охотно рекомендую JavaScript или Vanilla JavaScript.

  1. Ваше приложение простое или небольшое. Когда работаете с незначительным проектом, например, просто экспериментируете с новым API JavaScript.
  2. Если у вас есть ограничения по производительности. Когда ваше приложение должно показывать высокую эффективность даже при узкополосном подключении.

Считается каждый байт, отправленный свыше лимита. К тому же может быть неразумно пользоваться большим фреймворком. Он стоит больших денег из-за дополнительных расходов. Существует много инструментов, которые сделают процесс более управляемым. Лучше предотвратить проблемы, чем решать их.

Когда использовать фреймворк JavaScript будет разумным выбором

Есть и ситуации, в которых правильное решение — пользоваться JavaScript-фреймворком. Но даже тогда нам нужно быть внимательными со всеми деталями.

1. Ваше приложение масштабное

Когда вы создаёте большое приложение, может быть логично использовать фреймворк JavaScript. Чаще всего фреймворк идёт вместе с мощной поддержкой от сообщества.

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

2. Вы или компания цените открытое ПО

Лучшее качество открытого ПО в том, что каждый может использовать его как хочет (конечно, если лицензия позволяет). 

Многие элементы такого фреймворка созданы людьми в их свободное от основной работы время. Разработчику или компании, которые пользуются такими продуктами, это не стоит никаких денег. 

Если компания/разработчик помогает разрабатывать JavaScript-фреймворк, другие тоже получают от этого пользу. 

3. Быстрая разработка новых функций

Большинство фреймворков предлагают много инструментов и поэтому с ними вести разработку проще: можно быстро добавлять новые функции. Вы можете доверять таким инструментам, ведь много умных инженеров посвятили много своего времени на их тестирование. 

Заключение

В своих рассуждениях о фреймворках JavaScript я привёл больше плюсов, чем минусов.

Пусть это звучит красиво  —  пользоваться фреймворком, но мы, разработчики, должны быть очень осторожными с тем, что мы вкладываем в свои веб-разработки. 

Всегда спрашивайте себя: “Для чего мне нужен этот фреймворк? Какой будет выгода для нас, если создать его своими силами или выбрать вариант из уже существующих?”. Ещё не забывайте подумать о таких вещах: “Какие последствия это имеет для пользователя? Малобюджетный телефон подойдёт для этого приложения так же хорошо, как и флагманские смартфоны?”

Благодарности

Спасибо, что прочитали от начала до конца. Надеюсь, что вы научились более внимательно относиться к выбору JavaScript-фреймворка или решению работать без него. 

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

Читайте также:

Перевод статьи Dev by RayRay: You Don’t Need a JavaScript Framework

Для чего нужен и что делает Javascript. Примеры.

Если вы еще не знакомы с понятием Javascript, то об этом я писал тут.

В этой заметке хотелось рассказать о том, для чего Javascript нужен и что с его помощью можно делать.

Как и у любого язык программирования, основная задача Javascript создавать последовательность действий, которые будут приводить к определенному результату.

Это могут быть условия «если-то», циклы, которые создают определенную последовательность действий, математические вычисления и.т.д.

Самое главное в том, что все эти операции можно производить на веб-страницах, в окне браузера. Причем, javascript может работать и без подключения к сети Интернет.

Итак, давайте рассмотрим ряд примеров, которые демонстрируют те возможности, которые можно получить при использовании Javascript. Я условно отсортировал их на несколько групп, чтобы у вас появилось определенное понимание, что делает Javascript и зачем он нужен.

Все мои уроки по Javascript здесь.

1) Математические операции

На веб-страницах очень часто возникает необходимость произвести те или иные вычисления.

Например, есть два текстовых поля и нужно в третьем текстовом поле вывести сумму двух чисел, которые введены в первые два.

С помощью Javascript можно создать калькулятор и разместить его на веб-странице.

Вот здесь есть пример такого калькулятора:

http://www.javascriptkit.com/script/cut18.shtml

Еще ситуация, возьмем какую-нибудь текстовую строку на веб-странице, нужно увеличить ее размер в 1,5 раза. Это тоже можно сделать с помощью математических вычислений, путем умножения текущего размера на коэффициент 1,5.

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

2) Обработка и валидация данных в HTML-формах

Javascript позволяет проверять, что все требуемые поля заполнены и данные, которые в них находятся соответствуют нужному формату (например, если требуются цифры, то должны быть только цифры и не должно быть букв).

Делает это Javascript без перезагрузки страницы и даже без подключения к Интернет.

Прежде чем отправлять данные на сервер, они проходят предварительную проверку на Javascript. Это снижает нагрузку на сервер.

3) Взаимодействия с пользователем и события

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

Выпадающее меню на сайте при наведении курсора мыши.

При клике на кнопку скрыть или показать какой-то элемент на странице.

Появления всплывающего окна, когда курсор мыши ушел за пределы окна браузера.

Затемнение заднего фона и эффекты плавного появления элемента реализуются на Javascript.

И.т.д.

4) Взаимодействовать с HTML-элементами на странице и управлять их содержимым и стилями.

При наступлении определенного события (например, клик мыши или любого другого) можно изменять внешний вид (стили CSS) элементов на странице.

Делается это все программно.

Еще можно добавлять какие-нибудь HTML-теги или атрибуты к ним, также при наступлении определенного события.

5) Добавление анимации и различных графических эффектов на веб-страницы.

Падающие и двигающиеся объекты. Например, снег на сайт.

Плавное появление и скрытие объектов

Таймер обратного отсчета

И др. эффекты реализуются на Javascript

Я перечислил здесь лишь небольшой список возможностей Javascript. Чтобы вы могли посмотреть все наглядно и на реальных примерах, привожу здесь список сайтов, на которых опубликованы действующие примеры на языке javascript:

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

Все мои уроки по Javascript здесь.

javascript — Зачем нужен Angular.js?

На счет ангуляра в вакансиях — это на самом деле очень смешно. В моём опыте был очень забавный случай, когда меня пригласили устраиваться на работу, где в требованиях был Angular. Работодатель мне и говорит:

— Мы тут разрабатываем сайты на битриксе нашим клиентам

— Одностраничные?

— Зачем? Ты что не знаешь что такое битрикс? Многостраничные, конечно

— Подождите, какие сайты, какой битрикс? У вас в вакансии было написано знание angular js

— А ты что, не знаешь? Ну ничего, научим

Angular сейчас — достаточно модный MVC-фреймворк, как и сам паттерн MVC в вебе. И довольно часто в требования его просто приписывают работодатели глядя на вакансии других компаний, не задумываясь. Нет, конечно, множество компаний использует его осознанно и поэтому требуют.

Любой фреймфорк или библиотека существует для одного: что бы разработчик не сошел с ума в написании кода. Если сравнивать Angular и jQuery, то они сделаны для разных целей и использовать их, соответственно нужно в разных ситуациях.

jQuery — библиотека, т.е. набор возможностей для разработки. jQuery был создан для облегчения взаимодействия с DOM документа посредством запросов, похожих на css-селекторы и в дальнейшем развился в толстую библиотеку. Но в нынешних реалиях существуют одностраничные приложения, в которых происходит очень много запросов в DOM и использовать jQuery для создания архитектуры такого приложения — нерационально, иначе придётся делать крепкую оптимизацию взаимодействия в DOM’ом, что усложнит код, и не сильно его ускорит.

Angular это фреймворк, т.е. он предоставляет фундамент для веб-разработки. В одностраничных приложениях он может оказаться очень кстати, и упрощает это самое взаимодействие с DOM’ом, потому что, грубо говоря, часть его кода находится в самом html-документе. Лично моё отношение к такому подходу больше отрицательное, чем положительное, хоть и MVC люблю. Но это скорее дело вкуса. Для одностраничных приложений я использую React (еще одна модная библиотека), который кстати, сейчас так же требуют в вакансиях (вместе с Angular и jQuery, ага)

Что такое jQuery — javatpoint

jQuery — это быстрая, небольшая, кроссплатформенная и многофункциональная библиотека JavaScript. Он разработан для упрощения написания сценариев HTML на стороне клиента. Он делает такие вещи, как обход и манипуляции с HTML-документами, анимация, обработка событий и AJAX, очень простыми с помощью простого в использовании API, который работает во многих различных типах браузеров.

Основная цель jQuery — предоставить простой способ использования JavaScript на вашем веб-сайте, чтобы сделать его более интерактивным и привлекательным.Он также используется для добавления анимации.

Что такое jQuery

jQuery — это небольшая, легкая и быстрая библиотека JavaScript. Он кроссплатформенный и поддерживает разные типы браузеров. Его также называют «пиши меньше, делай больше». потому что он берет на себя множество общих задач, для выполнения которых требуется много строк кода JavaScript, и связывает их в методы, которые можно вызывать с помощью одной строки кода, когда это необходимо. Также очень полезно упростить многие сложные вещи из JavaScript, такие как вызовы AJAX и манипуляции с DOM.

  • jQuery — это небольшая, быстрая и легкая библиотека JavaScript.
  • jQuery не зависит от платформы.
  • jQuery означает «меньше пиши, делай больше».
  • jQuery упрощает вызовы AJAX и манипуляции с DOM.

Функции jQuery

Ниже приведены важные особенности jQuery.

  • Обработка HTML
  • Манипуляции с DOM
  • Выбор элемента DOM
  • CSS-манипуляции
  • Эффекты и анимация
  • Утилиты
  • AJAX
  • HTML методы событий
  • Анализ JSON
  • Расширяемость через плагины

Почему требуется jQuery

Иногда может возникнуть вопрос, зачем нужен jQuery или какая разница при использовании jQuery вместо AJAX / JavaScript? Если jQuery — это замена AJAX и JavaScript? На все эти вопросы вы можете дать следующие ответы.

  • Он очень быстрый и расширяемый.
  • Это помогает пользователям писать коды функций, связанных с пользовательским интерфейсом, в минимально возможных строках.
  • Повышает производительность приложения.
  • Можно разрабатывать веб-приложения, совместимые с браузером.
  • Он использует в основном новые функции новых браузеров.

Итак, вы можете сказать, что из множества фреймворков JavaScript jQuery является наиболее популярным и расширяемым. Многие крупнейшие компании в Интернете используют jQuery.

Вот некоторые из этих компаний:

  • Microsoft
  • Google
  • IBM
  • Netflix

Что нужно знать перед тем, как начать изучать jQuery?

Новичкам всегда рекомендуется изучить основы веб-дизайна, прежде чем начинать изучать jQuery. Сначала ему следует изучить HTML, CSS и JavaScript. Но если вы относитесь к техническим специалистам, решать вам.

Если вы новичок и хотите сначала изучить эти предметы.

Что такое jQuery? Изучите самую популярную библиотеку JavaScript

Зачем изучать jQuery?

Библиотека jQuery по-прежнему остается одной из самых популярных библиотек в устаревшем коде. Его мантра: писать меньше, чтобы делать больше, делает ее по-прежнему популярной библиотекой, которую продолжают использовать сегодня.

«Пишите меньше, делайте больше».

jQuery, вероятно, самая популярная и расширяемая библиотека JavaScript . Его используют такие крупные компании, как Netflix, Google, IBM и Microsoft.IT обычно является первой библиотекой, которую изучают разработчики JavaScript, потому что:

  • Его синтаксис для вызовов AJAX очень прост по сравнению с собственным XmlHttpRequest
  • Он предлагает сокращенных решений общих задач JavaScript, таких как сортировка и фильтрация массивов
  • Многие другие библиотеки имеют зависимости jQuery
  • Работает на стороне сервера узла

Последние достижения в мире внешнего интерфейса с помощью фреймворков JavaScript, таких как React и Angular, а также API выборки, делают jQuery немного длинноватым, но варианты использования все еще существуют в зависимости от того, что требуется для вашего проекта.

Bootstrap, в настоящее время, и WordPress используют jQuery для создания своих компонентов и тем. Многие крупные технологические компании, хотя они и не могут начинать проекты с нуля с jQuery, по-прежнему опираются на те, которые начинались с jQuery. Поэтому неплохо было бы понять jQuery, чтобы включить его в свое резюме.

Синтаксис jQuery

Библиотека jQuery состоит из селекторов, обработчиков событий и помощников обхода DOM. Наряду с Ajax, jQuery делает практически все, что вам нужно, чтобы JavaScript делал для вашей веб-страницы.Есть три самых важных элемента , которые заставляют работать jQuery:

  1. $ () или jQuery () : $ () существует с единственной целью — сделать его, поэтому вам не нужно писать jQuery () каждый раз, когда вы хотите использовать селектор.
  2. селектор : так мы выбираем наш элемент DOM (объектная модель документа). Это элемент, в который мы хотим внести изменения при загрузке страницы.
  3. action () : это функция, которая сообщает DOM, что делать.Это может быть прослушиватель событий, это может быть эффект в зависимости от варианта использования.

Вместе простой оператор jQuery записывается как:

Что такое jQuery?

jQuery — это быстрая, небольшая и многофункциональная библиотека JavaScript, включенная в один файл .js.

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

Важные особенности jQuery

  • Выбор DOM: jQuery предоставляет селекторы для извлечения элемента DOM на основе различных критериев, таких как имя тега, идентификатор, имя класса css, имя атрибута, значение, n-й дочерний элемент в иерархии и т. Д.
  • Манипуляции с DOM: вы можете манипулировать элементами DOM, используя различные встроенные функции jQuery. Например, добавление или удаление элементов, изменение содержимого html, класса css и т. Д.
  • Специальные эффекты: вы можете применять специальные эффекты к элементам DOM, такие как отображение или скрытие элементов, постепенное появление или исчезновение видимости, эффект скольжения, анимация и т. Д.
  • События: библиотека jQuery включает функции, которые эквивалентны событиям DOM, такие как click, dblclick, mouseenter, mouseleave, blur, keyup, keydown и т. Д. Эти функции автоматически обрабатывают кросс-браузерные проблемы.
  • Ajax: jQuery также включает простые в использовании функции AJAX для загрузки данных с серверов без перезагрузки всей страницы.
  • Кроссбраузерная поддержка: библиотека jQuery автоматически решает кроссбраузерность, поэтому пользователю не нужно об этом беспокоиться. jQuery поддерживает IE 6.0+, FF 2.0+, Safari 3.0+, Chrome и Opera 9.0+.

Преимущества jQuery

  • Легко изучить: jQuery легко изучить, потому что он поддерживает тот же стиль кодирования JavaScript.
  • Пишите меньше, делайте больше: jQuery предоставляет богатый набор функций, которые повышают продуктивность разработчиков за счет написания меньшего количества удобочитаемого кода.
  • Отличная документация по API: jQuery предоставляет отличную онлайн-документацию по API.
  • Кроссбраузерная поддержка: jQuery обеспечивает отличную кроссбраузерность без написания дополнительного кода.
  • Ненавязчивый: jQuery ненавязчив, что позволяет разделить проблемы путем разделения кода html и jQuery.

Узнайте, как загрузить и установить библиотеку jQuery в следующем разделе.

Что такое jQuery?

В этой серии руководств я собираюсь изучить jQuery — «Библиотека JavaScript меньше пиши, делай больше». Если вы пишете код с использованием JavaScript, вы, вероятно, уже слышали о jQuery — это, безусловно, самая популярная библиотека JavaScript, используемая сегодня. Например, Microsoft, Twitter и ESPN используют jQuery на своих сайтах.

Чтобы начать серию, в этой статье объясняется, что такое jQuery и для чего его можно использовать.

Так что же такое jQuery?

jQuery — это библиотека, которая упрощает и ускоряет создание веб-страниц и веб-приложений на JavaScript. Часто с помощью jQuery вы можете написать одну строку кода, чтобы добиться того, что потребовало бы 10-20 строк обычного кода JavaScript.

jQuery сам написан на JavaScript и представлен в виде одного файла .js , на который вы ссылаетесь со своей веб-страницы. Затем ваш код JavaScript обращается к библиотеке, вызывая различные функции jQuery.

Библиотека jQuery бывает двух видов:

  • Несжатый файл .js легко читать и изменять, но его размер составляет около 160 КБ (на момент написания).
  • Минифицированный файл .js имеет все комментарии, пробелы и другие ненужные символы, удаленные из файла, в результате чего вся библиотека занимает всего 23 КБ. Хотя вы не можете легко прочитать код, это именно та версия, которую вы захотите разместить на своем сайте, поскольку посетители загружают ее гораздо быстрее.

jQuery можно бесплатно загрузить и использовать, и он имеет двойную лицензию по лицензиям MIT и GPL.

Помимо самой библиотеки jQuery, доступны сотни подключаемых модулей jQuery, которые добавляют еще больше мощности и функциональности вашим скриптам.

Что можно делать с jQuery?

jQuery позволяет легко писать мощные приложения на JavaScript и создавать привлекательные анимационные эффекты, не уступающие эффектам Flash-роликов. Помимо прочего, jQuery отлично подходит для:

  • Добавление анимированных эффектов к элементам. jQuery позволяет легко добавлять эффекты, такие как постепенное появление / исчезновение, скольжение внутрь / наружу и расширение / сжатие.
  • Создание запросов XML (Ajax). Они используют JavaScript для запроса дополнительных данных с веб-сервера без необходимости перезагружать страницу.
  • Манипулирование DOM. Вы можете легко добавлять, удалять и переупорядочивать содержимое веб-страницы, используя всего пару строк кода.
  • Создание слайд-шоу изображений. Вы можете использовать эффекты jQuery для создания красивых анимированных слайд-шоу и лайтбоксов.
  • Создание выпадающих меню. jQuery позволяет легко создавать многоуровневые выпадающие списки с анимацией.
  • Создание интерфейсов перетаскивания. Используйте jQuery для создания страницы с элементами, которые можно перемещать или переупорядочивать простым перетаскиванием.
  • Добавляем силу формам. С помощью jQuery вы можете легко добавить сложную проверку формы на стороне клиента, создать текстовые поля Ajax с автозаполнением, которые извлекают данные из базы данных на стороне сервера, и так далее.

Конечно, вы можете сделать все вышеперечисленное, написав свой собственный JavaScript, но намного проще просто использовать jQuery. Зачем изобретать велосипед?

Еще одной сильной стороной jQuery является то, что он позволяет легко писать JavaScript, который работает во многих различных браузерах. Несовместимость между популярными браузерами, такими как IE, Firefox и Safari, означает, что вам часто приходится писать разные фрагменты кода JavaScript для каждого браузера. Однако с jQuery вы просто вызываете соответствующую функцию jQuery и позволяете jQuery заниматься запуском кода в разных браузерах.Хороший!

Сводка

В этой статье представлен краткий обзор jQuery. Вы узнали, что:

  • jQuery — бесплатная библиотека JavaScript.
  • С помощью jQuery вы можете писать мощные приложения на JavaScript, используя меньше строк кода.
  • jQuery отлично подходит для таких вещей, как анимация, запросы Ajax, манипуляции с DOM, эффекты изображений и элементы пользовательского интерфейса.
  • jQuery позволяет легко писать кроссбраузерный код JavaScript.

В следующей статье я покажу, как начать использовать jQuery.А пока — получайте удовольствие!

Стоит ли использовать или изучать jQuery в 2020 году?

Использовать или не использовать? Учиться или не учиться? Давайте посмотрим, как можно вообще избежать jQuery и почему вам следует продолжать его использовать

Опубликовано ,
Последнее обновление

Какими бы ни были ваши предпочтения в отношении фреймворков и библиотек JavaScript, jQuery сыграл большую роль в экосистеме JavaScript.

Раньше она была гораздо более популярной несколько лет назад, а теперь некоторые потребности jQuery были заменены современными браузерами (к счастью!), Но эта библиотека JavaScript все еще используется массой человек.

Почему jQuery вообще стал таким популярным? Во-первых, jQuery родился в мире, где приложения JavaScript не существовали. В начале-середине 2000-х годов JavaScript в основном использовался для создания слайд-шоу и других виджетов, которые появлялись внутри страницы, таких как галереи изображений, средства выбора даты и т. Д.Он не был достаточно мощным, чтобы делать много вещей, не будучи слишком медленным (компьютеры, конечно, тоже были медленнее).

Следует отметить, что jQuery не была единственной или первой библиотекой. Другие были очень популярны в то время, например, Mootools, YUI, Dojo Toolkit, Scriptaculous и Prototype. В дальнейшем jQuery, вероятно, стал самым известным из них.

В то время у браузеров было много проблем с совместимостью. У нас было много кроссбраузерных причуд и проблем со стандартизацией, и jQuery помог нам, создав уровень абстракции и позаботившись обо всех обходных путях.

jQuery позволял выбирать элементы DOM с использованием синтаксиса селекторов CSS, он был очень удобным для пользователя и очень простым в расширении. Это упростило анимацию JavaScript.

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

Сегодня у нас не так много проблем с совместимостью с браузерами, и Selectors API и Fetch стандартизировали для браузера две лучшие функции jQuery.

jQuery, безусловно, является предметом споров. Некоторые говорят, что jQuery — пережиток прошлого, некоторые до сих пор используют его изо дня в день. Некоторые люди тратят свое время на то, чтобы писать о том, почему нам не нужен jQuery.

Его использование, несомненно, снизилось за последние несколько лет:

Сегодня ландшафт JavaScript кардинально изменился. Тем не менее, все же полезно знать, что jQuery может для вас сделать.

Вещи, для которых мы использовали jQuery, теперь имеют стандартизированный API браузера

Выбор элементов DOM

Путь jQuery:

Теперь мы можем использовать API селекторов:

  документ.querySelector ('. кнопка')

, если у вас больше элементов:

  document.querySelectorAll ('. Button')

Дождитесь загрузки DOM

Путь jQuery:

  $ (документ) .ready (() => {
// ...
})

Путь DOM:

  document.addEventListener ("DOMContentLoaded", () => {
  // ...
})

Добавить или удалить классы из элемента DOM

Путь jQuery:

  эл.addClass ('большой')
el.removeClass ('большой')
el.toggleClass ('большой')

Путь DOM:

  el.classList.add ('большой')
el.classList.remove ('большой')
el.classList.toggle ('большой')

Удаление элемента из ДОМ

Путь jQuery:

Путь DOM:

(справа, без изменений)

Изменить содержимое элемента в DOM

Путь jQuery:

  эл. Текст ('Привет')
el.html ('Привет')
el.text ()
el.html ()

Путь DOM:

  эл.innerHTML = 'Привет'
el.textContent = 'Привет'
el.innerHTML
el.textContent

Выбор родительского элемента в DOM

Путь jQuery:

Путь DOM:

Прослушивание событий в элементах DOM

Путь jQuery:

  el.on ('click', (e) => {/ * ... * /})

Путь DOM:

  el.addEventListener ('щелчок', (e) => {/ * ... * /})

запросов AJAX

Путь jQuery:

  $.ajax ({
  url: '/api.json',
  тип: 'GET'
  успех: (данные) => {
    console.log (данные)
  }
})

Современный способ JS:

  выборка ('/ api.json')
  .then (ответ => ответ.текст ())
  .then (body => console.log (тело))

Анимации

jQuery-анимации теперь можно выполнять в браузере с помощью CSS-переходов или CSS-анимаций.

Причуды браузера

Транспилируйте свой код с помощью Babel или используйте определенные полифиллы (polyfill.io)

Стоит ли вам использовать jQuery сегодня?

Давайте ответим на вопрос, который ставится в названии статьи. Если вы еще не знаете jQuery, стоит ли изучать его сейчас?

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

Некоторые библиотеки также зависят от jQuery, например Bootstrap.Вы также можете купить готовые шаблоны, которые просто используют его и его плагины.

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

Вы также можете не позволить себе роскошь использовать новейшие крутые технологии (такие как React или Vue), потому что вам необходимо поддерживать старые браузеры, которые имеют более старый набор стандартов. В этом случае jQuery по-прежнему очень актуален для вас.

6 причин, по которым вы должны использовать jQuery

Основанный на манипуляциях с HTML DOM (объектная модель документа) и разработанный для упрощения написания сценариев HTML на стороне клиента, jQuery включает в себя части HTML и CSS. Тысячи компаний поддерживают jQuery, и ваша компания должна быть тоже.

Давайте посмотрим, почему jQuery оказывает такое влияние на корпоративный уровень.

[Что вы знаете об этом надежном инструменте разработчика? Узнайте в тесте JavaScript IQ от InfoWorld.| Узнайте, как работать умнее, а не усерднее, с обзором InfoWorld всех советов и тенденций, которые необходимо знать программистам в Руководстве по выживанию для разработчиков. Загрузите PDF-файл прямо сейчас! | Будьте в курсе последних новостей для разработчиков с помощью информационного бюллетеня InfoWorld Developer World. ]

1. jQuery способствует простоте

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

Кроме того, разработчикам не обязательно быть экспертами в программировании или веб-дизайне, чтобы создавать отличные стили для своих сайтов. Любой разработчик, потративший часы на кодирование и тестирование файлов CSS, несомненно, оценит простую реализацию, которую предлагает jQuery. Также существует набор надежных компонентов пользовательского интерфейса jQuery, которые разработчики могут добавлять на свои веб-сайты.

2. Элементы jQuery отображаются, даже если JavaScript отключен.

Если Adobe Flash не установлен ни в одном браузере, некоторые части страницы могут отображаться некорректно, если они вообще отображаются.Это неприятно не только для пользователя; он вынуждает разработчиков тратить дополнительное время на кодирование для браузеров, в которых отсутствует плагин Flash, что увеличивает время разработки.

Не так с jQuery. Манипулирование HTML DOM стало наиболее широко распространенной практикой манипулирования веб-страницей, поэтому контент будет отображаться, даже если в браузере отключен JavaScript. Поскольку HTML DOM присутствует всегда, вам больше не нужно беспокоиться о настройках браузера.

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

3. jQuery легко интегрируется с Visual Studio IDE

NuGet — это расширение Visual Studio, которое упрощает добавление, удаление и обновление библиотек и инструментов в проектах Visual Studio, использующих .NET Framework. NuGet существует уже много лет и является надежным источником для разработчиков, позволяющих обмениваться пакетами для Microsoft Visual Studio и разрабатывать их.

Visual Studio 2010 поддерживает интеграцию библиотеки jQuery через диалоговое окно «Управление пакетами NuGet».Это активирует функцию Intellisense в Visual Studio, которая дает разработчику немедленный доступ к методам и синтаксису jQuery без необходимости покидать представление кода для исследования. Нет лучшего инструмента для работы в среде .Net на базе Microsoft.

В общем, большинство разработчиков .Net используют Visual Studio и знакомы с NuGet. Это одна из причин, почему популярность jQuery продолжает расти среди разработчиков .Net. С добавлением мобильной темы jQuery для Windows теперь у вас есть все преимущества разработки библиотеки jQuery, доступные для платформы Windows Phone.

Microsoft демонстрирует, что серьезно относится к HTML5, который включает в себя множество элементов jQuery, продвигая использование библиотек jQuery, которые были приняты толпой HTML5. Microsoft поощряет использование jQuery не только в мобильной разработке, но и в новых UI-приложениях в стиле Metro.

4. jQuery создает анимированные приложения точно так же, как Flash

Разработчики Flash обходятся недешево. Разработка во Flash требует огромного обучения; Среднестатистическому разработчику могут потребоваться годы практики, чтобы создать подобные фильмы, прославившие Flash.С другой стороны, jQuery бесплатен и требует только знания JavaScript и HTML.

Допустим, вы можете позволить себе свое программное обеспечение и своего Flash-разработчика. Ему или ей по-прежнему нужно писать код для браузеров и платформ, которые не поддерживают Flash, и для аудитории, которая не сможет просматривать ваш Flash-контент. Это один из самых больших недостатков создания веб-сайта, поддерживающего только Flash, и одно из самых больших преимуществ создания в HTML5.

Между тем, jQuery использует комбинацию CSS, HTML, JavaScript и AJAX.Все эти технологии основаны на разметке и предназначены для совместной работы. Это означает, что вы можете применить стратегию оптимизации к своему сайту, не делая специальных настроек для таких технологий, как Flash. Итог: вы можете добиться великолепных эффектов, которые будут привлекать вашу аудиторию.

Интересные примеры анимации, которая может быть достигнута с помощью HTML5 и jQuery, можно найти в функции boostinspiration.com. Веб-сайты HTML5: 10 примеров уничтожения Flash.

5.Страницы jQuery загружаются быстрее

Google и другие поисковые системы используют время загрузки страницы как один из многих факторов, влияющих на SEO. (Подробнее об этом позже.) По этой и многим другим причинам каждый разработчик должен стремиться к тому, чтобы код был как можно более легким и кратким.

Лучший способ сделать это — уменьшить размер кода. Если ваш сайт написан на основе HTML и CSS, вы можете легко внести в код единообразные корректировки, которые уменьшат размер. Как и CSS, файлы jQuery обычно хранятся отдельно от самой веб-страницы.Это позволяет разработчикам вносить изменения во всем сайте через один центральный репозиторий вместо поиска по структурам папок. Это основное преимущество кодирования CSS, и это доказанный успех.

Кроме того, jQuery дает вам возможность загружать теги div только тогда, когда они вам нужны. Если вы принимаете меры для повышения скорости своего веб-сайта, вы можете подумать о загрузке только необходимых тегов div, необходимых для события загрузки страницы. Таким образом, вы можете отображать только то, что пользователю нужно сразу увидеть, а остальные элементы вашего подразделения загружаются по мере необходимости.

6. jQuery может быть оптимизированным для SEO

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

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

Например:

    Отобразите вывод jQuery здесь

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

      намного быстрее, чем настраиваемый элемент или тег — и по-прежнему будет использоваться в HTML5.

      Еще одно SEO-преимущество комбинации HTML5-jQuery, о котором стоит упомянуть, заключается в том, что в анимацию можно загружать ключевые слова, которые могут быть прочитаны поисковыми системами.

      Зачем вам нужен jQuery

      Давайте резюмируем некоторые преимущества использования jQuery в вашем следующем проекте веб-разработки.

      • Цена подходящая. Библиотека jQuery бесплатна.
      • Светло. Поскольку jQuery отправляет контент клиенту, он сокращает время ожидания ответа сервера. Кроме того, он меньше, чем Flash, поэтому обеспечивает более плавное воспроизведение и меньшее количество ошибок.
      • Работает везде. HTML5 совместим с несколькими браузерами — он будет работать в любом браузере, мобильном телефоне или планшете и даже на устройствах Apple.
      • Низкая кривая обучения. Поскольку он основан на простом старом JavaScript, разработчики могут быстро изучить jQuery.
      • Наконец, jQuery оптимизирован для SEO и совместим с CSS3.

      В будущем вашей компании придется доставлять контент на множество различных платформ, включая настольные компьютеры, планшеты и смартфоны, не говоря уже о появлении смарт-телевизоров и других подключенных устройств. 1-2 удара HTML5 и jQuery — одно из лучших решений для такого типа разработки.

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

      Ричард Хайн — писатель, редактор и веб-разработчик с более чем 15-летним опытом в области веб-разработки. Вы можете связаться с ним через LinkedIn или по электронной почте. Следите за всем с CIO.com в Twitter @CIOonline, на Facebook и в Google+.

      Узнайте больше о Java в разделе «Анализ Java» для ИТ-директоров.

      Этот рассказ «6 причин, по которым вам следует использовать jQuery» был первоначально опубликован

      ИТ-директор.

      Авторские права © 2012 IDG Communications, Inc.

      jQuery CDN | 6 главных преимуществ использования jQuery в веб-разработке

      jQuery CDN — это метод включения jQuery на веб-сайт без фактической загрузки и сохранения его в папке веб-сайта.Существует множество jQuery CDN, примеры — Google, Microsoft, Belgua CDN, собственный CDN jQuery и т. Д.

      Повысьте производительность своего веб-сайта с помощью jQuery CDN

      Получите jQuery CDN БЕСПЛАТНО

      Почему использование jQuery CDN полезно для вашего сайта?

      Когда вы используете jQuery CDN, вы на самом деле делаете 2 положительных момента:

      1. Снижение нагрузки на ваш сайт, поскольку файл jQuery будет загружаться из CDN, а не с вашего сайта.
      2. jQuery загружается быстрее с CDN, чем с вашего сайта. Это связано с тем, что CDN созданы из скорости, они обслуживают jQuery с ближайшей точки к пользователям.

      CDN — это серверы данных и алгоритмы балансировки нагрузки, которые обеспечивают очень быстрое обслуживание jQuery.

      Введение в jQuery

      jQuery UI CDN — это набор предварительно написанного кода, известный как библиотека JavaScript. Разработчики веб-сайтов и приложений добавляют файл загрузки jQuery в свои проекты кодирования вместо того, чтобы создавать свои собственные.Для многих задач кодирования маршрутизации рекомендуется использовать функции JavaScript вместо того, чтобы тратить время на их кодирование. Веб-разработчики могут сосредоточиться на кодировании сложных функций своих веб-сайтов.

      Разработчики используют jQuery UI CDN по следующим причинам:

      • Делает программирование более эффективным и быстрым
      • Имеет открытый исходный код и имеет широкую базу пользователей, вносящих свой вклад или модифицирующих его
      • Имеет обширную документацию
      • Хорошо работает с другими библиотеками JavaScript
      • Имеет различные плагины, расширяющие его функциональность.

      jQuery CDN создает рабочий код путем более быстрой разработки, который работает в различных типах браузеров.Однако веб-разработчикам нужен файл загрузки jQuery для анализа библиотеки. Для некоторых операций необработанный JavaScript может обеспечить лучшую производительность, но преимущества jQuery UI CDN перевешивают его недостатки. Лучшие веб-сайты используют jQuery UI CDN из-за его надежности.

      Разница между jQuery CDN и JScript

      JScript

      Microsoft разработала JScript как язык сценариев с использованием стандарта ECMA. Это интерпретируемый язык, не требующий предварительной компиляции перед выполнением.Это для веб-браузеров, которые соответствуют сценарию Windows. Он полезен в качестве механизма сценариев Windows, поскольку может быть подключаемым модулем к приложениям Windows, таким как Active Server Pages, Internet Explorer и Windows Script Host.

      Нет необходимости явно объявлять типы данных переменных, потому что он может выполнять автоматические преобразования. Однако он предлагает ограниченную поддержку для запуска сценариев, поскольку для их запуска требуется хост или интерпретатор, такой как Windows Script host, Internet Explorer или Active Server Pages.

      jQuery

      jQuery CDN — это быстрая и лаконичная библиотека JavaScript, которая упрощает обработку событий, анимацию, взаимодействие AJAX и переход по HTML-документам для быстрой разработки веб-сайтов. jQuery UI CDN упрощает создание сценариев HTML на стороне клиента; следовательно, это упрощает разработку приложений Web 2.0.

      Файл загрузки

      jQuery — это бесплатная библиотека с двумя лицензиями, открытым исходным кодом и Стандартная общественная лицензия GNU.CDN jQuery UI предоставляет разработчикам функциональные возможности для создания подключаемых модулей для добавления в библиотеку JavaScript. Более того, файл загрузки jQuery разрабатывает абстракции для низкоуровневого взаимодействия и анимации, сложных эффектов и высокоуровневых виджетов. Его модульный механизм облегчает создание мощных и высокоэффективных веб-страниц и веб-приложений.

      Библиотека jQuery CDN предлагает различные удобные функции и стратегии для разработки многофункциональных приложений.Разработчики любят его за простоту функций. Они используют jQuery UI CDN во всех веб-приложениях и могут хорошо работать со многими языками веб-программирования.

      Преимущества jQuery CDN в веб-разработке

      jQuery UI CDN объединяет части CSS и HTML для простого написания сценариев на стороне клиента. Вы можете использовать его для своего веб-сайта, так как тысячи разработчиков уже используют его. Мы перечислили некоторые преимущества использования jQuery CDN.

      1. Простота использования

      Веб-разработчики любят jQuery CDN, потому что она проста в освоении и интуитивно понятна. Они не тратят много времени на развертывание jQuery CDN на своем сайте или в приложении, потому что файл загрузки jQuery использует открытые стандарты кодирования и простой синтаксис. Более того, им не нужно быть экспертами по веб-дизайну или программированию, чтобы создавать отличные стили для своих веб-сайтов. У них даже есть список надежных компонентов CDN jQuery UI, которые они могут просто подключить к своим сайтам.

      2. Работает даже без подключаемого модуля Adobe Flash

      Элементы jQuery UI CDN будут правильно отображаться даже без Adobe Flash. Веб-разработчики могут манипулировать HTML DOM, даже если браузер отключает JavaScript. Более того, использование упреждающего кодирования jQuery CDN может предотвратить сбои браузера и уменьшить количество отчетов в службу поддержки.

      3. Легко интегрируется с Visual Studio IDE

      Visual Studio 2010 интегрируется с библиотекой jQuery CDN через диалоговое окно «Управление пакетами NuGet».NuGet — это расширение, которое обеспечивает легкое добавление, удаление и обновление библиотек и инструментов в проектах, использующих .NET Framework. Веб-разработчики получают немедленный доступ к синтаксису файла и методов загрузки jQuery, не покидая представления кода для исследования.

      4. Создает анимированные приложения в стиле Flash

      Создание фильмов, подобных кино, возможно с помощью jQuery CDN, и разработчикам необходимо знать только HTML и JavaScript. Более того, jQuery UI CDN бесплатен и сочетает в себе CSS, JavaScript, HTML и AJAX, поэтому создатели веб-сайтов могут оптимизировать свои сайты без особых настроек.

      5. Загружает страницы быстрее

      Время загрузки страницы имеет большое значение в стратегиях SEO, потому что поисковые системы рассматривают его как один из факторов. Таким образом, веб-разработчики должны стремиться создавать краткий и легкий код, когда это возможно. Файл загрузки jQuery имеет отдельное хранилище от веб-страницы, поэтому разработчики используют центральный репозиторий при внесении изменений на веб-сайте. Более того, они могут загружать теги div только при необходимости.

      6.Оптимизация для SEO

      Веб-разработчики могут использовать jQuery CDN для обеспечения оптимизации своих веб-страниц для поисковых систем. Они могут использовать различные доступные плагины, чтобы помочь им. Более того, использование неупорядоченных списков при встраивании элементов jQuery CDN хорошо вписывается в практику SEO.

      Как ускорить веб-сайт WordPress с помощью сервера CDN?

      Сеть доставки контента (CDN) — это сеть серверов по всему миру. Он размещает и доставляет копии статического и динамического контента веб-сайта WordPress своим подписчикам.Это дополнительный метод увеличения скорости загрузки файла jQuery.

      Например, хост веб-сайта может находиться в США, поэтому его посетителям из Европы придется немного подождать, потому что загружаемый файл jQuery должен пройти расстояние от источника до места назначения. Задержка — это задержка или время, необходимое для передачи данных по сети. Чем дальше расстояние, на которое должен пройти файл загрузки jQuery, тем больше его задержка.

      jQuery CDN имеет два типа: традиционный опрашивающий jQuery UI CDN и обратный прокси jQuery UI CDN.При традиционном извлечении jQuery UI CDN поддерживает копию контента и мультимедиа веб-сайтов, но клиент по-прежнему запрашивает у провайдера веб-хостинга. С другой стороны, обратный прокси-сервер перехватывает запросы и немедленно реагирует на них. Это промежуточный сервер, который предлагает надежный брандмауэр веб-приложений, который блокирует попадание плохого трафика на хостинг-провайдера или веб-сайт. Однако это стоит больше, чем традиционный CDN jQuery UI.

      Включить jQuery CDN несложно.Во-первых, владельцу веб-сайта необходимо выбрать поставщика CDN jQuery UI и подписаться на его предложение услуг. Возможно, ему придется платить с помощью файла загрузки jQuery или ежемесячно. Для традиционного pull jQuery UI CDN доступен бесплатный плагин для простой интеграции с сайтом WordPress. Он автоматически связывает ресурсы с jQuery CDN. С другой стороны, обратный прокси-сервер jQuery UI CDN не требует дополнительных модулей.

      Хотите узнать, как jQuery CDN может улучшить вашу веб-производительность? BelugaCDN предлагает тарифные планы CDN от 20 долларов.Зарегистрироваться сейчас!

      CDN потоковое видео

      Провайдеры CDN для потокового вещания

      Связанные ресурсы

      .

      Добавить комментарий

      Ваш адрес email не будет опубликован. Обязательные поля помечены *