DOCSLIB.ORG

Evaluation of the Blazor Framework

Total Page：16

File Type：pdf, Size：1020Kb

Download full-text PDF Read full-text
Evaluation of the Blazor Framework Evaluation of the Blazor framework A comparison between Blazor and React Main Subject area: Computer Engineering Author: Emil Persson, Oliver Köping Supervisor: Denis Golubovic JÖNKÖPING 2021 07 01 This final thesis has been carried out at the School of Engineering at Jönköping University within Computer Engineering. The authors are responsible for the presented opinions, conclusions and results. Examiner: Florian Westphal Supervisor: Denis Golubovic Scope: 15 hp (first-cycle education) Date: 2021-07-01 i Abstract Blazor WebAssembly is a new framework that was released in May 2020 that makes it possible to build client-side web applications using C# instead of using JavaScript for its frontend. The most popular web frameworks today are JavaScript based frameworks. This study aims to find out if Blazor is a viable option to use for developing web applications and if it is a well-established framework compared to JavaScript frameworks. To evaluate Blazor, a comparison is performed between Blazor and React on six criteria. The criteria are lines of code, cyclomatic complexity, state management, debugging tools, community, and libraries. To answer the criteria two applications was developed, one in the React framework and one in the Blazor framework. Besides the two applications, literature was gathered to answer the criteria. The results from the comparison showed Blazor was a Viable option to use for the development of web applications and that it has become established as a framework when taken its age in to consideration. Keywords: React, Blazor, WebAssembly, JavaScript, C#, web framework, development. ii Table of content Abstract .......................................................................................... ii Table of content ............................................................................ iii 1 Introduction ............................................................................. 1 1.1 COMPANY BACKGROUND ................................................................................. 1 1.2 PROBLEM STATEMENT ...................................................................................... 1 1.3 PURPOSE AND RESEARCH QUESTIONS ............................................................... 2 1.4 SCOPE AND LIMITATIONS .................................................................................. 2 1.5 DISPOSITION ..................................................................................................... 2 2 Background .............................................................................. 2 2.1 C# .................................................................................................................... 2 2.2 WEB FRAMEWORK ............................................................................................ 3 2.3 BLAZOR ............................................................................................................ 3 2.4 WEBASSEMBLY ................................................................................................ 3 2.5 LIBRARY .......................................................................................................... 4 2.6 JAVASCRIPT ..................................................................................................... 4 2.7 REACT .............................................................................................................. 4 2.8 REDUX ............................................................................................................. 4 3 Method and implementation .................................................. 5 3.1 CRITERIA FOR COMPARISON ............................................................................. 5 3.2 EVALUATION CRITERIA .................................................................................... 6 3.2.1 Applications ............................................................................................. 6 3.2.2 Lines of code ............................................................................................ 7 3.2.3 Cyclomatic complexity ............................................................................ 7 3.2.4 State management .................................................................................... 8 iii 3.2.5 Libraries ................................................................................................... 9 3.2.6 Community ............................................................................................ 10 3.2.7 Debugging tools ..................................................................................... 11 3.3 VALIDITY AND RELIABILITY ........................................................................... 11 4 Results ..................................................................................... 12 4.1 LINES OF CODE ............................................................................................... 12 4.2 CYCLOMATIC COMPLEXITY ............................................................................ 13 4.3 STATE MANAGEMENT ..................................................................................... 13 4.4 LIBRARIES ...................................................................................................... 13 4.5 COMMUNITY .................................................................................................. 14 4.5.1 Stack Overflow questions ...................................................................... 14 4.5.2 Github repositories ................................................................................. 15 4.5.3 Github contributors ................................................................................ 16 4.5.4 Github repository stars ........................................................................... 17 4.6 DEBUGGING TOOLS ........................................................................................ 18 5 Discussion ............................................................................... 20 5.1 RESULT DISCUSSION ....................................................................................... 20 5.1.1 Lines of code .......................................................................................... 20 5.1.2 Cyclomatic complexity .......................................................................... 20 5.1.3 State management .................................................................................. 21 5.1.4 Libraries ................................................................................................. 21 5.1.5 Community ............................................................................................ 21 5.1.6 Debugging tools ..................................................................................... 22 5.2 METHOD DISCUSSION ..................................................................................... 22 6 Conclusions and future research .......................................... 24 6.1 CONCLUSIONS ................................................................................................ 24 6.2 FUTURE RESEARCH ......................................................................................... 25 iv 7 References .............................................................................. 26 8 Appendixes ............................................................................. 30 8.1 APPENDIX A ................................................................................................... 30 8.2 APPENDIX B ................................................................................................... 35 v 1 Introduction 1.1 Company background Saab Training and Simulation is a subsidiary of Saab AB that produces military and security training systems for a variety of military forces. The branch that this thesis is conducted on is the branch that works with developing applications that supports the training of military personnel. Saab has interest in exploring if Blazor is a viable option to use for front-end web development. The language that is used at Saab for development is mainly C# and therefore Saab wants to explore the Blazor framework which is based on C#. 1.2 Problem statement In May 2020 Blazor web assembly was released by Microsoft which makes it possible to build client web applications using C#. Blazor web assembly allows applications to be built using C# instead of previous applications that relied on JavaScript for its front- end. C# is to date the 4th most popular programming language and has approximately 31% of all developers using it to some extent. C# has the 3rd largest community on Stack Overflow (Mkhitaryan, 2021). This shows that Blazor is worth researching in, since it could have a big impact on many developers. At the time of writing there is not much research conducted on Blazor and this leaves a gap to find out what advantages and disadvantages Blazor have compared to other well- established frameworks, e.g., Angular, React and Vue. Previous research that has been conducted has focused mainly on measuring the performance of Blazor, for example application loading times, performance in calculations and operations. (Kozak, 2020; Suryś, 2019). In a recent study Blazor was compared with Angular on nine different criteria to find out how Blazor stands up to its competitors (Sandberg, 2021). This study shows that Blazor is a new framework that needs to be researched about and compared against other frameworks. It is relevant that more research is performed
Load more

