Интеграция библиотеки виджетов на основе React / Preact в устаревшее веб-приложение - PullRequest
0 голосов
/ 17 мая 2018

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

Моя идея создать:

  • Библиотека, которая будет использовать React / Preact для создания виджетов.
  • Используйте ES6 / TS + webpack + babel, чтобы в итоге перенести в ES5 и упаковать его в библиотеку.

Моя основная проблема связана с зависимостями сторонних библиотек (например, реагировать, реагировать или действовать), я думаю об одном из этих двух подходов:

A. Рассматривайте сторонние библиотеки как внешние зависимости , устаревшее приложение, которое должно использовать мою библиотеку виджетов, должно ссылаться на эту библиотеку.

  • Плюсы: в мой комплект не добавлен дополнительный вес, эту библиотеку можно использовать в старых и современных приложениях.
  • Минусы: возможный ад версии в будущем, например мы выпускаем библиотеку для React 16, и в будущем они смешивают другие виджеты из другой библиотеки, которые зависят от React 18 (возможно, возможный обходной путь - исправлять версии и время от времени выполнять миграцию «все или ничего»).

B. Вставить преакт в комплект библиотеки:

  • Плюсы: только добавляя от 3 до 4 Кб к комплекту библиотеки, комплект самодостаточен.
  • Минусы: возможно, мы не смогли бы использовать эти компоненты в современной разработке (например, создать его с другими компонентами из других библиотек на основе реагирования).

Какой может быть лучший подход? Есть ли другой вариант? Имеет ли смысл подход Б? (раньше не пробовал)

1 Ответ

0 голосов
/ 17 мая 2018

Я бы склонялся к ответу B .

  • если вам нужно объединить их с другими библиотеками, у вас все еще есть исходники в ES6 +, что позволяет легко импортировать их в новый проект.

  • На самом деле я работаю только с B-подходом, потому что он устраняет кошмар зависимостей.Вы знаете, что отправляете код с совместимой версией реакции, и у вас есть полный контроль над окончательным кодом ES5 с помощью babel.

  • Если вы переживаете так много за 10 КБ, есть много способовуменьшить размер (включить сжатие, убедиться, что вы используете рабочий комплект и т. д.).

...