På marknaden finns ett flertal JavaScript-ramverk, exempelvis: YUI, The Dojo Toolkit, Kendo UI och. Ext JS. Syftet med studien är att undersöka vilka av dessa JavaScript-ramverk som är lämpliga att använda vid utveckling av stora dynamiska webbapplikationer. Sedermera skall studien leda till ett förslag på JavaScript-ramverk för ändamålet. Ramverken har analyserats och jämförts med avseende på följande aspekter och kriterier: skalbarhet, prestanda, AJAX, RPC-hantering, licensering, webbläsarkompatibilitet, gränssnittskomponenter, anrop mellan domäner, DOM-hantering och användarvänlighet. För att jämföra och analysera ramverken har en testapplikation utvecklats med varje JavaScript-ramverk. Testapplikationen förses med information från en serverapplikation som utvecklats med PHP, där en SQLite-databas används som informationskälla. Förfarandet innebär att serverapplikationen inte används för att generera användargränssnittet, vilket därmed övergår till att vara JavaScript-ramverkets primära uppgift. Resultatet uppvisar att JavaScript-ramverket The Dojo Toolkit är karakteristiskt det mest lämpliga ramverket att använda i samband med utveckling av stora dynamiska webbapplikationer. Ramverket tillfredsställer samtliga kriterier och aspekter på ett eminent sätt. Sedermera föreslås Ext JS som det sekundära valet av JavaScript-ramverk för ändamålet. / On today’s market there are many attractive JavaScript-frameworks such as YUI, Dojo Toolkit, Kendo UI and Ext JS. The purpose with this study is to find JavaScript frameworks that are suitable in situation when developing large dynamic web applications. The study shall result in a proposal of one or more JavaScript frameworks to use in the situation previously described. The frameworks have been analyzed and compared with respect to the following aspects and criteria: scalability, AJAX, RPC-handling, cross-browser compatibility, GUI-components, cross-domain calls, DOM-handling, user-friendliness, performance, and licensing. To conduct this study a test application has been developed, that are developed with each framework. This application is feed with information from a database on a web server with PHP as the scripting environment. The application server’s primary objective is to provide information to the test application and not to generate the user interface. The result of this study indicates that Dojo Toolkit meets all requirements and has performed well overall. This framework satisfies the stated criteria and the specified aspects in an eminent way. It’s therefore proposed to be used as the main framework when developing large dynamic web applications. Ext JS is proposed as the secondary suggestion for the same purpose previously described.

In this report, a number of different Javascript-frameworks have been compared. The study is conducted at CSN (Centrala studiestödsnämnden). The study consists of two main parts, an evalua- tion through the literature study and an evaluation of the implementa- tion. The first part of the survey has Javascript-frameworks Angular2, Aurelia, Ember, Meteor and React comparisons. Together with CSN, a few criteria have been developed which will then be awarded points between one and five depending on how well a Javascript-framework meets a specific criterion. Five points are given when the Javascript- framework meets the entire criterion, one point is given when it partial- ly meets the criterion. After the first part of the investigation, Angular2 and Aurelia found that they would move on to the implementation phase. The implementation consists of a couple of windows from the existing service "Mina tjänster". In the evaluate implementation measures time for implementation, web browsing time, and number of code rows. From this it was found that Aurelia has less number of code rows than Angular 2. The reading time for Angular 2 is three times longer than Aurelia. In the evaluation of how difficult it is to implement the two frameworks, Angular 2 is considered to be "Average" and Aurelia to "Hard". The Javascript-framework recommended for CSN is Angular 2. This is because much more documentation about Angular 2 is available, and the difficulty is lower for Angular 2. The startup of a project is also much easier in Angular 2, which means that it requires less time to get into the framework. / Sammanfattning: I denna rapport har ett par olika Javascript-ramverk jämförts. Studien är utförd på CSN (Centrala studiestödsnämnden). Undersökningen består av två huvuddelar, en utvärdering genom litteraturstudie samt en utvärdering av implementation. I första delen av undersökningen har Javascript-ramverken Angular2, Aurelia, Ember, Meteor och React jämförts. Tillsammans med CSN har ett par kriterier tagits fram som det sedan kommer att delas ut poäng mellan ett till fem beroende på hur väl ett Javascript-ramverk uppfyller ett specifikt kriterium. Fem poäng ges ut då Javascript-ramverket uppfyller hela kriteriet, ett poäng ges ut då det delvis uppfyller kriteriet. Efter första delen av undersökningen kom det fram till att Angular2 och Aurelia skulle gå vidare till implemente- ringsfasen. Implementeringen består utav ett par fönster från den befintliga tjänsten ”Mina tjänster”. I utvärderingen av implementation mäts tid för implementering, inläsningstid för webbapplikationen samt antalet kodrader. Ur detta konstaterades det att Aurelia har mindre antalet kodrader än Angular 2. Inläsning tiden för Angular 2 är tre gånger längre än Aurelia. Men i bedömningen om hur svårt det är att implementera de bägge ramverken bedöms Angular 2 till nivån ”Me- del” och Aurelia till ”Svår”. Det Javascript-ramverk som rekommende- ras till CSN är Angular 2. Detta grundas på att det finns betydligt mycket mer dokumentation om Angular 2, samt att svårighetsgraden är lägre för Angular 2. Uppstarten av ett projekt är även mycket enklare i Angular 2, vilket betyder att det kräver mindre tid för att sätta sig in ramverket.