Recommended publications
  • Python Projects for Resume Reddit
    Python Projects For Resume Reddit Chet rape his klutz settles wrong or extraneously after Neron prune and covings proprietorially, undisturbing and Caldwellallegiant. neverSniffiest dibble Torrin any levigating parroquets! some Caen after ringent Marmaduke insists snappishly. Anabatic or suchlike, This location that on how to make the reddit python project on a java or command Then I decided to personalize my cover paid and resume summary then route to send. CodeSignal Coding Tests and Assessments for Technical. Can perform give baby some good examples of mediumhigh level projects that. Self-taught Python and CC What of some projects I can. Advanced Programming Projects Reddit. Get instant coding help build projects faster and read programming tutorials from. I managed to surface a script that asks for order number checks of the remainder is. Search for code editors and you to properly. ShadowmooseRedditDownloader Scrapes Reddit to GitHub. Best Machine Learning GitHub Repostories & Reddit. Python vs powershell reddit ERAZ 2020. Entry level programming jobs reddit Bacta. Scrape a Subreddit Reddit is rate of cotton most popular social media platforms out there phone has communities called subreddits for nearly every topic he can. Feb 27 2020 Free Resume Builder Reddit 32 Inspirational Free. One Click Essays Best paper community service reddit best team. A bot that connects to an API like the ones provided by YouTube Reddit or Discord. The against for me to them able today put a personal or side free on other resume. Interning at and cross your bots you for resume. Niraj Sheth Senior Software Engineer Crypto Reddit Inc. Projects that feature're proud of languages that you've worked in you don't need to.
    [Show full text]
  • Ajax Form Asp Net Core
    Ajax Form Asp Net Core Indecent Cammy lugging that afterthoughts rewrote contractedly and replevy irascibly. Is Marty trickier or demagogic when henpecks some aftershock assails everyplace? Idlest or indifferent, Randal never commixes any subductions! That script tag and ajax form asp core and handle it so append the form submit a coffee here you can build on Following ajax form data to take input fields. The form returns are using jquery in asp core, trademarks of forms and whatnot in asp core. Save me from asp core razor ajax form element corelated with asp iisserver returns. Now save the database table using this to. Net core asp core mvc what is! NET without additional programming effort. Gets or register to. Ajax helper ajax to. Route is ajax form was already subscribed. Download sample applications like jquery? In news post they saw how drug use ASP. Index action that i am happy that cover common question was very important? Net core asp tutorial showing redundant validation to form for forms using ajax query to add validation using a guide. The ajax forms, we want it? When a user creates a new goat an ID is generated automatically. Net core asp iisserver returns and form requests? Introduction to Razor Pages in ASP. Stop relying on asp core. Gets or views in ajax forms with an attacker entered by adding blocks of asp core web application more have any error. From ajax form element with asp core web application we receive no comments about this property such as part of steps to get updated to register a sample asp.
    [Show full text]
  • Why You Should Consider Web Assembly in Your Next Frontend Project
    Why you should consider Web Assembly in your next frontend project Håkan Silfvernagel Who Am I? • Background in software development for process automation and robotics • Worked on the .NET platform since its release 2001-2002 • Consultant since 2010 • 19 years’ experience of software development in various positions such as developer, tester, architect, project manager, scrum master, practice manager and team lead. • MIT Artificial Intelligence: Implications for business strategy • MIT Internet of Things: Business implications and opportunities What is Web Assembly? Web Assembly • Group formed in 2015 (all major browsers) • 2017, Nov, Web Assembly Released • 2018, Feb, W3C public draft published Source: https://webassembly.org/ Web platform as virtual machine Virtual Machine • JavaScript • High level language • Flexible and expressive • Dynamically typed JS WASM • No compilation • Huge ecosystem • WebAssembly (WASM) • Low level assembly like language • Compact binary format • Near native performance • C, C++, Rust, Go… Wasm • A new browser standard • Based on asm.js • Intermediate language • Java (bytecode), C# (msil) • Strongly typed • i32, i64, f32, f64 Hello WASM WASM example (1) add.wat (module (func $addTwo (param i32 i32) (result i32) get_local 0 get_local 1 i32.add) (export "addTwo" (func $addTwo))) 0000000: 0061 736d ; WASM_BINARY_MAGIC 0000004: 0100 0000 ; WASM_BINARY_VERSION ; section "Type" (1) 0000008: 01 ; section code 0000009: 00 ; section size (guess) 000000a: 01 ; num types WASM example (2) ; type 0 000000b: 60 ; func
    [Show full text]
  • Building Single Page Applications in .NET Core 3
    Building Single Page Applications in .NET Core 3 Jumpstart Coding Using Blazor and C# — Michele Aponte Building Single Page Applications in .NET Core 3 Jumpstart Coding Using Blazor and C# Michele Aponte Building Single Page Applications in .NET Core 3: Jumpstart Coding Using Blazor and C# Michele Aponte Torre del Greco (NA), Italy ISBN-13 (pbk): 978-1-4842-5746-3 ISBN-13 (electronic): 978-1-4842-5747-0 https://doi.org/10.1007/978-1-4842-5747-0 Copyright © 2020 by Michele Aponte This work is subject to copyright. All rights are reserved by the Publisher, whether the whole or part of the material is concerned, specifically the rights of translation, reprinting, reuse of illustrations, recitation, broadcasting, reproduction on microfilms or in any other physical way, and transmission or information storage and retrieval, electronic adaptation, computer software, or by similar or dissimilar methodology now known or hereafter developed. Trademarked names, logos, and images may appear in this book. Rather than use a trademark symbol with every occurrence of a trademarked name, logo, or image we use the names, logos, and images only in an editorial fashion and to the benefit of the trademark owner, with no intention of infringement of the trademark. The use in this publication of trade names, trademarks, service marks, and similar terms, even if they are not identified as such, is not to be taken as an expression of opinion as to whether or not they are subject to proprietary rights. While the advice and information in this book are believed to be true and accurate at the date of publication, neither the authors nor the editors nor the publisher can accept any legal responsibility for any errors or omissions that may be made.
    [Show full text]
  • Call Asp Net Page Method Using Jquery Ajax Example
    Call Asp Net Page Method Using Jquery Ajax Example Omophagic Dennie prunes propitiatorily or slotted disobediently when Urbanus is urinogenital. Is Nathanael cachinnatory or haughty after unsound Gaston fistfights so scantly? Thayne prescriptivists counter while long-drawn-out Alfonso mislaying rurally or unhumanized glidingly. Really i do anything you a form tag helper How to mean many other method asp mvc web application lets jump into the area to do you have this status of the popup control. Verify email address exists or not? The classic way must deliver web pages in ASP. Please tell us form example demonstrates only method? NET MVC and Razor. Among its features this component can expose all control client IDs as object properties under a named object. Configuration options that allows multiple pages; using asp image displays edit command pattern on given. Please provide your name to comment. NET Core, but existing examples tend to feature MVC This article looks at how to use Unobtrusive AJAX in a Razor Pages setting, where it will help to remove a lot of the boilerplate associated with making. Posting form example, jquery script object property for reading it might load order your. Layout page, one for css and another for scripts for using in content view page. For pdf files called when implementing ajax call asp net page method using jquery ajax example when planning or a client templates: does not refreshing page is. Join the page method using asp tutorial before starting the script file and have built using the following lines to. This page from database in order of your feedback and useful as specifying whether data is obvious and.
    [Show full text]
  • Coding Resources
    Introduction to Coding - Coding Resources March 4, 2019 Jason Velarde Freeport Memorial Library [email protected] Block Coding – the standard way to teach introductory programming in the US. Instead of traditional, text based programming, block based coding involves dragging “blocks” of instructions. Hour of Code http://hourofcode.org Scratch http://scratch.mit.edu Trinket http://trinket.io/ *Learn how blocks translate into code HTML/CSS - HTML is the foundation behind all web pages. It's used to add structure and form to text, images, and more. CSS is the language used to style HTML content. W3Schools http://w3schools.com (free) Code Academy https://www.codecademy.com/catalog/language/html-css (free “Intro,” pay for “Pro”) freeCodeCamp http://freecodecamp.org (free) Code Avengers https://www.codeavengers.com/ (free trial) Udemy http://udemy.com ($11.99 courses) Lynda.com http://www.lynda.com/portal/patron?org=freeportlibrary.info (free w/ library card) CoderDojo http://kata.coderdojo.com/wiki/HTML_Path (free) Coder’s Guide https://www.youtube.com/user/CodersGuide (YouTube) DevTips https://www.youtube.com/user/DevTipsForDesigners (YouTube) JavaScript - JavaScript is the programming language of the web. You can use it to add dynamic behavior, store information, and handle requests and responses on a website. Code Academy https://www.codecademy.com/catalog/language/javascript (free “Intro,” pay for “Pro”) CoderDojo http://kata.coderdojo.com/wiki/JavaScript_Path (free) freeCodeCamp http://freecodecamp.org (free) Code Avengers https://www.codeavengers.com/ (free trial) Khan Academy https://www.khanacademy.org/computing/computer-programming (free) Udemy http://udemy.com ($11.99 courses) Lynda.com http://www.lynda.com/portal/patron?org=freeportlibrary.info (free w/ library card) Coder’s Guide https://www.youtube.com/user/CodersGuide (YouTube) Python - Python is a general-purpose, versatile, and modern programming language.
    [Show full text]
  • Understanding the Factors That Impact the Popularity of Github Repositories
    Understanding the Factors that Impact the Popularity of GitHub Repositories Hudson Borges, Andre Hora, Marco Tulio Valente ASERG Group, Department of Computer Science (DCC) Federal University of Minas Gerais (UFMG), Brazil E-mail: fhsborges, hora, [email protected] Abstract—Software popularity is a valuable information to developers because they want to know whether their systems modern open source developers, who constantly want to know are attracting new users, whether the new releases are gaining if their systems are attracting new users, if new releases are acceptance, whether their systems are as popular as competitor gaining acceptance, or if they are meeting user’s expectations. In this paper, we describe a study on the popularity of software systems, etc. Unfortunately, we have few studies about the systems hosted at GitHub, which is the world’s largest collection popularity of GitHub systems. The exceptions are probably of open source software. GitHub provides an explicit way for an attempt to differentiate popular and unpopular Python users to manifest their satisfaction with a hosted repository: repositories using machine learning techniques [5] and a the stargazers button. In our study, we reveal the main factors study on the effect of project’s popularity on documentation that impact the number of stars of GitHub projects, including programming language and application domain. We also study quality [6]. By contrast, popularity is extensively studied on the impact of new features on project popularity. Finally, we other social platforms, like YouTube [7], [8] and Twitter [9], identify four main patterns of popularity growth, which are [10]. These studies are mainly conducted to guide content derived after clustering the time series representing the number generators on producing successful social media content.
    [Show full text]
  • ROSS JAMES KEELEY [email protected] | +353 86 891 4223 | Linkedin.Com/In/Rosskeeley​ | London, UK ​ OBJECTIVE
    ROSS JAMES KEELEY [email protected] | +353 86 891 4223 | linkedin.com/in/rosskeeley​ | London, UK ​ OBJECTIVE Passionate problem solver mentored by a professional developer and full-stack coding course seeking a Software Developer role to apply full-stack programming experience and build dynamic web applications SKILLS Tech/Tools: JavaScript/ES6, jQuery, React, Redux, Ajax, D3, Node, Helmet, Express, Heroku, HTML, CSS, ​ Bootstrap, Sass, SQL, NoSQL, MongoDB, Mongoose, RegEx, REST API, Git, Linux, Figma Practices: Object Oriented Programming (OOP), Functional Programming, Agile Scrum/Kanban Methodology ​ Projects: rosskeeley.com | github.com/rosskeeley | freecodecamp.org/rosskeeley ​ ​ ​ ​ ​ EXPERIENCE FreeCodeCamp - Student and Freelance Developer June 2020 - Present ● Created responsive web pages using JS, HTML, CSS, Flexbox/Grid, Bootstrap, visual design & accessibility to build projects: Tribute Page, Survey Form, Product Landing Page, Technical Doc., & Personal Portfolio ● Practiced OOP, basic algorithms, and modifying data structures using Javascript to build projects: Palindrome Checker, Roman Numeral Converter, Caesars Cipher, Phone Number Validator, Cash Register ● Learned Git SCM, linux commands, and agile methodology to manage projects ● Used front end libraries: Bootstrap, JQuery, and React to build projects like Random Quote Machine, Markdown Previewer, Drum Machine, Chat Room, and JavaScript Calculator ● Understanding of general information security and quality assurance ● Built a Timestamp microservice and Request Header
    [Show full text]
  • Webappos: Creating the Illusion of a Single Computer for Web Application Developers
    webAppOS: Creating the Illusion of a Single Computer for Web Application Developers Sergejs Kozloviˇcs Institute of Mathematics and Computer Science, University of Latvia (Riga, Latvia) Raina blvd. 29, LV-1459, Riga, Latvia [email protected] Abstract. Unlike traditional single-PC applications, which have access to directly attached computational resources (CPUs, memory, and I/O devices), web applications have to deal with the resources scattered across the network. Besides, web applications are intended to be accessed by multiple users simultaneously. That not only requires a more sophis- ticated infrastructure but also brings new challenges to web application developers. The webAppOS platform is an operating system analog for web appli- cations. It factors out the network and provides the illusion of a single computer, the \web computer." That illusion allows web application de- velopers to focus on business logic and create web applications faster. Besides, webAppOS standardizes many aspects of web applications and has the potential to become a universal environment for them. Keywords: Web Computer · Web Applications · Web Application Op- erating System · webAppOS · Web Application Platform 1 Introduction Babbage and Turing assumed that the computer is as a single device executing one program at a time and operated by a single user. Such a way of thinking is close to the psychology of the human brain since the brain is not able to focus on multiple tasks at the same time. Today, however, multitasking, networking, and multiple concurrent users are common as air. Luckily, modern operating systems implement multitasking, multiuser management, and local resource and device management. This aids in creating single-PC desktop applications, but does not help with web-based applications since the developers still have to think about application-level protocols as well as how to manage resources (CPUs, memory, and I/O devices) scattered across the network.
    [Show full text]
  • Open-Source Legal Process Designer in .NET Blazor Student: Martin Drozdík Supervisor: Ing
    ASSIGNMENT OF BACHELOR’S THESIS Title: Open-Source Legal Process Designer in .NET Blazor Student: Martin Drozdík Supervisor: Ing. Marek Skotnica Study Programme: Informatics Study Branch: Web and Software Engineering Department: Department of Software Engineering Validity: Until the end of summer semester 2020/21 Instructions An open-source smart contract designer is an ongoing research project at the CCMi research group. The main goal of this project is to provide a visual language to design legal contracts between parties which can be used to generate executable blockchain smart contracts. Blazor is a technology that allows running .NET code directly in the browser using a WebAssembly standard. A goal of this thesis is to investigate the possibilities of the Blazor technology to design an open-source smart contract designer and create a proof of concept prototype. Steps to take: - Review the Blazor framework. - Review an existing open-source designer for the Das Contract project. - Design and create a proof-of-concept application in Blazor. - Summarize the benefits and potential of the Blazor compared to other approaches. References Will be provided by the supervisor. Ing. Michal Valenta, Ph.D. doc. RNDr. Ing. Marcel Jiřina, Ph.D. Head of Department Dean Prague December 20, 2019 Bachelor’s thesis Open-Source Legal Process Designer in .NET Blazor Martin Drozd´ık Faculty of Information Technology Supervisor: Ing. Marek Skotnica May 6, 2020 Acknowledgements Thank you to my supervisor, Ing. Marek Skotnica, for providing guidance and feedback throughout this thesis. Declaration I hereby declare that the presented thesis is my own work and that I have cited all sources of information in accordance with the Guideline for adhering to ethical principles when elaborating an academic final thesis.
    [Show full text]
  • Choosing React Native for Your Mobile Tech Stack
    CHOOSING REACT NATIVE FOR YOUR MOBILE TECH STACK The all-in-one guide for CEOs and Product Owners When Facebook developers first introduced ReactJS to the world at the 2013 ​ ​ JSConf event, they could hardly predict how this announcement would impact web app development. Two years later, inspired by the library’s impressive growth, the company made another in-house project, React Native, available to the public by ​ ​ releasing it on GitHub. 26th March, the day when React Native joined the ​ ​ open-source domain, set a milestone for the development of mobile applications. 1 Today, with nearly 1,800 contributors and more than 15K commits in 89 branches, React Native (RN) is one of the most popular GitHub repositories. What exactly is React Native? Who can benefit from it? How to develop your first mobile app with RN? These are just some of the questions we will answer in this all-in-one guide to ​ the React Native framework. ​ Why did we create Who should read our this page? guide? Are you considering React Native Blog posts, YouTube tutorials, for your next project? Would you development forums, workshops, code like to learn RN? repositories… If you’re a startup, product owner, There are so many resources to go C-level professional or a marketer, through when you are looking for a this guide will help you get the comprehensive and reliable hang of React Native without information about React Native. reaching the bottom of Google. Who has the time to browse them all? It also aids developers who want to learn to code in React Native.
    [Show full text]
  • Astrolabs Academy Coding Bootcamp Introduction Your Instructors
    navigating entrepreneurship in the arab world AstroLabs Academy Coding Bootcamp Introduction Your Instructors - Proprietary and Confidential - 2 To Get Maximum Benefit Ø Ask lots of questions! Ø Work closely with your group and team Ø Submit your assignments on time Ø View the course material and on: http://academy.astrolabs.com (you’ll be added after today’s workshop) Ø Join our Slack group to keep up to date even after the program, connect to the community and learn about career opportunities: http://astrolabsacademy.slack.com Ø Build your portfolio and keep in touch for career opportunities Ø Tweet / Instagram us @AstroLabsME Agenda Ø Saturdays are workshop days 10am-4pm Ø Mondays are review and mentoring 6:30-9pm Ø Wednesday is for coding 6:30-9pm Week Content 1 Intro to Coding, HTML, and CSS 2 Prototyping 3 JavaScript Programming 4 Backend Node JS, Express and Mongo DB 5 Backend Node JS, Express and Mongo DB 6 Frontend React JS 7 Frontend React JS 8 Final Project - Proprietary and Confidential - 4 Deliverables You must finish them to get your final diploma (some are individual some are group work) Week Item 1 1) Build a simple eCommerce site 2) Your own Portfolio site hosted online 2 1) A landing page for your project (all hosted online) 2) Mock design prototype for app (a homepage and one other page) 3 Finish 3 algorithm challenges in JavaScript 4 Create your own backend API 5 Create a secure API to register and login users with hashed passwords and hosted online on a remote server 6 Create your own React application 7 Connect your React application to the backend you created (logging in and registering users) 8 Final Project – Convert your landing page to an fullstack application, with login functionality and at least one separate function - Proprietary and Confidential - 5 What you need Your Laptop Ø Windows: Basic windows machine will do.
    [Show full text]