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

12 вещей, которые нужно учесть при оценке библиотеки JavaScript

?️ Особенности

Первая причина выбора той или иной технологии — ее особенные фишки. Но главное здесь — как далеко вы зайдете в погоне за ними. Например, React — самая популярная библиотека сегодня, но с большим минусом: ее недостаточно для полноценной работы. Для маршрутизации и управления состоянием требуются сторонние библиотеки — React-Router и Redux.

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

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

Однако суть в том, чтобы найти баланс.

Оценка особенностей

  1. Открывает вещи, которые раньше были невозможны.
  2. Позволяет вам делать то же, что и раньше, но лучше.
  3. Делает меньше, чем используемое вами сейчас решение.

? Стабильность

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

Поэтому большое количество инструментов в экосистеме JavaScript сосредоточено на добавлении стабильности и безопасности в стек. Обратите внимание на TypeScript и Flow или такие языки, как Reason.

В сфере загрузки данных система типов GraphQL помогает сайтам работать без сбоев.

Оценка стабильности

  1. Меньше ошибок, проблемы легче отлаживать и решать.
  2. Технология не влияет на стабильность программного обеспечения.
  3. Новые ошибки и проблемы возникают как прямое следствие внедрения технологии.

⚡ Производительность

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

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

Оценка производительности

  1. Решение легче и быстрее того, что используете сейчас, ускорение времени загрузки или другие улучшения производительности.
  2. Технология не влияет на производительность программного обеспечения.
  3. Внедрение технологии заметно замедляет приложение.

? Пакетная экосистема

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

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

Оценка экосистемы

  1. В ней есть однозначные решения для общих проблем. Сторонние пакеты хорошо поддерживаются и хорошо документированы.
  2. Есть множество новых параметров, конкурирующих между собой.
  3. О пакетной экосистеме речи не идет, требуется большая ручная настройка.

? Сообщество

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

Spectrum становится все более популярным по сравнению с чатами и традиционными форумами

Spectrum становится все более популярным по сравнению с чатами и традиционными форумами

  1. Форум и / или чат (Slack / Discord / другое) с ежедневной активностью, вопросы с GitHub рассматриваются в течение дня.
  2. Форум и / или чат с редкой активностью.
  3. Нет сообщества за пределами GitHub.

? Кривая обучения

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

Близкая (но иногда противоположная) концепция — это «кривая принятия». Meteor был очень простым в использовании, когда только появился, — но потребовал, чтобы вы сразу применили весь его стек, что очень сложно реализовать для уже существующих проектов.

У библиотеки React схожая кривая обучения: привыкшим разделять HTML и JavaScript разработчикам использовать JSX сложнее. Но, например, работать с Vue легко, и не придется переосмысливать свои представления о frontend-разработке.

Оценка кривой обучения

  1. Можно начать работу за один день.
  2. Около недели требуется, чтобы вникнуть в работу.
  3. Для изучения основ нужно больше недели.

? Документация

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

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

Документация Vue.js удобно оформлена и хорошо написана

Документация Vue.js удобно оформлена и хорошо написана

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

Учитывая все эти факторы, вы понимаете, почему хорошая документация — редкая и ценная вещь!

Оценка документации

  1. Отдельный сайт с документацией, скринкасты, примеры проектов, учебники, документация по API и хорошо прокомментированный код.
  2. Есть только основы и документация по API.
  3. Лаконичная документация. Единственный способ узнать, как использовать библиотеку, — посмотреть на ее код.

? Инструментарий

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

 Только один DevTools заставляет рассмотреть Redux для использования

Только один DevTools заставляет рассмотреть Redux для использования

Одна из главных причин успеха Redux — его удивительное расширение для браузера DevTools, которое позволяет визуализировать хранилище и действия Redux очень удобным для пользователя способом. Точно так же отличная поддержка TypeScript VS Code сотворила чудо для ее принятия.

Оценка инструментария

  1. Два и более: расширение для браузера, расширение для текстового редактора, утилита CLI, специальные сторонние службы SaaS.
  2. Один из инструментов: расширение для браузера, расширение для текстового редактора, утилита CLI, специальные сторонние службы SaaS.
  3. Внешняя оснастка отсутствует.

?️ Послужной список

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

Express: все еще конкурентоспособен после долгих лет

Express: все еще конкурентоспособен после долгих лет

Поэтому солидный послужной список — это важно. Express — прекрасный тому пример: выпущенный в 2010 году, он по-прежнему считается платформой Node.js по умолчанию, несмотря на стремительное развитие экосистемы JavaScript.

