Статья опубликована в рамках: Научного журнала «Студенческий» № 3(173)
Рубрика журнала: Информационные технологии
Скачать книгу(-и): скачать журнал часть 1, скачать журнал часть 2, скачать журнал часть 3, скачать журнал часть 4
ИССЛЕДОВАНИЕ ТЕХНОЛОГИЧЕСКИХ РЕШЕНИЙ ДЛЯ РАЗВИТИЯ КЛИЕНТСКОЙ ЧАСТИ ВЕБ-ПОРТАЛА
RESEARCH OF TECHNOLOGICAL SOLUTIONS FOR THE DEVELOPMENT OF THE CLIENT SIDE OF THE WEB PORTAL
Ruslan Bagayev
master student, faculty of “computer systems and professional education”, Kazakh Agrotechnical University named after S. Seifullin,
Republic of Kazakhstan, Nur-Sultan
Zhanat Kenzhebaeva
Scientific Supervisor, Candidate of Technical Sciences, Acting Associate Professor of the Computer Engineering and Software Department, Kazakh Agrotechnical University named after S. Seifullin,
Republic of Kazakhstan, Nur-Sultan
АННОТАЦИЯ
В данной статье рассматривается сравнительный анализ frontend-фреймворков для развития клиентской части веб-портала и обосновывается выбор на основе проведенного анализа.
ABSTRACT
This article discusses a comparative analysis of frontend frameworks for the development of the client side of a web portal and justifies its choice based on the analysis.
Ключевые слова: frontend, фреймворк, библиотека, React.
Keywords: frontend, framework, library, React.
Следует отметить, что практически все современные фреймворки имеют схожий функционал и способны решить поставленную перед ними задачу. Таким образом, выбор в первую очередь должен основываться не на функционале фреймворка, а на требованиях и целях в рамках конкретного проекта. Для рассмотрения были выбраны самые известные фреймворки, включая AngularJS 2, React, Ember.js, Vue.js и Polymer. В таблице 1 показаны преимущества и недостатки этих фреймворков с учетом применимости к разработке веб-портала.
Таблица 1.
Преимущества и недостатки frontend-фреймворков
|
Фреймворк |
Преимущества |
Недостатки |
|
AngularJS 2 |
Богатая документация; Большое сообщество; Имеет большое количество функций; Поддерживает REST; Есть Angular Universal для решения задач поисковой оптимизации (рендеринга страниц на сервере); Поддерживает двустороннюю привязку данных. |
Использует TypeScript для компиляции в JavaScript; Для решения даже небольшого функционала необходимо предпринять множество действий. |
|
React |
Компактность; Высокая производительность; Подходит для крупных и сложных проектов с высокой степенью нагрузки. |
Требуется дополнительная реализация на сервере для работы с данными (например, Flux или Redux); Комплексный подход к разработке, непривычный для новичков. |
|
Ember.js |
Большая экосистема; Подходит для сложных и больших приложений; Поддерживает REST; Поддерживает двустороннюю привязку данных. |
На уровне контроллера нет повторного использования компонентов; Слишком велик для небольших проектов |
|
Vue.js |
Мало зависимостей; Хорошая производительность; Хорошая экосистема; Поддерживает двустороннюю привязку данных. |
Разработан в основном одним человеком; Нет поддержки REST "из коробки" (есть библиотека Axios). |
|
Polymer |
Высокая скорость работы. |
Слишком молодой фреймворк; Немного готовых решений и примеров. |
Polymer — это библиотека, основанная на довольно новой технологии Web Components. Возможны проблемы с поддержкой браузеров, проблемы со стабильностью работы, а также большой порог входа для разработчиков. В связи с этим от использования данного фреймворка было решено отказаться из-за возможных рисков.
Ember.js имеет сложную структуру проекта и большой порог входа для начинающих разработчиков, а в случае выхода за рамки стандартного использования является громоздким и не таким гибким, как остальные. Кроме того, фреймворк менее популярен, чем AngularJS, Vue.js и React.
Vue.js на данный момент является самым быстрорастущим популярным фреймворком, он взял лучшие решения от Ember.js, React и AngularJS, а также обладает хорошей производительностью. Но Vue.js не поддерживает REST и для этого требуется дополнительные библиотеки.
AngularJS 2 — это параллельный проект с AngularJS 1, который разрабатывается отдельно. AngularJS 2 сильно усложнен, ведь для написания самого простого приложения требуется гораздо больше действий. Кроме того, он написан на TypeScript, что потребует дополнительных знаний от разработчиков.
В итоге остается последний вариант, то есть React. React построен на концепции компонентов. Он отличается от таких фреймворков, как Angular или Ember, которые используют двухстороннюю привязку данных для обновления HTML страницы. На взгляд многих фронтенд-разработчиков, React проще для изучения, чем Angular или Ember – он намного меньше и хорошо работает с jQuery и другими фреймворками. Он, к тому же, чрезвычайно быстр, так как использует виртуальный DOM и обновляет только измененные части страницы (обращение к DOM до сих пор является самой медленной частью современных WEB-приложений, поэтому данная библиотека и получает преимущество в производительности, оптимизируя его).
Список литературы:
- Angular для профессионалов / Фримен Адам: Питер, 2018 — 800 с.
- React и Redux: функциональная веб-разработка / Алекс Бэнкс, Ева Порселло: Питер, 2018 – 336 c.
- Изучаем Angular 2 / Пабло Дилеман: ДМК Пресс, 2017 – 354 с.
- Building Native Web Components. Front-End Development with Polymer and Vue.js / Carlos Rojas: Apress, 2020 – 244 с.
- Vue.js в действии / Листуон Бенджамин, Хэнчетт Эрик: Питер, 2019 – 304 с.
Оставить комментарий