JavaScript frameworks have become a rapidly growing and changing industry which led to the process of choosing a suitable framework becoming increasingly difficult. This is what this project address, it takes three of the most popular frameworks and compare them concerning three aspects; performance, modularity and usability to determine the most suitable one for a modern single-page application. The purpose was to be able to give a well-founded recommendation on which framework would be most suited for a given project. To determine which framework is most suitable, three of the most popular frameworks are considered: Angular, React and Vue. These are often referred to as the big three when it comes to JavaScript frameworks and hints at the fact that they are by far the most popular frameworks. By developing and deploying a modern single-page application with a focus on the front-end in each of the frameworks and performing tests in regards to the three aspects performance, modularity and usability test data could be measured and compared. The comparison was performed by evaluating the test results of the three aspects using a method called the analytical hierarchy process. The results show that the most suitable JavaScript framework for developing a frontend heavy single-page application would be React since it performed best in regards to performance and modularity. Vue comes in second with the most notable advantage being performing best when comparing usability since it was the framework considered to be the easiest one to learn. Angular comes in at a third place with the most notable advantage being that it was considered best at DOM-manipulation. All three frameworks are considered suitable to create a single-page application but from the perspective of this project, the most suitable would be React. Further research may be done into additional frameworks to give the study even more width. It would also be interesting to go more into depth in either of the aspects to get a more extensive analyze. / JavaScript-ramverk har blivit en snabbt växande och förändrande bransch som har innebärt att processen att välja lämpliga ramverk har blivit allt svårare. Detta är vad detta projekt försöker utreda, vi kommer att ta tre av de mest populära ramverken och jämföra dem angående tre aspekter, prestanda, modularitet och användarvänlighet för att bestämma det mest lämpliga för en modern single-page application. Syftet var att kunna ge en välgrundad rekommendation om vilket ramverk som skulle vara bäst lämpat för ett visst projekt. För att bestämma vilket ramverk som är bäst lämpat betraktas tre av de mest populära ramverken: Angular, React och Vue. Dessa benämns ofta de stora tre när det gäller JavaScript-ramverk och anknyter på att de överlägset är de mest populära ramverken. Genom att utveckla och sätta i produktion en modern single-page application med fokus på front-end i vart och ett av ramverken och utföra tester med avseende på de tre aspekterna prestanda, modularitet och användarvänlighet kan testdatan mätas och jämföras. Jämförelsen genomfördes genom att utvärdera testresultaten för de tre aspekterna med hjälp av metoden Analytic hierarchy process. Resultaten visar att det mest lämpliga JavaScript-ramverket för att utveckla en front-end tung single-page application skulle vara React eftersom det presterade bäst i aspekterna prestanda och modularitet. Vue kommer på andra plats med den mest anmärkningsvärda fördelen att den presterar bäst när man jämför användarvänlighet eftersom det var det ramverk som ansågs vara den enklaste att lära sig. Angular kommer in på en tredje-plats med den mest anmärkningsvärda fördelen att Angular ansågs bäst vid DOM-manipulation. Alla tre ramverk anses vara lämpliga för att skapa en single-page application men ur projektets perspektiv är React det mest lämpade ramverket. Vidare undersökning kan utföras i yttligare ramverk för att ge studien ytterligare bredd. Det skulle också kunna vara intressant att gå mer på djupet i någon av aspekterna för att få en mer omfattande analys.