Оценка послужного списка

  1. Работает в течение 4 лет, используется крупными компаниями и известными техническими консультантами.
  2. Возраст от 1 до 4 лет, используется первыми последователями технологии и консультантами меньшего масштаба.
  3. Вышла меньше года назад, реального принятия еще нет.

? Команда

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

Когда появился React, факт, что за ним стоял Facebook, был серьезным аргументом, чтобы как минимум попробовать его. Затем Facebook продолжил выпуск Relay и GraphQL, показывая, что успех React не случаен.

Google Open Source: более 2000 проектов охватывают десктопные, мобильные приложения и другие сферы

Google Open Source: более 2000 проектов охватывают десктопные, мобильные приложения и другие сферы

У крупных компаний больше ресурсов для инвестиций: Google смог продолжить поддерживать оригинальный Angular.js даже после выпуска новых, несовместимых версий.

Конечно, это не означает, что одинокие независимые разработчики не могут создавать серьезные инновации. Например, так появился Vue.js, не говоря уже о 99% всего программного обеспечения с открытым исходным кодом.

Оценка команды

  1. Поддерживается крупной компанией со специальной командой на платформе с открытым исходным кодом.
  2. Поддерживается командой инженеров среднего уровня с личными профессиональными достижениями.
  3. Поддерживается независимым разработчиком.

⚖️ Совместимость

Самое замечательное в использовании передовых библиотек — они развиваются довольно быстро. Но это может стать и серьезным недостатком.

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

React Router создал много проблем, когда они решили полностью изменить свой API между версиями 3 и 4, — как и Angular, когда они перешли от Angular.js к новому «просто Angular».

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

Оценка совместимости

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

? Трендовость

И последнее, но тоже важное, — тренд.

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

JavaScript Rising Stars определяет рост популярных библиотек JavaScript

JavaScript Rising Stars определяет рост популярных библиотек JavaScript

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

Вы пропустили

AEGIS Algorithms Android Angular Apache Airflow Apache Druid Apache Flink Apache Spark API API Canvas AppSec Architecture Artificial Intelligence Astro Authentication Authorization AutoGPT AWS AWS Aurora AWS Boto3 AWS EC2 AWS Lambda Azure Babylon.js Backend bash Beautiful Soup Bento UI Big Data Binary Tree Browser API Bun Career Cassandra Charts ChatGPT Chrome Extension Clean Code CLI ClickHouse Coding Codux Combine Compose Computer Context Fusion Copilot Cosmo Route CProgramming cron Cryptography CSS CTF Cypress DALL-E Data Analysis Data science Database dbt dbt Cloud deno Design Design Patterns Detekt Development Distributed Systems Django Docker Docker Hub Drizzle DRY DuckDB Express FastAPI Flask Flutter For Beginners Front End Development Game Development GCN GCP Geospatial Git GitHub Actions GitHub Pages Gitlab GMS GoFr Golang Google Google Sheets Google Wire GPT-3 GPT3 Gradio Gradle Grafana Graphic Design GraphQL gRPC Guidance HMS Hotwire HTML Huawei HuggingFace IndexedDB InfoSec Interview iOS Jackknife Java JavaScript Jetpack Compose JSON Kafka Kotlin Kubernetes LangChain Laravel Linux LlaMA LLM localStorage Logging Machine Learning Magento Math Mermaid Micro Frontends Mobile Mobile App Development mondayDB MongoDB Mongoose MySQL Naming NestJS NET NetMock Networks NextJS NLP Node.js Nodejs NoSQL NPM OOP OpenAI OTP Pandas PDF PHP Playwright Plotly Polars PostgreSQL Prefect Productivity Programming Prometheus Puppeteer Pushover Python Pytorch Quarkus Rabbitmq RAG Ramda Raspberry Pi React React Native Reactor Redis REST API Revolut Riverpod RProgramming Ruby Ruby on Rails Rust Scalene SCDB ScyllaDB Selenium Servers Sklearn SLO SnowFlake Snowkase Software Architecture Software Development Solara Solid Spring Boot SQL SQLite Streamlit SudoLang Supabase Swift SwiftUI Tailwind CSS Taipy Terraform Testing Transformers TURN TypeScript Ubuntu UI Design Unix UX UX Design Vim Vite VSCode Vue Web Architecture Web Components Web Development Web Frameworks Web Scraping Web-разработка Webassembly Websocket Whisper Widgets WordPress YAML YouTube Zed Наука о данных Разное Тренды

Современный подход к разработке с использованием Next.js