DOCSLIB.ORG

Ecmascript (Or ES)

Total Page：16

File Type：pdf, Size：1020Kb

Download full-text PDF Read full-text

Load more

Lesson: Web Programming(1) Omid Jafarinezhad Sharif University of Technology Objective Covers languages, tools, and techniques for developing interactive and dynamic web pages. Topics include page styling, design, and layout; client and server side scripting; web security; and interacting with data sources such as databases Web development can range from developing the simplest static single page of plain text to the most complex web apps (such as electronic businesses, and social network services) ● HTTP, JavaScript, CSS, HTML5, ReactJs, Flow, Progressive Web App ● Golang, NodeJs, MongoDB, PostgreSQL, Redis ● Docker, Git, YUIDoc, Jest, Materials WebPack, Gulp, Browserify, Locust ● (Optional/Research) Kubernetes, InfluxDB, RabbitMQ, gRPC, Ansible Grading Big Picture Internal or external Content Delivery Email/SMS/... services; may be Network (CDN) Service developed in different language Win HTTP, gRPC HTTP Linux WebSocket front-end back-end Data storage Mac JavaScript, Html, NodeJs, mongoDB, CSS, Ajax, GoLang, cache postgreSQL, WebRTC, ReactJs, C#, Java, InfluxDB, ... Mobile AngularJs,... Dart, ... Redis, AMQP, ... Memcached, ... logs queue Logstash, RabitMQ, Fluentd, ... ZeroMQ, ... back-end 1 Load front-end back-end 2 balancing kubernetes cluster, HAProxy, Docker Swarm, ... back-end 3 Git repository Test, Continuous deployment, Code coverage, Merge, Review Build automation, Deployment automation Development Staging Production Bug User feedback, Crash report,... Continuous ... Continuous Integration basically just means that the developer's working copies are synchronized with a shared mainline several times a day. Continuous Delivery is described as the logical evolution of continuous integration: Always be able to put a product into production! Continuous Deployment is described as the logical next step after continuous delivery: Automatically deploy the product into production whenever it passes QA! Build and deployment automation Build automation is the process of automating the creation of a software build and the associated processes including: compiling computer source code into binary code, packaging binary code, and running automated tests ● Ant, make, cmake, Gradle, Gulp, ... Deployment automation is taking your built software and deploying or installing it on a test or production system ● Ansible is a configuration management and provisioning tool, similar to Chef, Puppet or Salt DevOps ● a clipped compound of "development" and "operations" ● is a software development and delivery process that emphasizes communication and collaboration between product management, software development, operations professionals and close alignment with business objectives HTTP The Hypertext Transfer Protocol (HTTP) is an application protocol for distributed, collaborative, and hypermedia information systems A typical HTTP transaction: Response client Web server Request Example of HTTP Request and Response message HTTP/1.1 200 OK Date: Mon, 27 Jul 2009 12:28:53 GMT Server: Apache/2.2.14 (Win32) Last-Modified: Wed, 22 Jul 2009 19:15:56 GMT Content-Length: 88 Content-Type: text/html Connection: Closed client Web server <html> <body> <h1>Hello, World!</h1> GET /hello.htm HTTP/1.1 </body> User-Agent: Mozilla/4.0 (compatible; MSIE5.01; Windows NT) </html> Host: www.tutorialspoint.com Accept-Language: en-us Accept-Encoding: gzip, deflate Connection: Keep-Alive WebSocket ● enables real-time bidirectional communication ● The client establishes a WebSocket connection through a process known as the WebSocket handshake ws://example.com:8000/ wss://example.com:8000/ long-polling With long polling, the client requests information from the server exactly as in normal polling, but with the expectation the server may not respond immediately. If the server has no new information for the client when the poll is received, instead of sending an empty response, the server holds the request open and waits for response information to become available. Once it does have new information, the server immediately sends an HTTP/S response to the client, completing the open HTTP/S Request. Upon receipt of the server response, the client often immediately issues another server request Long-polling (2) The problem is that they carry the overhead of HTTP ● Every time you make an HTTP request a bunch of headers and cookie data are transferred to the server ● This can add up to a reasonably large amount of data that needs to be transferred, which in turn increases latency ○ browser-based game WebSocket vs HTTP HTTP Socket.io Message pattern Request-Response Bidirectional Overhead Moderate overhead per Moderate overhead to request/connection establish & maintain connection, then minimal overhead per message Web Real-Time Communication (WebRTC) ● WebRTC is an open source project to enable real-time peer to peer communication of audio, video and data in Web and native apps ● The discovery and negotiation process of WebRTC peers is called signaling. For two devices in different networks to find each other they need to use a central service called a signaling server. Using the signaling server two devices can discover each other and exchange negotiation messages. WebRTC does not specify signaling; different technologies such as Websockets can be employed for it ● Looking for more information? https://webrtc.ventures/2017/07/webrtc-tutorials/ Hypertext Markup Language (HTML) standard markup language for creating web pages and web applications -- ch01.html Cascading Style Sheets (CSS) ● CSS handles the look and feel part of a web page ● powerful control over the presentation of an HTML document ● Write once and reuse (CSS saves time) ● Pages load faster: do not need to write HTML tag attributes every time -> reduce page size -> page loading time -- ch03.html -- ch04.html (CSS-animations) JavaScript often abbreviated as JS, is a high-level, dynamic (run-time evaluation), weakly typed, object-based, multi-paradigm, and interpreted programming language. As a multi-paradigm language, JavaScript supports event-driven, functional, and imperative (including object-oriented and prototype-based) programming styles Alongside HTML and CSS, JavaScript is one of the three core technologies of World Wide Web content production JavaScript (2) -- ch02.html ECMAScript (or ES) ● ECMAScript is a Standard for a scripting languages ● ECMAScript 5 (ES5): The 5th edition of ECMAScript, standardized in 2009. This standard has been implemented fairly completely in all modern browsers ● ECMAScript 6 (ES6)/ ECMAScript 2015 (ES2015): The 6th edition of ECMAScript, standardized in 2015. This standard has been partially implemented in most modern browsers ○ adds significant new syntax for writing complex applications, including classes and modules, but defines them semantically in the same terms as ECMAScript 5 strict mode Babel ● is a JavaScript compiler (Use next generation JavaScript, today) ● Babel has support for the latest version of JavaScript through syntax transformers ● https://babeljs.io/ NPM Use npm to install, share, and distribute code Manage dependencies in your projects $ npm install <package_name> FLOW ● Is a static type checking for javascript ● Making you code faster, smarter, more confidently, and to a bigger scale https://flow.org/ React (React.js or ReactJS) ● Declarative: makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes. it make your code more predictable and easier to debug ● Component-Based: build encapsulated components that manage their own state, then compose them to make complex UIs ● React can also render on the server using Node and power mobile apps using React Native React (2) XML-like syntax called JSX AngularJs AngularJS is a very powerful JavaScript Framework. It is used in Single Page Application (SPA) projects. It extends HTML DOM with additional attributes and makes it more responsive to user actions JQuery, JQueryUI, JQuery Mobile jQuery is just a JavaScript library Javascript JQuery Ajax The XMLHttpRequest object is part of a technology called Ajax (Asynchronous JavaScript and XML) Using Ajax, data could then be passed between the browser and the server, using the XMLHttpRequest API, without having to reload the web page ● Google Maps, and Gmail that used XMLHttpRequest to get new map tiles, or new email without having to reload the entire page Jest Delightful JavaScript Testing Built-in code coverage reports YUIDoc JavaScript Documentation Tool Gulp gulp is a toolkit for automating painful or time-consuming tasks in your development Browserify Browserify seeks to extend the Node ecosystem into to the browser ● With Browserify you can write code that uses require in the same way that you would use it in Node All of the modules that main.js needs are included in the bundle.js from a recursive walk of the require() graph Webpack webpack is used to compile JavaScript modules webpack is a module bundler for modern JavaScript applications When webpack processes your application, it recursively builds a dependency graph that includes every module your application needs, then packages all of those modules into a small number of bundles - often only one - to be loaded by the browser Progressive Web App Progressive Web App (PWA), in general, is a term used to denote web apps that use the latest web technologies ● Progressive Web Apps are experiences that combine the best of the web and the best of apps What is a Progressive
Recommended publications
  • Differential Fuzzing the Webassembly

    Differential Fuzzing the Webassembly

    Master’s Programme in Security and Cloud Computing Differential Fuzzing the WebAssembly Master’s Thesis Gilang Mentari Hamidy MASTER’S THESIS Aalto University - EURECOM MASTER’STHESIS 2020 Differential Fuzzing the WebAssembly Fuzzing Différentiel le WebAssembly Gilang Mentari Hamidy This thesis is a public document and does not contain any confidential information. Cette thèse est un document public et ne contient aucun information confidentielle. Thesis submitted in partial fulfillment of the requirements for the degree of Master of Science in Technology. Antibes, 27 July 2020 Supervisor: Prof. Davide Balzarotti, EURECOM Co-Supervisor: Prof. Jan-Erik Ekberg, Aalto University Copyright © 2020 Gilang Mentari Hamidy Aalto University - School of Science EURECOM Master’s Programme in Security and Cloud Computing Abstract Author Gilang Mentari Hamidy Title Differential Fuzzing the WebAssembly School School of Science Degree programme Master of Science Major Security and Cloud Computing (SECCLO) Code SCI3084 Supervisor Prof. Davide Balzarotti, EURECOM Prof. Jan-Erik Ekberg, Aalto University Level Master’s thesis Date 27 July 2020 Pages 133 Language English Abstract WebAssembly, colloquially known as Wasm, is a specification for an intermediate representation that is suitable for the web environment, particularly in the client-side. It provides a machine abstraction and hardware-agnostic instruction sets, where a high-level programming language can target the compilation to the Wasm instead of specific hardware architecture. The JavaScript engine implements the Wasm specification and recompiles the Wasm instruction to the target machine instruction where the program is executed. Technically, Wasm is similar to a popular virtual machine bytecode, such as Java Virtual Machine (JVM) or Microsoft Intermediate Language (MSIL).
  • Interaction Between Web Browsers and Script Engines

    Interaction Between Web Browsers and Script Engines

    IT 12 058 Examensarbete 45 hp November 2012 Interaction between web browsers and script engines Xiaoyu Zhuang Institutionen för informationsteknologi Department of Information Technology Abstract Interaction between web browser and the script engine Xiaoyu Zhuang Teknisk- naturvetenskaplig fakultet UTH-enheten Web browser plays an important part of internet experience and JavaScript is the most popular programming language as a client side script to build an active and Besöksadress: advance end user experience. The script engine which executes JavaScript needs to Ångströmlaboratoriet Lägerhyddsvägen 1 interact with web browser to get access to its DOM elements and other host objects. Hus 4, Plan 0 Browser from host side needs to initialize the script engine and dispatch script source code to the engine side. Postadress: This thesis studies the interaction between the script engine and its host browser. Box 536 751 21 Uppsala The shell where the engine address to make calls towards outside is called hosting layer. This report mainly discussed what operations could appear in this layer and Telefon: designed testing cases to validate if the browser is robust and reliable regarding 018 – 471 30 03 hosting operations. Telefax: 018 – 471 30 00 Hemsida: http://www.teknat.uu.se/student Handledare: Elena Boris Ämnesgranskare: Justin Pearson Examinator: Lisa Kaati IT 12 058 Tryckt av: Reprocentralen ITC Contents 1. Introduction................................................................................................................................
  • Machine Learning in the Browser

    Machine Learning in the Browser

    Machine Learning in the Browser The Harvard community has made this article openly available. Please share how this access benefits you. Your story matters Citable link http://nrs.harvard.edu/urn-3:HUL.InstRepos:38811507 Terms of Use This article was downloaded from Harvard University’s DASH repository, and is made available under the terms and conditions applicable to Other Posted Material, as set forth at http:// nrs.harvard.edu/urn-3:HUL.InstRepos:dash.current.terms-of- use#LAA Machine Learning in the Browser a thesis presented by Tomas Reimers to The Department of Computer Science in partial fulfillment of the requirements for the degree of Bachelor of Arts in the subject of Computer Science Harvard University Cambridge, Massachusetts March 2017 Contents 1 Introduction 3 1.1 Background . .3 1.2 Motivation . .4 1.2.1 Privacy . .4 1.2.2 Unavailable Server . .4 1.2.3 Simple, Self-Contained Demos . .5 1.3 Challenges . .5 1.3.1 Performance . .5 1.3.2 Poor Generality . .7 1.3.3 Manual Implementation in JavaScript . .7 2 The TensorFlow Architecture 7 2.1 TensorFlow's API . .7 2.2 TensorFlow's Implementation . .9 2.3 Portability . .9 3 Compiling TensorFlow into JavaScript 10 3.1 Motivation to Compile . 10 3.2 Background on Emscripten . 10 3.2.1 Build Process . 12 3.2.2 Dependencies . 12 3.2.3 Bitness Assumptions . 13 3.2.4 Concurrency Model . 13 3.3 Experiences . 14 4 Results 15 4.1 Benchmarks . 15 4.2 Library Size . 16 4.3 WebAssembly . 17 5 Developer Experience 17 5.1 Universal Graph Runner .
  • Javascript API Deprecation in the Wild: a First Assessment

    Javascript API Deprecation in the Wild: a First Assessment

    JavaScript API Deprecation in the Wild: A First Assessment Romulo Nascimento, Aline Brito, Andre Hora, Eduardo Figueiredo Department of Computer Science Federal University of Minas Gerais, Brazil romulonascimento, alinebrito, andrehora,figueiredo @dcc.ufmg.br { } Abstract—Building an application using third-party libraries of our knowledge, there are no detailed studies regarding API is a common practice in software development. As any other deprecation in the JavaScript ecosystem. software system, code libraries and their APIs evolve over JavaScript has become extremely popular over the last years. time. In order to help version migration and ensure backward According to the Stack Overflow 2019 Developer Survey1, compatibility, a recommended practice during development is to deprecate API. Although studies have been conducted to JavaScript is the most popular programming language in this investigate deprecation in some programming languages, such as platform for the seventh consecutive year. GitHub also reports Java and C#, there are no detailed studies on API deprecation that JavaScript is the most popular language in terms of unique in the JavaScript ecosystem. This paper provides an initial contributors to both public and private repositories2. The npm assessment of API deprecation in JavaScript by analyzing 50 platform, the largest JavaScript package manager, states on popular software projects. Initial results suggest that the use of 3 deprecation mechanisms in JavaScript packages is low. However, their latest survey that 99% of JavaScript developers rely on wefindfive different ways that developers use to deprecate API npm to ease the management of their project dependencies. in the studied projects. Among these solutions, deprecation utility This survey also points out the massive growth in npm usage (i.e., any sort of function specially written to aid deprecation) and that started about 5 years ago.
  • Learning Javascript Design Patterns

    Learning Javascript Design Patterns

    Learning JavaScript Design Patterns Addy Osmani Beijing • Cambridge • Farnham • Köln • Sebastopol • Tokyo Learning JavaScript Design Patterns by Addy Osmani Copyright © 2012 Addy Osmani. All rights reserved. Revision History for the : 2012-05-01 Early release revision 1 See http://oreilly.com/catalog/errata.csp?isbn=9781449331818 for release details. ISBN: 978-1-449-33181-8 1335906805 Table of Contents Preface ..................................................................... ix 1. Introduction ........................................................... 1 2. What is a Pattern? ...................................................... 3 We already use patterns everyday 4 3. 'Pattern'-ity Testing, Proto-Patterns & The Rule Of Three ...................... 7 4. The Structure Of A Design Pattern ......................................... 9 5. Writing Design Patterns ................................................. 11 6. Anti-Patterns ......................................................... 13 7. Categories Of Design Pattern ............................................ 15 Creational Design Patterns 15 Structural Design Patterns 16 Behavioral Design Patterns 16 8. Design Pattern Categorization ........................................... 17 A brief note on classes 17 9. JavaScript Design Patterns .............................................. 21 The Creational Pattern 22 The Constructor Pattern 23 Basic Constructors 23 Constructors With Prototypes 24 The Singleton Pattern 24 The Module Pattern 27 iii Modules 27 Object Literals 27 The Module Pattern
  • Comparing Javascript Engines

    Comparing Javascript Engines

    Comparing Javascript Engines Xiang Pan, Shaker Islam, Connor Schnaith Background: Drive-by Downloads 1. Visiting a malicious website 2. Executing malicious javascript 3. Spraying the heap 4. Exploiting a certain vulnerability 5. Downloading malware 6. Executing malware Background: Drive-by Downloads 1. Visiting a malicious website 2. Executing malicious javascript 3. Spraying the heap 4. Exploiting a certain vulnerability 5. Downloading malware 6. Executing malware Background: Drive-by Downloads Background: Drive-by Downloads Setup: Making the prototype null while in the prototype creates a pointer to something random in the heap. Background: Drive-by Downloads Environment: gc( ) is a function call specific to Firefox, so the attacker would want to spray the heap with an exploit specific to firefox. Background: Drive-by Downloads Obfuscation: If the browser executing the javascript it firefox,the code will proceed to the return statement. Any other browser will exit with an error due to an unrecognized call to gc( ). Background: Drive-by Downloads Download: The return will be to a random location in the heap and due to heap-spraying it will cause shell code to be executed. Background: Goal of Our Project ● The goal is to decode obfuscated scripts by triggering javascript events ● The problem is when triggering events, some errors, resulting from disparity of different engines or some other reasons, may occur and terminate the progress ● We need to find ways to eliminate the errors and Ex 1therefore generate more de-obfuscated scripts <script> function f(){ //some codes gc(); var x=unescape(‘%u4149%u1982%u90 […]’)); eval(x); } </script> Ex 2 <script type="text/javascript" src="/includes/jquery/jquery.js"></script> Project Overview - Part One ● Modify WebKit engine so that it can generate error informations.
  • Time-Travel Debugging for Javascript/Node.Js

    Time-Travel Debugging for Javascript/Node.Js

    Time-Travel Debugging for JavaScript/Node.js Earl T. Barr Mark Marron Ed Maurer University College London, UK Microsoft Research, USA Microsoft, USA [email protected] [email protected] [email protected] Dan Moseley Gaurav Seth Microsoft, USA Microsoft, USA [email protected] [email protected] ABSTRACT Time-traveling in the execution history of a program during de- bugging enables a developer to precisely track and understand the sequence of statements and program values leading to an error. To provide this functionality to real world developers, we embarked on a two year journey to create a production quality time-traveling de- bugger in Microsoft’s open-source ChakraCore JavaScript engine and the popular Node.js application framework. CCS Concepts •Software and its engineering ! Software testing and debug- Figure 1: Visual Studio Code with extra time-travel functional- ging; ity (Step-Back button in top action bar) at a breakpoint. Keywords • Options for both using time-travel during local debugging Time-Travel Debugging, JavaScript, Node.js and for recording a trace in production for postmortem de- bugging or other analysis (Section 2.1). 1. INTRODUCTION • Reverse-Step Local and Dynamic operations (Section 2.2) Modern integrated development environments (IDEs) provide a that allow the developer to step-back in time to the previously range of tools for setting breakpoints, examining program state, and executed statement in the current function or to step-back in manually logging execution. These features enable developers to time to the previously executed statement in any frame in- quickly track down localized bugs, provided all of the relevant val- cluding exception throws or callee returns.
  • Investigating Reason As a Substitute for Javascript

    Investigating Reason As a Substitute for Javascript

    DEGREE PROJECT IN COMPUTER ENGINEERING, FIRST CYCLE, 15 CREDITS STOCKHOLM, SWEDEN 2020 Investigating Reason as a substitute for JavaScript AXEL PETTERSSON KTH ROYAL INSTITUTE OF TECHNOLOGY SCHOOL OF ELECTRICAL ENGINEERING AND COMPUTER SCIENCE Investigation of Reason as a substitute for JavaScript AXEL PETTERSSON Degree Programme in Information and Communication Technology Date: June 4, 2020 Supervisor: Thomas Sjöland Examiner: Johan Montelius School of Electrical Engineering and Computer Science Host company: Slagkryssaren AB Swedish title: Undersökning av Reason som ett substitut till JavaScript Investigation of Reason as a substitute for JavaScript / Undersökning av Reason som ett substitut till JavaScript c 2020 Axel Pettersson Abstract | i Abstract JavaScript has in recent years become one of the most utilized programming languages for developing different kinds of applications. However, even though it has received a lot of praise for its simplicity, versatility and highly active community, it lacks some functionalities and features that a lot of programmers highly value, like static and strict typing, compile-time debugging, and to not be required to make use of third-party libraries to integrate crucial functionality. However, several new languages built on top of JavaScript have been developed to address and resolve these issues developers find with JavaScript without losing the benefits that come with it. One of these super- set languages is Reason, the new syntax and toolchain powered by the OCaml compiler. This thesis aims to address whether there are scenarios where Reason could act as a reasonable substitute of JavaScript by investigating how the languages compare in regards to different criteria. The criteria examined are writability, data structures and typing, reliability and testing, community support, market demand, portability, and performance.
  • Node.Js I – Getting Started Chesapeake Node.Js User Group (CNUG)

    Node.Js I – Getting Started Chesapeake Node.Js User Group (CNUG)

    Node.js I – Getting Started Chesapeake Node.js User Group (CNUG) https://www.meetup.com/Chesapeake-Region-nodeJS-Developers-Group Agenda ➢ Installing Node.js ✓ Background ✓ Node.js Run-time Architecture ✓ Node.js & npm software installation ✓ JavaScript Code Editors ✓ Installation verification ✓ Node.js Command Line Interface (CLI) ✓ Read-Evaluate-Print-Loop (REPL) Interactive Console ✓ Debugging Mode ✓ JSHint ✓ Documentation Node.js – Background ➢ What is Node.js? ❑ Node.js is a server side (Back-end) JavaScript runtime ❑ Node.js runs “V8” ✓ Google’s high performance JavaScript engine ✓ Same engine used for JavaScript in the Chrome browser ✓ Written in C++ ✓ https://developers.google.com/v8/ ❑ Node.js implements ECMAScript ✓ Specified by the ECMA-262 specification ✓ Node.js support for ECMA-262 standard by version: • https://node.green/ Node.js – Node.js Run-time Architectural Concepts ➢ Node.js is designed for Single Threading ❑ Main Event listeners are single threaded ✓ Events immediately handed off to the thread pool ✓ This makes Node.js perfect for Containers ❑ JS programs are single threaded ✓ Use asynchronous (Non-blocking) calls ❑ Background worker threads for I/O ❑ Underlying Linux kernel is multi-threaded ➢ Event Loop leverages Linux multi-threading ❑ Events queued ❑ Queues processed in Round Robin fashion Node.js – Event Processing Loop Node.js – Downloading Software ➢ Download software from Node.js site: ❑ https://nodejs.org/en/download/ ❑ Supported Platforms ✓ Windows (Installer or Binary) ✓ Mac (Installer or Binary) ✓ Linux
  • Approaches to Optimizing V8 Javascript Engine

    Approaches to Optimizing V8 Javascript Engine

    Дмитрий Бочарников. Подходы к оптимизации движка JavaScript V8. Труды ИСП РАН, том 27, вып. 6, 2015 г., Dmitry Botcharnikov. Approaches to Optimizing V8 JavaScript Engine. Trudy ISP RAN /Proc. ISP RAS, vol. 27, issue с.21-32 6, 2015, pp. 21-32 To speed up execution of JavaScript programs there were developed several optimization techniques in recent years. One example of modern high-performing JavaScript engine is a V8 engine [2] used in Google Chrome browser and node.js web server among others. This is an open source project which implemented some advanced optimization methods including Just-in-Time compilation [3], Approaches to Optimizing V8 JavaScript Polymorphic Inline Caches [4], optimized recompilation of hot code regions, On Engine Stack Replacement [5] &c. In previous year we were involved in project of optimizing performance of V8 JavaScript engine on major benchmark suites including Octane [6], SunSpider [7] Dmitry Botcharnikov <[email protected]> and Kraken [8]. The project was quite time limited, however we achieved about LLC Samsung R&D Institute Rus, 12, ul. Dvintsev, housing 1, office #1500, 10% total performance improvement compared to open source version. Moscow, 127018, Russian Federation The rest of paper is organized as follow: in Section 2 there is an architectural overview of V8, in Section 3 we enumerate and reason our approaches with more Abstract . JavaScript is one of the most popular programming languages in the world. Started detailed discussion in Sections 4, 5, and 6. We conclude in Section 7. as a simple scripting language for web browsers it now becomes language of choice for millions of engineers in the web, mobile and server-side development.
  • Building Maintainable Web Applications Using React – an Evaluation of Architectural Patterns Conducted on Canvas LMS

    Building Maintainable Web Applications Using React – an Evaluation of Architectural Patterns Conducted on Canvas LMS

    Linköping University | Department of Computer and Information Science Master’s thesis, 30 ECTS | Datateknik 2020 | LIU-IDA/LITH-EX-A--20/004--SE Building maintainable web applications using React – An evaluation of architectural patterns conducted on Canvas LMS David Johansson Supervisor : Jonas Wallgren Examiner : Peter Fritzson Linköpings universitet SE–581 83 Linköping +46 13 28 10 00 , www.liu.se Upphovsrätt Detta dokument hålls tillgängligt på Internet - eller dess framtida ersättare - under 25 år från publicer- ingsdatum under förutsättning att inga extraordinära omständigheter uppstår. Tillgång till dokumentet innebär tillstånd för var och en att läsa, ladda ner, skriva ut enstaka ko- pior för enskilt bruk och att använda det oförändrat för ickekommersiell forskning och för undervis- ning. Överföring av upphovsrätten vid en senare tidpunkt kan inte upphäva detta tillstånd. All annan användning av dokumentet kräver upphovsmannens medgivande. För att garantera äktheten, säker- heten och tillgängligheten finns lösningar av teknisk och administrativ art. Upphovsmannens ideella rätt innefattar rätt att bli nämnd som upphovsman i den omfattning som god sed kräver vid användning av dokumentet på ovan beskrivna sätt samt skydd mot att dokumentet ändras eller presenteras i sådan form eller i sådant sammanhang som är kränkande för upphovsman- nens litterära eller konstnärliga anseende eller egenart. För ytterligare information om Linköping University Electronic Press se förlagets hemsida http://www.ep.liu.se/. Copyright The publishers will keep this document online on the Internet - or its possible replacement - for a period of 25 years starting from the date of publication barring exceptional circumstances. The online availability of the document implies permanent permission for anyone to read, to down- load, or to print out single copies for his/hers own use and to use it unchanged for non-commercial research and educational purpose.
  • Insights Into Webassembly: Compilation Performance and Shared Code Caching in Node.Js

    Insights Into Webassembly: Compilation Performance and Shared Code Caching in Node.Js

    Insights into WebAssembly: Compilation Performance and Shared Code Caching in Node.js Tobias Nießen Michael Dawson Faculty of Computer Science IBM Runtime Technologies University of New Brunswick IBM Canada [email protected] [email protected] Panos Patros Kenneth B. Kent Software Engineering Faculty of Computer Science University of Waikato University of New Brunswick [email protected] [email protected] ABSTRACT high-level languages, the WebAssembly instruction set is closely re- Alongside JavaScript, V8 and Node.js have become essential com- lated to actual instruction sets of modern processors, since the initial ponents of contemporary web and cloud applications. With the WebAssembly specification does not contain high-level concepts addition of WebAssembly to the web, developers finally have a fast such as objects or garbage collection [8]. Because of the similarity of platform for performance-critical code. However, this addition also the WebAssembly instruction set to physical processor instruction introduces new challenges to client and server applications. New sets, many existing “low-level” languages can already be compiled application architectures, such as serverless computing, require to WebAssembly, including C, C++, and Rust. instantaneous performance without long startup times. In this pa- WebAssembly also features an interesting combination of secu- per, we investigate the performance of WebAssembly compilation rity properties. By design, WebAssembly can only interact with its in V8 and Node.js, and present the design and implementation of host environment through an application-specific interface. There a multi-process shared code cache for Node.js applications. We is no built-in concept of system calls, but they can be implemented demonstrate how such a cache can significantly increase applica- through explicitly imported functions.