DOCSLIB.ORG

Porting of C/C++ Applications on the Web

Total Page：16

File Type：pdf, Size：1020Kb

Download full-text PDF Read full-text
Porting of C/C++ Applications on the Web INDIAN INSTITUTE OF TECHNOLOGY, BOMBAY EKLAVYA SUMMER INTERNSHIP 2019 (FUNDAMENTAL RESEARCH GROUP) Porting of C/C++ Applications on the Web Under the guidance of: Prof. S. Sudarshan Team: Mentors: Ajit Kumar Mr. Nagesh Karmali Akash Soni Mr. Rajesh Kushalkar Sarthak Mishra Shikhar Suman Yasasvi V Peruvemba text Summer Internship 2019 Project Approval Certificate Department of Computer Science and Engineering Indian Institute of Technology Bombay Certificate The project entitled Porting of C or CPP Desktop Applications on the web sub- mitted by Mr. Ajit Kumar, Mr. Akash Soni, Mr. Sarthak Mishra, Mr. Shikhar Suman and Mr. Yasasvi V Peruvemba is approved for Summer Internship 2019 programme from 19th May 2019 to 9th July 2019, at Department of Computer Science and Engineering, IIT Bombay. Prof. S. SUDARSHAN Mr. NAGESH KARMALI Dept. of CSE, IITB Dept. of CSE, IITB Principle Investigator Sr. Project Manager Mr. RAJESH KUSHALKAR Dept. of CSE, IITB Sr. Project Manager Date: July 4, 2019 text Acknowledgement We have spent a lot of effort on this project. However, it would not have been pos- sible without the kind support of various individuals and organizations, we would like to extend our sincere thanks to all of them. We would like to express our sincere thanks and regards to Prof. D.B.Phatak and Prof. S. Sudarshan, Indian Institute of Technology, Bombay for providing us this unparalleled opportunity to work on this esteemed project. We would also like to extend our sincere thanks to Mr. Nagesh Karmali for supervising our project. Our sincere thanks to Mr.Rajesh Kushalkar, without whom the project would not be this refined and successful. Finally we usher our thanks to the open-source community and others who have willingly assisted us in the smallest possible manners in the development of the project. Declaration I declare that this written submission represents my ideas in my own words and where others' ideas or words have been included, I have adequately cited and ref- erenced the original sources. I also declare that I have adhered to all principles of academic honesty and integrity and have not misrepresented or fabricated or falsi- fied any idea/data/fact/source in my submission. I understand that any violation of the above will be cause for disciplinary action by the institute and can also evoke penal action from the sources which have thus not been properly cited or from whom proper permission has not been taken when needed AJIT KUMAR SHIKHAR SUMAN IIT ISM DHANBAD IIT ISM DHANBAD AKASH SONI YASASVI V PERUVEMBA NIT HAMIRPUR IIT INDORE SARTHAK MISHRA SIT TUMKUR Abstract Porting of applications to the web, refers to the transpiling of desktop applications, coded in C/C++ into it's JavaScript counterpart, which can then be hosted as a web-service. This is an FRG Project aimed towards a more secure and space effi- cient alternative for native applications. In the upcoming sections, the methodologies and techniques used are described, along with the specified results. Also, more insight about the key technologies used is given, justifying why they were necessary for the project. The basis behind the applied technology is also justified below. In this project, we have achieved success in porting four different applications viz. PNGCrush, Tetris, GNUPlot and SimAVR. text List of Figures 1.1 WebAssembly Flow . .4 2.1 Emscripten Compiler Flow . .5 2.2 Emscripten Toolchain[1] . .6 2.3 Console output for Example 2 . .8 2.4 Emscripten Development Flow . .9 3.1 PNGCrush via Terminal . 13 3.2 PNGCrush in Browser . 15 3.3 Download Option . 16 4.1 Tetris gameplay . 18 4.2 Source code . 19 4.3 HTML File . 20 4.4 Modification in constants.h . 21 4.5 Original display score() . 21 4.6 Modified display score() . 22 4.7 Tetris on web gameplay . 23 4.8 Tetris on web gameplay . 23 4.9 Tetris on web gameplay . 24 5.1 Plot of Example 1 . 29 5.2 Plot of Example 2 . 30 5.3 Plot of Example 3 . 31 5.4 Plot of Example 4 . 32 6.1 GTK Wave Trace . 34 6.2 Error 1 . 36 6.3 Error 2 . 36 6.4 LED program output . 37 6.5 LED program output . 37 ii text Contents 1 Introduction 2 1.1 Why Porting? . .2 1.2 The Need . .2 1.3 C/C++ . .3 1.3.1 C Programming Language . .3 1.3.2 C++ Programming Language . .3 1.4 asm.js . .3 1.5 WebAssembly . .4 2 Emscripten 5 2.1 Overview . .5 2.2 Examples . .7 2.2.1 Example 1 . .7 2.2.2 Example 2 . .7 2.3 Building Projects with Emscripten . .8 2.3.1 emconfigure . .8 2.3.2 emmake . .8 2.4 Insight on Generated JS Files . .9 2.5 Interacting with C/C++ functions from JavaScript through Em- scripten . 10 2.5.1 ccall . 10 2.5.2 cwrap . 11 2.6 FileSystem API . 11 3 PNGCrush 13 3.1 About . 13 3.2 Downloading Source Code . 14 3.3 Porting the application . 14 3.3.1 Generating js file . 14 3.3.2 Running js file browser . 14 3.3.3 Making the js file work . 15 3.3.4 Creating input png file . 15 3.3.5 Running PNGCrush . 16 iv CONTENTS Project: P1 4 Tetris 17 4.1 Overview . 17 4.2 Note about porting . 17 4.3 Porting of Tetris to Web . 17 4.3.1 Understanding the C/C++ source code . 17 4.3.2 Adding the Web . 18 4.3.3 Making appropriate changes to C/C++ source code . 18 4.3.4 Porting of the game on the web using Emscripten . 18 4.4 Understanding the C/C++ source code . 19 4.5 Adding the Web . 20 4.6 Making changes in C++ Files . 20 4.7 Porting of the game on the web using Emscripten. 22 4.8 Github Repository for the Port of Tetris . 24 5 GNUPlot 25 5.1 About . 25 5.2 Source Code for Generating JS Files . 26 5.3 Porting the Application . 26 5.3.1 Building the Application . 26 5.3.2 Generating the JS File . 27 5.3.3 Creating the Front-End . 27 5.4 Github Repository . 28 5.5 Examples . 28 5.6 Further Development . 32 6 SimAVR 33 6.1 Overview . 33 6.2 Need to Port SimAVR . 33 6.3 History . 33 6.4 Procedure to Port . 34 6.5 Errors Faced . 35 6.6 Examples . 36 6.7 UseCase . 37 6.8 Limitations . 38 6.9 Further Development . 38 6.10 Github Repository for the Port of SimAVR . 38 7 Appendix 39 7.1 Emsripten Installation . 39 Fundamental Research Group, IIT Bombay v text Chapter 1 Introduction This project aims at converting C/C++ desktop applications to the web. To aid us in porting applications to the web, i.e, in converting C/C++ logic into it's JavaScript counterpart, there are a few tools. In particular, we will be dealing with Emscripten, an LLVM compiler which forms the base of our project. The reason for why we used Emscripten other than it's more recent counterparts is justified in the following sections. The main aim of this project is to aid the Porting of Educational Applications. 1.1 Why Porting? In software engineering, porting is the process of adapting software for the purpose of achieving some form of execution in a computing environment that is different from the one that a given program (meant for such execution) was originally de- signed for (e.g. different CPU, operating system, or third party library). The term is also used when software/hardware is changed to make them usable in different environments. [2] For our project, we are concerned with porting application logic from C/C++ to JavaScript. 1.2 The Need A lot of Applications are built in C/C++ due to their superior high speed per- formance. In the modern world, everyone has access to the internet and it will definitely helpful if various Educational Applications were available on the Web. A straightforward way to do so would be to write the entire program logic in JavaScript from scratch. This being a very tedious task, also won't provide performance as that of Native Applications. Hence, the need of Porting arises, which led to the development of Emscripten, an LLVM-to-JavaScript compiler, to aid in Porting. 2 CHAPTER 1. INTRODUCTION Project: P1 1.3 C/C++ These are the languages in which the Desktop Applications that we port are written and developed in. They are also widely regarded among the most popular languages for every Computer Science enthusiast. For the purpose of our project, it is important to note that any of the applica- tion that we port could be written in either C or C++. 1.3.1 C Programming Language C is a general-purpose, procedural computer programming language supporting structured programming, lexical variable scope, and recursion, while a static type system prevents unintended operations. By design, C provides constructs that map efficiently to typical machine instructions, and has found lasting use in applica- tions previously coded in assembly language. Such applications include operating systems, as well as various application software for computers ranging from super- computers to embedded systems. [3] 1.3.2 C++ Programming Language C++ is also a general-purpose, procedural computer programming language, which was developed as an extension of the C language by Bjarne Stroustrup. It is also referred to as \C with Classes". It provides a great deal of features that include.
Load more

