Экосистема JavaScript развивается быстрыми темпами, и вы знаете, что ваш набор инструментов будет заменён, как только вы его выберете!
Невозможно угнаться за всеми библиотеками, фреймворками и методами, но вы можете наблюдать тенденции и направления движения в отрасли. React.js, Vue.js, Svelte, Node.js и Express.js останутся популярными в 2021 году, но некоторые интересные вспомогательные инструменты всплывают на поверхность.
Вот мои фавориты на 2021 год. Но, пожалуйста, не полагайтесь на моё мнение. Оцените их сами.
Rollup.js
Rollup.js — это сборщик модулей JavaScript нового поколения от Рича Харриса, автора Svelte. Он компилирует небольшие фрагменты кода в более крупные отдельные файлы и включает:
- архитектура плагина
Базовая система может быть расширена такими плагинами, как транспиляция Babel ES5, интеграция TypeScript, ESLinting, минификация Terser и даже обработка CSS.
- совместимость модулей
Rollup.js поддерживает стандартные модули ES6, но модули CommonJS на основе Node require()можно анализировать с помощью плагина.
- трясущийся
Код подвергается статическому анализу, чтобы исключить неиспользуемые переменные, функции и методы. Таким образом, вы можете импортировать большую библиотеку, но в окончательный пакет будут включены только те функции, которые вы используете.
- разделение кода
Rollup может разбить код на части для динамической загрузки (по запросу) или нескольких точек входа.
Rollup.js можно запускать из командной строки, npmсценария и общих средств выполнения задач, таких как Gulp, с параметрами наблюдения или без них.
rollup.config.jsФайл может быть определён для более сложных конфигураций. Например:
// rollup.config.js // CommonJS plugin import commonjs from '@rollup/plugin-commonjs'; export default { // primary source entry script input: './src/main.js', // output script and format output: { file: './build/main.js', format: 'iife' }, // plugins plugins: [ commonjs() ] };
Rollup.js впервые появился в 2018 году, но набирает обороты благодаря своей скорости и простоте. Возможно, вы использовали его в Snowpack, не осознавая этого.
Snowpack
Snowpack — это быстрый интерфейсный инструмент для сборки, который является прямым конкурентом таких тяжёлых опций, как webpack и Parcel. Преимущества включают:
- мгновенный запуск
- единая сборка с кешированием
- горячая перезагрузка модуля
- десятки плагинов
- встроенная поддержка модулей ES6, модулей CommonJS, TypeScript, Svelte, React, JSX, модулей CSS и др.
Snowpack создаёт ресурсы автоматически. Вы можете установить его в любой проект как зависимость от разработки:
npm install --save-dev snowpack
Затем запустите сервер разработки:
npx snowpack dev
В index.htmlвашем браузере откроется файл по умолчанию. Все страницы сканируются на наличие файлов JavaScript и CSS, которые объединены в отдельные ресурсы.
Конечный производственный сайт может быть создан в buildкаталоге с:
npx snowpack build
snowpack.config.jsФайл конфигурации можно определить модули и дополнительные опции.
Разработка шла быстро, и Snowpack версии 3.0 был запущен в январе 2021 года. Согласно веб-сайту, «как только вы попробуете его, вернуться к чему-либо ещё невозможно».
Rome
Современная разработка требует от вас установки, настройки и изучения ряда инструментов с использованием различных методов и приёмов. Rome стремится унифицировать инструментальную цепочку интерфейсной разработки, предоставляя линтер, компилятор, сборщик, генератор документов, средство форматирования, средство запуска тестов и минификатор для содержимого HTML, CSS и JavaScript. По сути, это пакет с нулевой зависимостью, который заменяет webpack, Babel, ESLint, Prettier, Jest и другие.
Rome активно разрабатывался в течение 2020 года, и на момент написания поддерживается только линтинг. Тем не менее, проект привлёк значительное внимание, и недавний призыв к финансированию превысил более чем четверть его целевого показателя в 100 000 долларов.
Если Рим сможет успешно достичь своих целей, он может стать единственным инструментом, который вам нужен.
esbuild
Неудивительно, что большинство инструментов сборки JavaScript написано на JavaScript. Скорость обычно приемлема, но скомпилированное приложение всегда будет быстрее. esbuild — ещё один сборщик модулей JavaScript, но он написан на Go. Он утверждает, что он:
- В 100 раз быстрее, чем Rollup.js
- В 173 раза быстрее, чем Webpack 5
- А также в 294 раза быстрее, чем в Parcel 2
Сроки создания производственного пакета из десяти копий three.js с использованием настроек по умолчанию, минификации и исходных карт:
esbuild достигает этой скорости без кеша и по-прежнему поддерживает модули ES6, модули CommonJS, TypeScript, JSX, встряхивание дерева, карты источников, минификацию, плагины, объединение Node.js, полный API и многое другое.
Эван Уоллес (Evan Wallace) — единственный основной разработчик esbuild, и версия 1.0 ещё не выпущена. Это может вызвать тревогу у команд, работающих над критически важными приложениями, но обновления поступают быстро. Следите за проектом.
Waypoint
Передача вашего производственного сайта хосту остаётся проблемой. Некоторые предлагают системы сборки на основе Git. Другие используют процессы контейнеризации. У многих есть своя необычная и замечательная терминология и техники. Предполагая, что вы успешно преодолеете сложности процесса сборки AWS, сможете ли вы переключиться на Azure по прихоти своего начальника или клиента?
Waypoint абстрагирует процесс выпуска, чтобы обеспечить согласованный рабочий процесс для создания, развёртывания и выпуска на любой платформе. Для развёртывания требуется одна команда:
waypoint up
Waypoint — это проект с открытым исходным кодом, который в настоящее время поддерживает проекты JavaScript, Ruby, Python, Go и.NET в Kubernetes, Amazon ECS, Google Cloud Run, экземплярах контейнеров Azure, Docker, Buildpacks и т.д. Он расширяемый, а система плагинов позволяет ему работать с любым инструментом или платформой. После успешного развёртывания Waypoint предоставляет полный доступ к журналам, мониторам и другим процессам для управления вашим приложением.
Waypoint был выпущен в середине 2020 года, но его использование, похоже, резко возрастёт в 2021 году. Веб-сайт отличный и показывает команды терминала, вводимые при прокрутке. Стоит посмотреть, даже если развёртывание вас не интересует!
Eleventy
Eleventy — это генератор статических сайтов Node.js, разработанный Заком Лезерманом из Netlify. Это просто, быстро и было принято многими движущими силами в веб-индустрии. И до версии 1.0 всё ещё не дошло. Посмотрите, как коммерческое использование значительно возрастёт, когда будет выпущен этот этап.
Для получения дополнительной информации см. Начало работы с Eleventy.
Deno
Deno — это среда выполнения JavaScript, в которой используется движок Chrome V8. Он был разработан Райаном Далем — создателем Node.js — и выпущен в мае 2020 года. По сути, это Node с учётом преимуществ десятилетнего ретроспективного анализа.
Deno является новым, и он сглаживает некоторые морщины, с которыми вы могли столкнуться при разработке серверного JavaScript. Прежде всего, он добавляет безопасность и выбирает браузерные модули ES6, импортированные из URL-адреса, а не модули CommonJS, управляемые с помощью npm. Версии модуля хранятся в вашей системе только один раз, поэтому нет необходимости иметь многомегабайтную node_modulesпапку в каждом проекте.
Deno также предоставляет ряд встроенных инструментов, поэтому нет необходимости в сторонних опциях. Он включает в себя средство обновления, справочную систему, цикл чтения-оценки-печати (REPL), инспектор зависимостей, линтер, средство форматирования кода, средство выполнения тестов, генератор документации, отладчик, сборщик сценариев и установщик платформы.
Наконец, Deno поддерживает некоторые API-интерфейсы, которые вы найдёте в браузерах. В частности, fetch, window, URL, File, FileReader, и такие события, как loadи unload.
Node.js не умер, и Deno ещё предстоит покорить мир, но 2021 будет интересным годом для среды выполнения.
