A closer look at WebAssembly Denis Eleskovic 26th August, 2020 Faculty of Computing Blekinge Institute of Technology SE-371 79 Karlskrona Sweden This diploma thesis is submitted to the Faculty of Computing at Blekinge Institute of Technology in partial fulfillment of the requirements for the diploma degree in Software Engineering. The thesis is equivalent to 10 weeks of full time studies. Contact Information: Author: Denis Eleskovic E-mail: [email protected] University advisor: Andreas Arnesson Department of Software Engineering Faculty of Computing Internet : www.bth.se Blekinge Institute of Technology Phone : +46 455 38 50 00 SE-371 79 Karlskrona, Sweden Fax : +46 455 38 50 57 ii (45) ABSTRACT WebAssembly is a new emerging technology for the web which offers a low-level bytecode format for other languages to compile to. The aim of the technology is to effectively speed up the performance of the web, as well as to offer a way for developers to port existing libraries and code that were written in static languages such as C/C++ or Rust. The technology is currently supported in all the major browsers of today. This study takes a closer look at how the technology works and how it is compiled and executed across two of the major browsers as compared to JavaScript. Furthermore, a smaller experiment was conducted where AssemblyScript was used to compile to WebAssembly, with AssemblyScript being a typescript-to-WebAssembly compiler. The two technologies were then tested in terms of runtime performance and consistency across two browsers, operating systems as well as with different optimizations. The study showed that the technology goes through ahead-of-time-compilation and optimization through a compiler toolchain that depends on the language used as opposed to JavaScript which makes use of just-in-time-compilation. Furthermore, the fundamental structure for WebAssembly proved to be limited in order to be able to better link directly to machine code and through this offer performance benefits. The experiment conducted showed that WebAssembly performed better when it came to pure calculations but fell behind JavaScript when performing operations on an array. The reason is most likely due to the overhead of passing data structures between the two technologies. The experiment further showed that WebAssembly was able to offer a more consistent and predictable performance than JavaScript. Keywords: WebAssembly, JavaScript, JITC, AOT 1 (45) TABLE OF CONTENTS 1 INTRODUCTION ....................................................................................................................................... 3 1.1 BACKGROUND........................................................................................................................................ 3 1.2 PURPOSE ................................................................................................................................................ 3 1.3 SCOPE .................................................................................................................................................... 4 2 QUESTIONS TO BE ANSWERED ........................................................................................................... 5 3 METHOD ..................................................................................................................................................... 7 3.1 LITERATURE REVIEW ............................................................................................................................. 7 3.2 EXPERIMENTAL STUDY .......................................................................................................................... 8 4 LITERATURE REVIEW ......................................................................................................................... 11 4.1 INTRODUCTION .................................................................................................................................... 11 4.2 WEBASSEMBLY ................................................................................................................................... 11 4.2.1 Semantic Phases ............................................................................................................................. 12 4.2.2 AssemblyScript ................................................................................................................................ 13 4.3 JAVASCRIPT ......................................................................................................................................... 13 4.3.1 Compilers ........................................................................................................................................ 13 4.3.2 Just-in-time ..................................................................................................................................... 14 4.3.3 Profile-based optimizations ............................................................................................................ 15 4.3.4 V8 Engine........................................................................................................................................ 15 4.3.5 Spidermonkey Engine ..................................................................................................................... 16 4.4 CONCLUSION ....................................................................................................................................... 17 5 EMPIRICAL EXPERIMENT .................................................................................................................. 19 5.1 RESULTS .............................................................................................................................................. 19 5.2 CONCLUSION ....................................................................................................................................... 30 6 ANALYSIS AND DISCUSSION .............................................................................................................. 31 6.1 WEBASSEMBLY AND JAVASCRIPT IN THE BROWSER ............................................................................ 31 6.2 STRENGTHS AND WEAKNESSES ............................................................................................................ 33 6.3 PERFORMANCE ..................................................................................................................................... 35 6.4 CONSISTENCY ...................................................................................................................................... 36 7 CONCLUSION .......................................................................................................................................... 38 7.1 KEY CONCLUSIONS: ............................................................................................................................. 39 8 FUTURE WORK ....................................................................................................................................... 40 REFERENCES ................................................................................................................................................... 41 2 (45) 1 INTRODUCTION 1.1 Background As the web has developed over the years, developers have always had to keep up with the latest technological advancements meant to make web applications faster and more efficient. JavaScript has proven powerful enough to solve most issues, with it being the only natively supported language on the web. As the need for speed and efficiency has rapidly escalated, JavaScript has shown it does not possess the necessary performance to produce apps which require near native performance. Consequently, four of the major browser companies came together to create WebAssembly with the goal of bringing safe, fast and portable code to the Web [1]. WebAssembly is a low level bytecode; a compilation target for several different languages meant to enable developers to create apps at near native performance and can be used in more intensive use cases, making CAD applications, video/image editing and scientific visualization and simulation available directly in the browser [1]. 1.2 Purpose The release of WebAssembly has garnered interest in the developer community, with many choosing to benchmark the technology using various methods and comparing it against plain JavaScript [2], [3], [4], [5]. Consequently there have been many benchmarks performed for the different languages supported by WebAssembly but few have been performed using AssemblyScript [6]. AssemblyScript is a strict subset of Typescript, which compiles to WebAssembly, effectively making AssemblyScript a Typescript-to-WebAssembly compiler [7]. AssemblyScript enables existing JavaScript developers to be able to take advantage of WebAssembly in applications without needing to learn a new language; this can have a major effect on how the web develops for the foreseeable future as JavaScript is the most used language [8]. Therefore the aim of this paper is to provide greater insight into how WebAssembly operates in order to shed more light on the technology and to better understand where it fits in on the web. Furthermore, there have been various benchmarks performed using Assemblyscript but they have not looked at performance across browsers, operating systems and also how the technology is affected by the JavaScript engine [6]. 3 (45) 1.3 Scope In order to