Recommended publications
  • Asynchronous Web Requests As Service
    Asynchronous Web Requests As Service Manual and dodecahedral Royal ratified almost half-yearly, though Maxim licensing his refutation Wainwrightredates. Wallache paralysing stared closely leadenly? and tyrannises Godfree often her Pete. stages inoffensively when psycholinguistic Many kinds of business processes have these features. Professional Services Engineer at elastic. About Attaching Policies to Callback Clients. The new mapper, as a site is asynchronous web requests service as mechanisms for? Web Service improve response? When using the synchronous execution mode, the application must wait for the request to confess and clamp the results. Sets DOMReady to luggage and assigns a ready function to settings. An error occurred and moment were unable to loathe your request. There mat be gaps or spaces in between characters. Gaps between programs and add too many more asynchronous result will all asynchronous web service is this example? Scripting on pay page enhances content navigation, but does task change their content that any way. Specify whether the asynchronous as instances in? How google webmaster central time, magento creates an interface at what can add support asynchronous communications at ultra low by travel, service requests as asynchronous web url is an order. To monitor the SOAP messages, insert the software listener between heat flow by the service. Understanding the address the trading application as asynchronous web requests service port types of performance, the operation of hazardous material is a really exist? Younger students have clarity on your free to code execution first, the asynchronous web requests as service? To do surprise you gave use an asynchronous generator that yields bytes.
    [Show full text]
  • Web Services: Usage and Challenges in Mobile Phones (Computers) W3C
    Web Services: Usage and challenges in mobile phones (computers) W3C Seminar - Monday 6 March 2006 - Paris, France Timo Skyttä Director, Web Services Nokia Technology Platforms 1 © 2005 Nokia Topics • Web Services & presentation scope defined • Web Services - business ? ¡Si, habla Web Services! • Challenges in general, and some mobile specific.... • Nokia Web Services • Application Examples 2 © 2005 Nokia The Web and Web Services Web Services connect The Web connects computer applications people to information to each other on a global scale on a global scale (GARTNER, Oct 2005) 3 © 2005 Nokia Two models of mobilising service access Presentation Browser Application Presentation and Service Logic Service Logic HTTP server Scope of this Web Services interfaces presentation Enterprise Service Oriented Application Architecture (SOA) Integration (EAI) 4 © 2005 Nokia Web Services - business ? 5 © 2005 Nokia Why Web Services The deployment of Web Services technology aims to enhance existing services and to create new and innovative services. • Web Services are being widely deployed; Service/Consumer• to facilitate interoperability across runtime different hardware independence and software ! implementations, machine architectures and application programming interfaces (APIs). • to offer near-term benefits by enabling quicker and cheaper integration of existing Interoperabilityservices. ! • to define an environment where applications can be created by combining multiple services in a single workflow (a.k.a. mashups). This will make it easy to adjust Automaticapplication functionality, code because generation services can be added (WSDL or removed + from tools) the ! application workflow. • In addition, interoperability will allow application designers to replace one service implementation with another for technical or business reasons. This vision of Service-Oriented Architectures (SOAs) is rapidly becoming a reality through the standardization and deployment of Web Services technology.
    [Show full text]
  • Emscripten: an LLVM to Javascript Compiler
    Emscripten: An LLVM to JavaScript Compiler Alon Zakai Mozilla What? Why? Compiling to JavaScript ● The web is everywhere – PCs to iPads – No plugins, no installation required – Built on standards ● The web runs JavaScript Existing Compilers to JavaScript ● Google Web Toolkit: Java (Gmail, etc.) ● CoffeeScript ● Pyjamas: Python ● SCM2JS: Scheme ● JSIL: .NET bytecode ● (and many more) ● But C and C++ are missing! Emscripten ● Enables compiling C and C++ into JavaScript ● Written in JavaScript ● Open source http://emscripten.org https://github.com/kripken/emscripten Demos! ● Bullet ● SQLite ● Python, Ruby, Lua ● Real-world code – Large, complex codebases ● Manual ports exist – Typically partial and not up to date The Big Picture C or C++ LLVM Bitcode JavaScript Low Level Virtual Machine (LLVM) ● A compiler project (cf. GCC) ● Intermediate Representation: LLVM bitcode – Very well documented – Great tools ● Much easier to compile LLVM bitcode than compile C or C++ directly! How? Code Comparison #include <stdio.h> int main() { printf(“hello, world!\n”); return 0; } Code Comparison @.str = private unnamed_addr constant [15 x i8] c"hello, world!\0A\00", align 1 define i32 @main() { entry: %retval = alloca i32, align 4 call i32 (i8*, ...)* @printf(i8* getelementptr inbounds ([15 x i8]* @.str, i32 0, i32 0)) store i32 0, i32* %retval ret i32 %retval } Code Comparison define i32 @main() { function _main() { entry: %retval = alloca i32, var _retval; align 4 call i32 (i8*, ...)* _printf (..); @printf (..) store i32 0, i32* _retval = 0; %retval ret
    [Show full text]
  • Attacking AJAX Web Applications Vulns 2.0 for Web 2.0
    Attacking AJAX Web Applications Vulns 2.0 for Web 2.0 Alex Stamos Zane Lackey [email protected] [email protected] Blackhat Japan October 5, 2006 Information Security Partners, LLC iSECPartners.com Information Security Partners, LLC www.isecpartners.com Agenda • Introduction – Who are we? – Why care about AJAX? • How does AJAX change Web Attacks? • AJAX Background and Technologies • Attacks Against AJAX – Discovery and Method Manipulation – XSS – Cross-Site Request Forgery • Security of Popular Frameworks – Microsoft ATLAS – Google GWT –Java DWR • Q&A 2 Information Security Partners, LLC www.isecpartners.com Introduction • Who are we? – Consultants for iSEC Partners – Application security consultants and researchers – Based in San Francisco • Why listen to this talk? – New technologies are making web app security much more complicated • This is obvious to anybody who reads the paper – MySpace – Yahoo – Worming of XSS – Our Goals for what you should walk away with: • Basic understanding of AJAX and different AJAX technologies • Knowledge of how AJAX changes web attacks • In-depth knowledge on XSS and XSRF in AJAX • An opinion on whether you can trust your AJAX framework to “take care of security” 3 Information Security Partners, LLC www.isecpartners.com Shameless Plug Slide • Special Thanks to: – Scott Stender, Jesse Burns, and Brad Hill of iSEC Partners – Amit Klein and Jeremiah Grossman for doing great work in this area – Rich Cannings at Google • Books by iSECer Himanshu Dwivedi – Securing Storage – Hackers’ Challenge 3 • We are
    [Show full text]
  • Webassembly a New World of Native Exploits on the Web Agenda
    WebAssembly A New World Of Native Exploits On The Web Agenda • Introduction • The WebAssembly Platform • Emscripten • Possible Exploit Scenarios • Conclusion Wasm: What is it good for? ● Archive.org web emulators ● Image/processing ● Video Games ● 3D Modeling ● Cryptography Libraries ● Desktop Application Ports Wasm: Crazy Incoming ● Browsix, jslinux ● Runtime.js (Node), Nebulet ● Cervus ● eWASM Java Applet Joke Slide ● Sandboxed ● Virtual Machine, runs its own instruction set ● Runs in your browser ● Write once, run anywhere ● In the future, will be embedded in other targets What Is WebAssembly? ● A relatively small set of low-level instructions ○ Instructions are executed by browsers ● Native code can be compiled into WebAssembly ○ Allows web developers to take their native C/C++ code to the browser ■ Or Rust, or Go, or anything else that can compile to Wasm ○ Improved Performance Over JavaScript ● Already widely supported in the latest versions of all major browsers ○ Not limited to running in browsers, Wasm could be anywhere Wasm: A Stack Machine Text Format Example Linear Memory Model Subtitle Function Pointers Wasm in the Browser ● Wasm doesn’t have access to memory, DOM, etc. ● Wasm functions can be exported to be callable from JS ● JS functions can be imported into Wasm ● Wasm’s linear memory is a JS resizable ArrayBuffer ● Memory can be shared across instances of Wasm ● Tables are accessible via JS, or can be shared to other instances of Wasm Demo: Wasm in a nutshell Emscripten ● Emscripten is an SDK that compiles C/C++ into .wasm binaries ● LLVM/Clang derivative ● Includes built-in C libraries, etc. ● Also produces JS and HTML code to allow easy integration into a site.
    [Show full text]
  • Javascript to Webassembly Cross Compiler Studienarbeit
    JavaScript to WebAssembly Cross Compiler Studienarbeit Abteilung Informatik Hochschule für Technik Rapperswil Herbstsemester 2018 Autoren: Matteo Kamm, Mike Marti Betreuer: Prof. Dr. Luc Bläser Projektpartner: Institute for Networked Solutions Inhaltsverzeichnis 1 Abstract 3 2 Einführung 4 2.1 Ausgangslage . .4 2.2 Übersicht . .5 2.2.1 Beispiel . .6 2.3 Struktur des Berichts . .7 3 Language Set 8 3.1 Grundsatz des Subsets . .8 3.2 Typen . .9 3.3 Unterstützte Sprachkonstrukte . .9 4 Cross Compilation 11 4.1 Typinferenz . 11 4.2 Template-Based Code Generation . 11 4.2.1 Unäre Operatoren . 12 4.2.2 Binäre Operationen . 12 4.2.3 Expression Statements . 13 4.2.4 Arrayzugriffe . 13 4.3 Control Flow . 15 4.3.1 Block Statement . 15 4.3.2 Branching . 15 4.3.3 While-Loop . 17 4.3.4 For-Loop . 19 4.4 Variablen-Allokation . 19 4.5 Funktionsaufrufe . 20 5 Laufzeitunterstützung 21 5.1 Prüfen der Funktionssignatur . 21 5.2 Kopieren der Array Parameter . 21 5.3 Konvertieren des zurückgegebenen Resultats . 21 5.4 Out Parameter . 21 5.5 Speicher . 22 5.5.1 Import . 22 5.5.2 Export . 22 6 Auswertung 23 6.1 Testfälle . 23 6.2 Setup . 23 6.3 Resultate . 24 6.3.1 Speedup . 24 6.3.2 Varianz . 26 6.3.3 Vergleich zu C++ . 27 6.3.4 Webpack Development Modus . 28 6.4 Fazit . 28 7 Schlussfolgerung 29 7.1 Ausblick . 29 1 Anhang 30 A Erläuterung Language Set 30 A.1 Typen . 30 A.2 Numerische Erweiterung . 30 A.3 Abweichungen der binären Operatoren zu JavaScript .
    [Show full text]
  • Hi, My Name Is Chad Ausen, Technical Director at IMVU, and Today We're Go
    Hi, my name is Chad Aus0n, technical director at IMVU, and today we’re going to talk about a library we’ve developed for connec0ng C++ and JavaScript with Emscripten. 1 2 IMVU is an online social plaorm where you can sign up, dress up an avatar, and meet people from all around the world. We offer other ac0vi0es such as games as well. 3 The content in our world is created by our customers, and to our knowledge, we have the largest catalog of 3D virtual goods on the Internet. 4 We currently offer a downloadable applicaon for Windows and Mac. Windows and Mac are great plaorms, but in recent years, other plaorms have grown to prominence. We’d like our content available everywhere: mobile plaorms, desktop, server-side renderers, and even the web browser! For almost all plaorms, it’s obvious that C++ is a great choice for the core engine. However, our big ques0on was, what about the web browser? In 2011, I benchmarked an upcoming tool called Emscripten and was quite impressed. 5 Emscripten works very well in prac0ce, so the implicaon is that C++ is the portable, high-performance language EVERYWHERE. 6 Here is our Emscripten applicaon running in Firefox. UI is HTML and CSS. Chat over WebSockets, graphics in WebGL. 7 asm.js is the subset of JavaScript that can be stacally compiled into machine code. More informaon at h`p://asmjs.org/ 8 The C heap is stored in an ArrayBuffer in JavaScript. One con0guous blob of memory. This memory is indexed by eight different typed array views that alias each other.
    [Show full text]
  • Chapter 10 Document Object Model and Dynamic HTML
    Chapter 10 Document Object Model and Dynamic HTML The term Dynamic HTML, often abbreviated as DHTML, refers to the technique of making Web pages dynamic by client-side scripting to manipulate the document content and presen- tation. Web pages can be made more lively, dynamic, or interactive by DHTML techniques. With DHTML you can prescribe actions triggered by browser events to make the page more lively and responsive. Such actions may alter the content and appearance of any parts of the page. The changes are fast and e±cient because they are made by the browser without having to network with any servers. Typically the client-side scripting is written in Javascript which is being standardized. Chapter 9 already introduced Javascript and basic techniques for making Web pages dynamic. Contrary to what the name may suggest, DHTML is not a markup language or a software tool. It is a technique to make dynamic Web pages via client-side programming. In the past, DHTML relies on browser/vendor speci¯c features to work. Making such pages work for all browsers requires much e®ort, testing, and unnecessarily long programs. Standardization e®orts at W3C and elsewhere are making it possible to write standard- based DHTML that work for all compliant browsers. Standard-based DHTML involves three aspects: 447 448 CHAPTER 10. DOCUMENT OBJECT MODEL AND DYNAMIC HTML Figure 10.1: DOM Compliant Browser Browser Javascript DOM API XHTML Document 1. Javascript|for cross-browser scripting (Chapter 9) 2. Cascading Style Sheets (CSS)|for style and presentation control (Chapter 6) 3. Document Object Model (DOM)|for a uniform programming interface to access and manipulate the Web page as a document When these three aspects are combined, you get the ability to program changes in Web pages in reaction to user or browser generated events, and therefore to make HTML pages more dynamic.
    [Show full text]
  • The Development of Algorithms for On-Demand Map Editing for Internet and Mobile Users with Gml and Svg
    THE DEVELOPMENT OF ALGORITHMS FOR ON-DEMAND MAP EDITING FOR INTERNET AND MOBILE USERS WITH GML AND SVG Miss. Ida K.L CHEUNG a, , Mr. Geoffrey Y.K. SHEA b a Department of Land Surveying & Geo-Informatics, The Hong Kong Polytechnic University, Hung Hom, Kowloon, Hong Kong, email: [email protected] b Department of Land Surveying & Geo-Informatics, The Hong Kong Polytechnic University, Hung Hom, Kowloon, Hong Kong, email: [email protected] Commission VI, PS WG IV/2 KEY WORDS: Spatial Information Sciences, GIS, Research, Internet, Interoperability ABSTRACT: The widespread availability of the World Wide Web has led to a rapid increase in the amount of data accessing, sharing and disseminating that gives the opportunities for delivering maps over the Internet as well as small mobile devices. In GIS industry, many vendors or companies have produced their own web map products which have their own version, data model and proprietary data formats without standardization. Such problem has long been an issue. Therefore, Geographic Markup Language (GML) was designed to provide solutions. GML is an XML grammar written in XML Schema for the modelling, transport, and storage of geographic information including both spatial and non-spatial properties of geographic features. GML is developed by Open GIS Consortium in order to promote spatial data interoperability and open standard. Since GML is still a newly developed standard, this promising research field provides a standardized method to integrate web-based mapping information in terms of data modelling, spatial data representation mechanism and graphic presentation. As GML is not for data display, SVG is an ideal vector graphic for displaying geographic data.
    [Show full text]
  • Static Typescript
    1 Static TypeScript 56 2 57 3 An Implementation of a Static Compiler for the TypeScript Language 58 4 59 5 60 6 Thomas Ball Peli de Halleux Michał Moskal 61 7 Microsoft Research Microsoft Research Microsoft Research 62 8 Redmond, WA, United States Redmond, WA, United States Redmond, WA, United States 63 9 [email protected] [email protected] [email protected] 64 10 Abstract 65 11 66 12 While the programming of microcontroller-based embed- 67 13 dable devices typically is the realm of the C language, such 68 14 devices are now finding their way into the classroom forCS 69 15 education, even at the level of middle school. As a result, the 70 16 use of scripting languages (such as JavaScript and Python) 71 17 for microcontrollers is on the rise. 72 18 We present Static TypeScript (STS), a subset of TypeScript (a) (b) 73 19 (itself, a gradually typed superset of JavaScript), and its com- 74 20 piler/linker toolchain, which is implemented fully in Type- Figure 1. Two Cortex-M0 microcontroller-based educational 75 21 Script and runs in the web browser. STS is designed to be use- devices: (a) the BBC micro:bit has a Nordic nRF51822 MCU 76 22 ful in practice (especially in education), while being amenable with 16 kB RAM and 256 kB flash; (b) Adafruit’s Circuit Play- 77 23 to static compilation targeting small devices. A user’s STS ground Express (https://adafruit.com/products/3333) has an 78 24 program is compiled to machine code in the browser and Atmel SAMD21 MCU with 32 kB RAM and 256 kB flash.
    [Show full text]
  • BROWSIX: Bridging the Gap Between Unix and the Browser Bobby Powers, John Vilk, Emery D
    BROWSIX: Bridging the Gap Between Unix and the Browser Bobby Powers, John Vilk, Emery D. Berger University of Massachusetts Amherst Abstract As a representative example, websites like ShareLaTeX1 2 A Applications written to run on conventional operating sys- and Overleaf let users write and edit LTEX documents in the tems typically depend on OS abstractions like processes, pipes, browser without the need to install a TEX distribution locally. signals, sockets, and a shared file system. Porting these ap- This workflow lowers the barrier for students and first-time A plications to the web currently requires extensive rewriting LTEX authors and enables real-time collaboration, eliminating or hosting significant portions of code server-side because some of the complexity of creating multi-author documents. browsers present a nontraditional runtime environment that These applications achieve this functionality by providing a lacks OS functionality. browser-based frontend for editing; user input is sent to the server for persistence and collaboration purposes. When the This paper presents BROWSIX, a framework that bridges pdflatex the considerable gap between conventional operating systems user requests a generated PDF, the website runs bibtex and the browser, enabling unmodified programs expecting a and server-side on the user’s behalf, with the resulting PDF sent to the browser when complete. Unix-like environment to run directly in the browser. BROWSIX comprises two core parts: (1) a JavaScript-only system that These web applications generate PDFs server-side out of makes core Unix features (including pipes, concurrent pro- necessity because browsers lack the operating system services cesses, signals, sockets, and a shared file system) available to and execution environment that Unix programs expect.
    [Show full text]
  • Porting C/C++ Applications to the Web PROJECT P1 Fundamental Research Group
    Porting C/C++ applications to the web PROJECT P1 Fundamental Research Group Mentors Nagesh Karmali Rajesh Kushalkar Interns Ajit Kumar Akash Soni Sarthak Mishra Shikhar Suman Yasasvi V Peruvemba List of Contents Project Description Simavr Understanding the Problem Overall Problems Emscripten References Vim.wasm Tetris PNGCrush.js Project Description Lots of educational tools like electronic simulators, emulators, IDEs, etc. are written mostly as a native C/C++ applications. This project is focussed on making these applications run on the web as a service in the cloud. It is focused on porting these desktop applications into their JavaScript counterparts. Understanding the problem 1. Converting the underlying logic written in C/C++ into it’s analogous Javascript file 2. Making sure minimum performance loss occurs during porting. Emscripten 1. Emscripten is an Open Source LLVM to JavaScript compiler. 2. Compile any other code that can be translated into LLVM bitcode into JavaScript. https://emscripten.org/docs/introducing_emscrip ten/about_emscripten.html Installing Emscripten # Get the emsdk repo git clone https://github.com/emscripten-core/emsdk.git # Enter that directory cd emsdk # Fetch the latest version of the emsdk (not needed the first time you clone) git pull # Download and install the latest SDK tools. ./emsdk install latest # Make the "latest" SDK "active" for the current user. (writes ~/.emscripten file) ./emsdk activate latest # Activate PATH and other environment variables in the current terminal source ./emsdk_env.sh Porting of Vim Github Repository https://github.com/rhysd/vim.wasm Source files of Vim that are slightly modified can be found here - https://github.com/rhysd/vim.wasm/compare/a9604e61451707b38fdcb088fbfaeea 2b922fef6...f375d042138c824e3e149e0994b791248f2ecf41#files The Vim Editor is completely written in C.
    [Show full text]