Performance analysis of Svelte and Angular applications


Abstract

The aim of this article is to check if the Svelte-based client part of a web application is more effective than the standard Angular approach. The article presents a comparison of page components rendering times on the basis of two test applications prepared in both frameworks. For the performance tests, scenarios were prepared in which the times of adding and removing a different number of page components were examined. Application tests were performed using the Selenium Webdriver package. The research results clearly showed that the new approach used for DOM manipulation (Svelte v.3.0) is more efficient than the standard solution used in Angular applications (v.10.2).


Keywords

Svelte; Angular; performance; frontend

N. Joshi, obraz real i virtual DOM, https://medium.com/@nami996joshi/real-dom-448076454705, [13.04.2021].

Dokumentacja Angular, https://angular.io/docs, [13.04.2021].

O. Therox, Svelte i TypeScript, https://svelte.dev/blog/svelte-and-typescript, [10.03.2021].

Dokumentacja Svelte, https://svelte.dev/docs, [13.04.2021].

S. Kołodziejczak, Svelte – wszystko, co powinieneś wiedzieć o nowej wersji tego narzędzia, https://geek.justjoin.it/svelte-frontend, [13.04.2021].

A. Haseeb, Real and Virtual DOM, https://medium.com/@ahaseeb12251998/virtual-dom-vs-real-dom-angular-vs-react-framework-vs-libraries-spas-vs-mpa-s-946fceb70955, [13.04.2021].

T. Tolliday, Getting Acquainted With Svelte, the New Framework on the Block, 2020, https://css-tricks.com/getting-acquainted-with-svelte-the-new-framework-on-the-block/, [13.04.2021].

D. Glazer, Svelte – „nowy” framework frontendowy!, https://www.ideo.pl/firma/o-nas/nasze-publikacje/svelte-3-nowosci,150.html, [13.04.2021]

J. Schae, A RealWorld Comparison of Front-End Frameworks with Benchmarks, 2020, https://medium.com/dailyjs/a-realworld-comparison-of-front-end-frameworks-2020-4e50655fe4c1/, [13.04.2021].

Narzędzie Chrome Dev Tools na GitHub https://github.com/ChromeDevTools/devtools-frontend/blob/80c102878fd97a7a696572054007d40560dcdd21/front_end/sdk/NetworkManager.js#L252-L274, [04.03.2021].

Download

Published : 2021-06-30


Białecki, G., & Pańczyk, B. (2021). Performance analysis of Svelte and Angular applications. Journal of Computer Sciences Institute, 19, 139-143. https://doi.org/10.35784/jcsi.2633

Gabriel Białecki  gabriel.bialecki@pollub.edu.pl
  Poland
Beata Pańczyk 
Lublin University of Technology  Poland