Analiza obciążeniowa aplikacji internetowych z użyciem szkieletów Angular, React i Vue

• Autorzy: Bielak Konrad , Borek Bartłomiej , Plechawska-Wójcik Małgorzata

Identyfikatory

DOI

10.35784/jcsi.2827

Warianty tytułu

EN

Web application performance analysis using Angular, React and Vue.js frameworks

• Języki publikacji: PL

Abstrakty

PL

Celem pracy jest przeprowadzenie analizy wydajnościowej oraz wskazanie na jej podstawie najbardziej przyjaznego dla użytkownika i najszybciej działającego szkieletu. Do sprawdzenia szybkości działania wybranych technologii napisane zostały trzy aplikacje internetowe. Analizie poddano jedne z najpopularniejszych szkieletów, mianowicie: Angular, React i Vue. Statyczne kryteria porównawcze wykorzystane w pracy to: rozbudowana i ogólnodostępna dokumentacja, proces wytwarzania aplikacji, szybkość budowy aplikacji, rozwój oraz wsparcie przez twórców. Kryteriami praktycznymi są czasy mierzone podczas wykonywania testów. Testy wykonane zostały za pomocą prostych operacji korzystających z funkcji CRUD (ang. Create, Read, Update, Delete). Dokonano zestawienia wyników szybkości, w jakiej zrealizowane zostały poszczególne operacje oraz opis analizy technicznej danych szkieletów. Do analizy porównawczej wykorzystano narzędzia deweloperskie takie jak: Google Analytics, Google Chrome, Mozilla Firefox, Chrome DevTools.

EN

The aim of the work is to conduct a performance analysis and, on its basis, to indicate the most user-friendly and fastest operating framework. Three Internet applications have been written to test the speed of operation of selected technologies. Some of the most popular frameworks were analyzed: Angular, React and Vue. Static comparative criteria used in the work are: favorable and generally available documentation, application development, speed of application development, development and support by creators. The practical criteria are the times measured during the execution of the tests. The tests were performed with simple operations using the CRUD (Create Read Update Delete) function. The performance analysis carried out in this way shows the differences between the frameworks. The following developerPersian tools were used for the comparative analysis: Google Analytics, Google Chrome, Mozilla Firefox, Chrome DevTools.

Słowa kluczowe

PL

Angular; React; Vue; analiza obciążeniowa; JavaScript

EN

Angular; React; Vue; Performance; JavaScript

• Wydawca: Wydawnictwo Politechniki Lubelskiej
• Czasopismo: Journal of Computer Sciences Institute
• Rocznik: 2022
• Tom: Vol. 23
• Strony: 77--83
• Opis fizyczny: Bibliogr. 13 poz., rys., tab.

Twórcy

autor

Bielak Konrad

• Politechnika Lubelska, Lublin

autor

Borek Bartłomiej

• Politechnika Lubelska, Lublin

autor

Plechawska-Wójcik Małgorzata

• Politechnika Lubelska, Lublin

Bibliografia

• 1. S. K. Arora, 10 Best JavaScript Frameworks to Use in 2021, https://hackr.io/blog/best-javascript-frameworks, [23.01.2021].
• 2. K. Boczkowski, B. Pańczyk, Comparison of the performance of tools for creating a SPA application interface - React and Vue.js, Journal of Computer Science Institute 14 (2020), 73-77, https://doi.org/10.35784/jcsi.1579.
• 3. J. Kalinowska, B. Pańczyk, Comparison of tools for creating SPA applications using the examples of Angular 2 and React, Journal of Computer Sciences Institute 10 (2019) 1-4, https://doi.org/10.35784/jcsi.183.
• 4. M. Levlin, DOM benchmark comparison of the front-end JavaScript frameworks React, Angular, Vue, and Svelte, Åbo Akademi, 2020.
• 5. Wohlgethan, Supporting Web Development Decisions by Comparing Three Major JavaScript Frameworks: Angular, React and Vue. js. Diss. Hochschule für Angewandte Wissenschaften Hamburg, 2018.
• 6. K. Simkhada, Transitioning Angular 2 User Interface (UI) into React, Helsinki Metropolia University of Applied Sciences, [12.04.2017].
• 7. R. Baida, M. Andriienko M. Plechawska-Wójcik, Perfomance analysis of frameworks Angular and Vue.js, Journal of Computer Sciences Institute 14 (2020) 59-64, https://doi.org/10.35784/jcsi.1577.
• 8. P. Kozlowki, Mastering Web Application Development with AngularJS, [23.08.2013].
• 9. Dokumentacja Vue.js https://vuejs.org/v2/guide/, [30.11.2020].
• 10. Dokumentacja React https://pl.reactjs.org/docs/getting-started.html, [22.03.2021].
• 11. Dokumentacja Angular https://angular.io/docs, [30.11.2020].
• 12. R. Nowacki, M. Plechawska-Wójcik, Comparative analysis of tools dedicated to building Single Page Applications – Angular Js, ReactJS, Ember.js, Journal of Computer Sciences Institute 2 (2016) 98-103, https://doi.org/10.35784/jcsi.122.
• 13. K. Kowalczyk, M. Plechawska-Wójcik, Angular JS and ReactJS libraries – performance analysis, Journal of Computer Sciences Institute 2 (2016) 114-119, https://doi.org/10.35784/jcsi.126.

Uwagi

Opracowanie rekordu ze środków MEiN, umowa nr SONP/SP/546092/2022 w ramach programu "Społeczna odpowiedzialność nauki" - moduł: Popularyzacja nauki i promocja sportu (2022-2023).