React native performance evaluation

Thumbnail Image

Files

master_Eskola_Rasmus_2018.pdf (1.07 MB)

URL

Journal Title

Journal ISSN

Volume Title

Perustieteiden korkeakoulu | Master's thesis
Unless otherwise stated, all rights belong to the author. You may download, display and print this publication for Your own personal use. Commercial use is prohibited.

Authors

Date

2018-06-18

Department

Major/Subject

Security and Cloud Computing

Mcode

SCI3084

Degree programme

Master’s Programme in Computer, Communication and Information Sciences

Language

en

Pages

54 + 1

Series

Abstract

Smartphones have become an ubiquitous device for people, and there are multiple mobile platforms to choose from. For mobile developers this means more work, as they will need to learn the tools and technologies unique to each platform, and develop their application separately for each platform. Cross platform tools such as React Native promise a solution where developers can use the same tools and technologies across different platforms. A React Native application is essentially a JavaScript application that controls native user interface components. As such, a React Native application has to perform more background work compared to an equivalent native mobile application. This thesis studies whether React Native carries any meaningful performance penalties with it on the Android platform, and whether it is possible to work around these problems. It aims to provide some insight into the performance figures of React Native for both developers considering the technology and researchers wanting to do further research. Methods for measuring application launch times, render latency of components, navigation latency and list scrolling are presented. In all but the last case, the measurements can be directly compared between a React Native and an Android application to find out the exact overhead of React Native in each situation. The findings indicate that React Native does incur meaningful performance penalties compared to native code. In many cases the performance hit is not significant enough to cause user frustration, but especially on older devices common operations such as application launch and component rendering are noticeably slower and may have up to 10 times longer latency than the native equivalent. On modern devices the overhead of React Native is less noticeable, making React Native a better fit when targeting newer hardware.

Smarttelefoner har blivit allestädes närvarande bland folk, och det finns flera olika plattformer att välja mellan. För mobilutvecklare innebär detta mera arbete, eftersom de måste behärska diverse plattformers unika verktyg samt teknologier, och dessutom utveckla sina applikationer för varje platform skilt. Plattformsoberoende teknologier som t.ex. React Native erbjuder en lösning som möjliggör användningen av samma verktyg och teknologier för flera olika plattformer. En React Native applikation är i grund och botten en JavaScript applikation som kan rita upp nativa användargränssnittskomponenter. Detta betyder att en React Native applikation är tvungen att göra mera arbete jämfört med en nativapplikation. Detta diplomarbete undersöker om huruvida React Native har några betydelsefulla prestandaproblem på Android plattformen, och om det är möjligt att kringgå sådana problem. Arbetets syfte är att ge en insikt i React Natives prestanda åt utvecklare som överväger att använda teknologin, samt åt forskare som vill göra vidare forskning inom ämnet. Metoder presenteras för att mäta applikationers starttid, komponenters ritningstid, latens i hantering av navigation, samt rullandet av en lista. I alla utom det sista fallet kan resultaten jämföras direkt mellan React Native och Android, vilket ger oss exakt information över hur mycket extra beräkningstid React Native behöver i respektive situation. Undersökningen påvisar att React Native är betydligt långsammare än nativkod i vissa fall. Ofta är skillnaden inte tillräckligt stor för att orsaka frustration hos användaren, men speciellt på äldre telefoner kan vanliga händelser som applikationens starttid eller komponenters rittid vara till och med 10 ggr. långsammare i en React Native applikation jämfört med en ekvivalent Android applikation. På moderna telefoner är skillnaden mellan React Native och nativkod inte lika stor, vilket gör att React Native passar bättre in ifall applikationens målgrupp använder nyare hårdvara.

Description

Supervisor

Ylä-Jääski, Antti

Thesis advisor

Paasonen, Tuomas

Keywords

react native, mobile, JavaScript, cross-platform, performance, Benchmark

Other note

Citation

Permanent link to this item

https://urn.fi/URN:NBN:fi:aalto-201806293885

Collections

[dipl] Perustieteiden korkeakoulu / SCI