Требуются предложения по разделению компонентов на модули и пакетов, которые необходимо

Прямо сейчас у меня есть гигантская база кода для моего проекта в ReactJS, которая включает около 20 модулей в панели навигации, которая занимает до 25 МБ, когда я ее связываю. Теперь есть несколько клиентов. Я доставляю один и тот же код, но всем клиентам не нужны все модули с панели навигации, некоторые хотят 3, некоторые хотят 4, а некоторые хотят 12 из них. Теперь мне нужно связать весь код с параметрами, скрытыми на панели навигации, и отправить весь код всего для 2 или 3 модулей.

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

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

Любая идея или предложение будут оценены по этим двум вопросам.

Заранее спасибо.

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
23
1

Ответы 1

Вы можете использовать разделение кода для решения своей первой проблемы. Более новая версия React (16.6) предоставляет React.lazy() для динамического импорта. Есть и другие известные решения, включая реагирующий, CommonsChunkPlugin или SplitChunksPlugin (в зависимости от версии используемого вами веб-пакета).

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

Я уже реализовал динамический импорт, но это не влияет на размер пакета. это все еще 25 МБ. Чанк загружается во время выполнения. Но мне нужно также уменьшить размер пакета,

Harish Soni 07.01.2019 11:27

Другие вопросы по теме