12 вещей, которые нужно учитывать при оценке любой новой библиотеки JavaScript
Как узнать, стоит ли тратить время на новую технологию?
В этом году в Обзоре состояния JavaScript я хотел копнуть немного глубже и не только узнать, какие инструменты и библиотеки используют люди, но и почему они их используют.
Это означает, что мне нужно было найти способ перевести личные предпочтения в холодные, достоверные данные. После некоторого исследования я придумал 12-балльную шкалу, которая охватывает основные аспекты выбора и работы с любой технологией.
Пройдите викторину!
Чтобы вам было проще применить шкалу к любой библиотеке, я подготовил небольшую викторину, которая познакомит вас со всеми 12 факторами и даст вам окончательную рекомендацию:
➡️ Пройдите 12-факторную викторину
Если вы не знаете, что оценивать, просто сделайте это в библиотеке, с которой вы знакомы (React, Vue, jQuery…), и посмотрите, насколько хорошо она набирает баллы!
Или вы можете прочитать, чтобы узнать больше о каждом факторе и посмотреть, как их можно применить.
Примечание. Об исследовании состояния JavaScript
Как я уже упоминал, я изначально разработал эту шкалу как способ получить более детализированные данные для ежегодного исследования Состояние JavaScript.
Если вы хотите внести свой вклад и помочь выявить последние тенденции в экосистеме JavaScript, пройдите опрос!
А теперь вернемся к 12-бальной шкале.
Факторы
Вот полный список:
- 🕹️ Возможности
- 🐞 Стабильность
- ⚡ Производительность
- 🎁 Экосистема пакетов
- 🌎 Сообщество
- 👶 Кривая обучения
- 📖 Документация
- 🔧 Инструменты
- 🏛️ Запись трека
- 👫 Команда
- ⚖️ Совместимость
- 📈 Импульс
Я объясню важность каждого фактора, а также дам вам шкалу оценок, чтобы показать, как их оценивать. Давайте пройдемся по списку!
🕹️ Особенности
Первая причина, по которой вы выберете какую-либо технологию, скорее всего, связана с ее назначением.
Но ключевой вопрос здесь - знать, как далеко идти. React, вероятно, является самой популярной интерфейсной библиотекой на данный момент, но распространенная жалоба заключается в том, что она просто делает недостаточно, оставляя такие вещи, как маршрутизация и управление состоянием, сторонним библиотекам, таким как React-Router и Redux.
Фактически, это большая часть привлекательности Vue, крупнейшего конкурента React. Предоставляя официальные пакеты для этих распространенных вариантов использования, ему удалось предложить более всестороннее решение и завоевать большую популярность.
Опять же, если зайти слишком далеко, вы можете получить раздутую и сложную структуру, которая пытается быть всем для всех.
Так что иногда нужен минималистский подход. Такие библиотеки, как Lodash или Ramda, позволяют заменять беспорядочные вложенные циклы for краткими функциональными выражениями, и этого достаточно, чтобы сделать их бесценными инструментами.
Опять же, все дело в поиске правильного равновесия!
Система баллов
- A: Разблокирует то, что раньше было просто невозможно.
- B: позволяет делать то же самое, что и раньше, но лучше.
- C: Менее чем текущие решения.
🐞 стабильность
У вас может быть самый элегантный и полнофункциональный фреймворк, но это мало что значит, если разработчики будут сталкиваться с ошибками каждые две минуты.
По этой причине многие инструменты в текущей экосистеме JavaScript сосредоточены на добавлении стабильности и безопасности в стек. Не смотрите дальше успехов TypeScript и Flow или даже таких языков, как Reason.
Что касается уровня данных, система типов GraphQL также способствует тому, чтобы все работало гладко.
Система баллов
- A: Меньше ошибок, а проблемы легче отлаживать и решать.
- B: внедрение технологии не влияет на стабильность вашего программного обеспечения.
- C: Новые ошибки и проблемы возникают как прямое следствие внедрения технологии.
⚡ Производительность
Если вы когда-либо занимались боевыми искусствами, вы знаете, что одно из лучших качеств, которые вы можете иметь на своей стороне, - это скорость, а не сила.
Точно так же все функции в мире бесполезны, если ваше приложение загружается за 15 секунд. К тому времени пользователь уже закрыл вкладку, а вы проиграли битву еще до того, как она началась!
В экосистеме JavaScript достаточно Preact, чтобы увидеть пример сосредоточения внимания на скорости: его API идентичен React, поэтому он не пытается конкурировать по функциональности. Но благодаря тому, что он легче и быстрее загружается, чем React, он позволяет вам сэкономить драгоценные миллисекунды и повысить производительность вашего веб-приложения.
Система баллов
- A: Более легкий пакет, более быстрое время загрузки или другие улучшения производительности.
- B: внедрение технологии не влияет на производительность вашего программного обеспечения.
- C: Внедрение технологии заметно замедляет работу вашего приложения.
🎁 Пакетная экосистема
Прежде чем вкладывать средства в какую-либо новую технологию, важно взглянуть на экосистему, которая сложилась вокруг нее.
Яркая экосистема пакетов не только позволяет сэкономить много времени, поскольку позволяет использовать работу других, но и является признаком того, что технология достигла определенного уровня зрелости. По этой причине хорошо поддерживаемые сторонние пакеты являются одним из лучших возможных признаков того, что разработчики приняли технологию в долгосрочной перспективе.
Система баллов
- A: Ecosystem предлагает однозначные решения для общих проблем; сторонние пакеты хорошо поддерживаются и хорошо документированы.
- B: Развивающаяся экосистема пакетов с множеством конкурирующих новых возможностей.
- C: Никакой экосистемы пакетов, о которой можно было бы говорить, требуется много ручной работы.
🌎 Сообщество
Еще один фактор, который следует учитывать, - это сообщество в целом. Выделенный форум или канал в Slack могут оказаться огромным подспорьем при возникновении проблем.
Также полезно иметь существующий репозиторий ответов Stack Overflow для поиска. И, конечно же, необходима хорошо поддерживаемая страница с проблемами на GitHub!
Система баллов
- A: Форум и / или чат (Slack / Discord и т. д.) с ежедневной активностью, проблемы с GitHub решаются в течение дня. Многие ответили на вопросы о переполнении стека.
- B: Форум и / или чат с нечастой активностью.
- C: Нет сообщества за пределами GitHub.
👶 Кривая обучения
Простая кривая обучения повышает вероятность того, что разработчики попробуют вашу платформу или библиотеку. Заманчиво думать, что если технология действительно разрушительна, люди преодолеют любые препятствия, но часто это просто неправда.
Тесно связанное (но иногда противоположное) понятие - это кривая принятия. Когда он только был запущен, Meteor был чрезвычайно простым в использовании (по крайней мере, по сравнению с существующими альтернативами), но требовал, чтобы вы приняли весь его стек сразу, что очень затрудняло реализацию для существующих проектов.
React также известен своей сложной кривой обучения: для разработчиков, привыкших разделять HTML и JavaScript, необходимость использования JSX может быть сложной задачей. Vue, с другой стороны, значительно упрощает начало работы без необходимости переосмысливать то, как вы думаете о внешнем кодировании.
Система баллов
- A: Можно начать за один день.
- B: Прежде чем стать продуктивным, требуется около недели.
- C: Более недели требуется, чтобы изучить основы.
📖 Документация
Большая часть легкого обучения - отличная документация. Достичь этого труднее, чем кажется, поскольку люди, пишущие документацию, обычно обладают наибольшим опытом; Это означает, что они также наиболее далеки от нового интерфейса для разработчиков.
Поэтому для написания хорошей документации нужно на секунду забыть то, что вы знаете, и поставить себя на место человека, только открывшего для себя вашу технологию.
Это также требует предвидения распространенных проблем, понимания ментальной модели пользователя и, прежде всего, поддержания всего в актуальном состоянии по мере изменения вашей кодовой базы! И все это отнимает драгоценное время от написания кода ...
Учитывая все эти факторы, вы можете понять, почему хорошая документация - это редкость и ценность!
Система баллов
- A: Специальный сайт документации, скринкасты, примеры проектов, учебные пособия, документация по API и хорошо прокомментированный код.
- B: Базовая версия Read Me и документация по API.
- C: Очень кратко, прочтите меня, единственный способ узнать, как использовать библиотеку, - это посмотреть ее код.
🔧 Инструменты
Как и документация, инструменты - одна из тех вещей, которые могут показаться второстепенным отвлечением некоторых специалистов по сопровождению, но на самом деле жизненно важны для популярности и успеха любой технологии.
Я считаю, что главной причиной успеха Redux является его удивительное расширение для браузера Devtools, которое позволяет визуализировать хранилище Redux и действия в очень удобной для пользователя форме. Точно так же отличная поддержка TypeScript в VS Code творит чудеса с его принятием.
Система баллов
- A: Два или более из: расширений браузера, расширений текстового редактора, служебной программы командной строки, специализированных сторонних служб SaaS.
- B: Одно из: расширения браузера, расширения текстового редактора, служебная программа командной строки, специализированные сторонние службы SaaS.
- C: Никаких внешних инструментов.
🏛️ Запись трека
В конце концов, даже самая элегантная и хорошо документированная библиотека будет легко отклонена как ничто иное, как пустышка в кастрюле, если она существует всего шесть месяцев.
Мы все можем пересказывать истории о принятии «следующей большой вещи» только для того, чтобы вернуться к старому доброму Rails / PHP / * вставить проверенные технологии сюда *, когда дела пойдут плохо.
По этой причине ничто не может побить твердый рекорд. Express - один из примеров: он был первоначально выпущен в 2010 году, но до сих пор считается серверной средой Node.js по умолчанию, несмотря на стремительные темпы развития экосистемы JavaScript.
Система баллов
- A: Был около 4+ лет, принял мои крупные компании и известные технические консалтинговые компании.
- B: существует уже 1–4 года, используется первопроходцами и небольшими консультантами.
- C: существует меньше года, пока не получил реального внедрения.
👫 Команда
Не все проекты имеют существующий послужной список. Когда библиотека новая, как вы оцениваете ее потенциал? Один надежный способ узнать, кто за этим стоит.
Когда React только появился, тот факт, что за ним стоял не кто иной, как Facebook, был большим аргументом, чтобы хотя бы попробовать его. Затем Facebook выпустил Relay и GraphQL, показав, что успех React не был случайностью!
И у более крупных компаний также есть больше ресурсов для инвестирования: Google смог продолжить поддерживать исходный Angular.js даже после выпуска новых несовместимых версий.
Конечно, это не означает, что одинокие специалисты по обслуживанию не могут также создавать серьезные инновации. Так в конце концов родился Vue.js, не говоря уже о 99% всего программного обеспечения с открытым исходным кодом.
Система баллов
- A: Поддерживается крупной компанией со специальной командой разработчиков ПО.
- B: Поддерживается командой инженеров среднего размера с солидным индивидуальным послужным списком.
- C: Одинокий специалист по обслуживанию, работающий независимо.
⚖️ Совместимость
Самое замечательное в использовании передовых библиотек заключается в том, что они обычно развиваются довольно быстро. К сожалению, это также может быть серьезным недостатком!
Быстрый темп улучшений также может означать частые критические изменения, поскольку новые передовые практики заменяют старые шаблоны, оставляя ранним последователям оплачивать затраты на рефакторинг.
React Router вызвал много нареканий, когда они решили полностью изменить свой API между версиями 3 и 4. Так же поступил и Angular, когда они перешли с Angular.js на новый «просто Angular».
Частые обновления - это весело и интересно, когда вы только начинаете новый проект, но когда ваше приложение запущено и работает в производственной среде, последнее, что вам нужно, - это тратить недели на рефакторинг и отладку каждый раз, когда приходит новая версия библиотеки. из.
Система баллов
- A: Обновления в основном обратно совместимы, устаревание обрабатывается с предупреждениями, а несовместимые старые версии поддерживаются в течение двух или более лет.
- B: Критические изменения действительно случаются, но они хорошо задокументированы и внедряются постепенно.
- C: Частые критические обновления, требующие серьезного рефакторинга без надлежащего руководства.
📈 Импульс
И последнее, но не менее важное: импульс. Другими словами, шумиха.
Шумиха часто рассматривается как нечто плохое («не становитесь жертвой шумихи»), как показатель стиля, а не содержания. Но так быть не всегда.
При достаточной динамике новый программный проект может привлечь больше пользователей и участников, а это означает, что ошибки будут обнаруживаться и исправляться быстрее, экосистема пакетов может развиваться, и в конечном итоге всем станет лучше.
Но да, есть и обратная сторона медали: слишком много шумихи слишком рано может подвергнуть потенциальных пользователей незаконченной версии, пронизанной проблемами, отключив их навсегда. Как говорится, у вас есть только один шанс произвести первое впечатление.
Система баллов
- A: Уровень ажиотажа выше 9000: топ Hacker News, тысячи звезд GitHub, выступления на крупных конференциях.
- B: Некоторый интерес к первоначальному запуску, сотни звезд GitHub.
- C: Одинокий разработчик, трудящийся в безвестности. Однажды я им покажу! Я им всем покажу !!
Обновление: еще несколько факторов
Некоторые из вас предложили рассмотреть еще несколько важных факторов. Что нужно учитывать для потенциальной версии 2.0 шкалы!
- Масштабируемость: насколько хорошо технология подходит для крупных проектов.
- Принятие: кто еще использует эту технологию в настоящее время?
- Совместимость: насколько хорошо эта технология работает с другими существующими технологиями?
- Развязка: насколько легко отказаться от технологии, если вы хотите прекратить ее использовать?
Пример использования: клиент Apollo
Давайте проверим нашу систему подсчета очков, применив ее к реальной, реальной библиотеке: Apollo Client.
Apollo - это клиент GraphQL, другими словами, это библиотека, которая будет запрашивать конечную точку GraphQL и загружать ее данные в клиент вместо вас. Он также обрабатывает такие вещи, как кеширование, контроль за тем, чтобы данные не дублировались, и отправку этих данных в выбранную вами интерфейсную библиотеку.
Посмотрим, как это работает в нашей системе подсчета очков!
🕹️ Особенности: B
Apollo предлагает более эффективные способы запроса данных, поэтому он представляет собой постепенное улучшение существующих инструментов.
🐞 Стабильность: A
Принятие Apollo и GraphQL действительно упрощает анализ ваших данных и отслеживание проблем.
⚡ Производительность: B
Apollo действительно включает инструменты для оптимизации загрузки данных, но в целом не должно оказывать чрезмерного влияния на производительность вашего приложения.
🎁 Экосистема пакета: A
Apollo поддерживает пакеты, называемые ссылками, для включения дополнительных функций.
🌎 Сообщество: B
У Apollo действительно есть очень активный чат в Slack, но, по моему опыту, вопросы иногда могут оставаться без ответа, и бывает сложно получить ответы от занятых членов основной команды.
👶 Кривая обучения: B
Изучение всех нюансов Apollo на самом деле может быть проблемой, особенно если вы одновременно учитесь использовать GraphQL.
📖 Документация: A
Хорошая, хорошо поддерживаемая документация для нескольких интерфейсных фреймворков, а также примеры кодовых баз.
🔧 Инструмент: A
Расширение для браузера и специальная платформа метрик.
🏛️ Запись: B
Сам Apollo все еще относительно новый, как и пространство GraphQL в целом.
👫 Команда: A
Высококвалифицированная и хорошо финансируемая команда с опытом запуска других open-source проектов (Метеор).
⚖️ Стабильность: B
Критическое обновление с v1 до v2, но в целом хорошая стабильность и обратная совместимость с тех пор.
📈 Импульс: B
Apollo, возможно, еще не стал нарицательным, но он доминирует в своей нише, несмотря на преимущество Relay.
Общая оценка: A 🥇
Набрав 29 баллов из 36 возможных, Apollo в итоге преуспевает! Даже если всегда будут области для улучшения, легко понять, почему он был принят в производственную среду многими командами, которым нужен надежный способ работы с данными GraphQL.
Другие подходы
Ребята из NPMS внедрили похожую систему рейтингов, автоматизирующую просмотр данных GitHub и NPM. Это делает их оценку менее субъективной, но, с другой стороны, это не касается таких вещей, как документация или сообщество.
Что касается необработанных данных, вы также можете получить классную статистику с помощью NPM Trends:
И узнайте больше о том, какие библиотеки сейчас популярны в Best of JS:
И, конечно же, всегда есть прошлогодние результаты опроса State of JS:
А как насчет вас, как вы обычно оцениваете библиотеки? Оставьте комментарий, дайте мне знать!
Заключение
Эта шкала ни в коем случае не является абсолютным показателем ценности библиотеки. В конце концов, это всегда будет в основном субъективным и сильно зависит от вашего проекта и ваших потребностей.
Тем не менее, мы надеемся, что это может послужить полезной отправной точкой. По крайней мере, это может служить контрольным списком, чтобы убедиться, что вы не упускаете из виду ничего важного, прежде чем совершить большой прыжок в будущее!
