Оригинал: You SHOULD Learn Vanilla JavaScript Before JS Frameworks, автор Francois-Xavier P. Darveau

Что такое «ванильный JavaScript»?

Цитата со Stack Overflow:

VanillaJS – это использование простого JavaScript без каких-либо дополнительных библиотек, таких как jQuery. Люди используют этот термин как шутку, чтобы напомнить другим разработчикам, что многое можно сделать в наши дни без дополнительных библиотек JavaScript.

Или, в нашем случае, без новых, причудливых фреймворков.

Фреймворк Vanilla JS

История сайта Vanilla JS, выдающего себя за сайт очередного JS фреймворка, коротка, но забавна. Эрик Вастл создал его в 2012 году, чтобы с щепоткой троллинга и путаницы объяснить: зачастую можно использовать простой JavaScript без дополнительных фреймворков или библиотек.

Хотя Эрик не использовал термин как таковой, его сайт, безусловно, способствовал его популярности.

Состояние современного «обычного» JavaScript

Исторически сложилось так, что разработчики должны были обходить нативный JavaScript для решения многих задач, например, кроссбраузерности, или просто для выхода за пределы возможностей языка. Речь идет о далеких днях IE 6-7. Очень часто им в этом помогала jQuery. Но сейчас этот продолжительный условный рефлекс опоры на внешние библиотеки уже не нужен, благодаря эволюции спецификации ECMAScript, и современным браузерам, поддерживающим большинство новых возможностей.

Сегодня выбор Vanilla JS вместо jQuery чаще всего является самым разумным, не раздувая кодовую базу ненужными зависимостями. Очевидный пример с великолепного сайта Возможно вам не нужна jQuery:

// jQuery
$('.my #awesome selector');

// vanilla JS
document.querySelectorAll('.my #awesome selector');

На этом сайте полно примеров ванильного JS, обязательно посмотрите!

Если вам нужно больше доказательств:

О JS фреймворках: за и против

Прежде всего, что мы имеем ввиду под термином «JS фреймворки»?

Речь идет о всех этих  AngularVueReact, Backbone, Ember, Knockout, Ext, jQuery, Meteor, Express, Koa, Total, Socket.io и им подобных. Да, безусловно, они все разные. Да, некоторые из них на самом деле не фреймворки, а скорее библиотеки. Но в рамках этой статьи мы обобщим их, потому что все они имеют общую цель.

За: JavaScript-фреймворки великолепны

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

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

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

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

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

Против: JavaScript-фреймворки ужасны

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

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

Ты не React-разработчик и не Vue-разработчик. Ты просто разработчик.

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

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

Почему сначала нужно учить ванильный JavaScript?

Если вы освоите основы JavaScript, то вашей единственной проблемой при изучении новых фреймворков будет их синтаксис.

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

За последние 5 лет появилось больше 10 фронтенд-фреймворков. Угадайте, сколько будет в ближайшие 5-10 лет? Если вы просто притворяетесь, что знаете JavaScript, этот движок, питающий веб-революцию, как вы будете идти с ним в ногу?

Просто подумайте о том, что сегодня делают «разработчики jQuery»: пытаются догнать Angular. Завтра они будут пытаться догнать React / Vue. И этот грустный цикл продолжается.

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

Где и как учить ванильный JavaScript?

Надеюсь, вы готовы запачкать руки простым старым JavaScript. Вот вам суперсовет:

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

И еще несколько конкретных рекомендаций:

  • Всякий раз, когда в тренде появляется новый фреймворк, продолжайте читать исходники.
  • Каждый раз, когда вы пишете код, попробуйте найти простое ванильное решение, вместо того, чтобы сразу искать библиотеку.
  • Идите на Stack Overflow и бросьте себе вызов, отвечая на вопросы по нативному JS.

Для начинающих: вот отличный материал для старта. И еще немного:

  1. Основы языка на UdacityCodecademy и freeCodeCamp;
  2. JavaScript: Understanding the Weird Parts
  3.  YDKJS-серия!

А здесь огромный список ресурсов для обучения.

Еще парочка статей:

Заключение

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

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

Принцип «сначала изучи основы» применим практически ко всему в жизни. От изучения нового языка программирования до нового вида спорта. Это требует много практики, но когда вы освоите основы, начнется самое интересное.

0 комментариев

Оставить комментарий

*Доступные HTML-теги: a, abbr, blockquote, code, pre, del, i, em, strong, b, strike
*Не будет опубликован