JavaScript-sovelluskehyksillä toteutettujen asiakassovellusten ylläpidettävyyden vertailu

JavaScript-sovelluskehysten käyttö helpottaa asiakaspuolen sovelluskehitystä ja parantaa sovelluksen ylläpidettävyyttä. Oikean työkalun valitseminen on ohjelmoijalle kuitenkin haastava tehtävä teknologioiden nopean kehittymisen vuoksi. Suunnittelutieteellisen tutkimuksen avulla selvitettiin suosittu...

Full description

Bibliographic Details
Main Author: Tarvainen, Seppo
Other Authors: Informaatioteknologian tiedekunta, Faculty of Information Technology, Informaatioteknologia, Information Technology, Jyväskylän yliopisto, University of Jyväskylä
Format: Master's thesis
Language:fin
Published: 2018
Subjects:
Online Access: https://jyx.jyu.fi/handle/123456789/58128
_version_ 1828193089941929984
author Tarvainen, Seppo
author2 Informaatioteknologian tiedekunta Faculty of Information Technology Informaatioteknologia Information Technology Jyväskylän yliopisto University of Jyväskylä
author_facet Tarvainen, Seppo Informaatioteknologian tiedekunta Faculty of Information Technology Informaatioteknologia Information Technology Jyväskylän yliopisto University of Jyväskylä Tarvainen, Seppo Informaatioteknologian tiedekunta Faculty of Information Technology Informaatioteknologia Information Technology Jyväskylän yliopisto University of Jyväskylä
author_sort Tarvainen, Seppo
datasource_str_mv jyx
description JavaScript-sovelluskehysten käyttö helpottaa asiakaspuolen sovelluskehitystä ja parantaa sovelluksen ylläpidettävyyttä. Oikean työkalun valitseminen on ohjelmoijalle kuitenkin haastava tehtävä teknologioiden nopean kehittymisen vuoksi. Suunnittelutieteellisen tutkimuksen avulla selvitettiin suosittujen sovelluskehysten (AngularJS, Angular 5 ja React) eri ominaisuuksien, kuten staattisen tyypityksen, riippuvuusinjektion ja tarkkailijamallin käytön sekä komponentteihin osituksen vaikutusta kahteen ylläpidettävyyden attribuuttiin: stabiilisuuteen ja muokattavuuteen. Tutkielmassa toteutettiin valituilla sovelluskehyksillä työajanseurantasovellukset, joita kehitettiin edelleen kuudessa versiopäivityksessä. Tämän jälkeen SonarCloud-palvelussa selvitettiin sovellusten rivimäärä sekä syklomaattinen ja kognitiivinen kompleksisuus. Mittaustulosten kautta tutkittiin valittujen ominaisuuksien vaikutusta ylläpidettävyyden attribuutteihin muutosvaikutusanalyysin avulla. React-sovelluksissa käytetty tapa osittaa ohjelma komponentteihin kasvatti merkittävästi sovellusten rivimäärää, mutta ei niiden kompleksisuusarvoja. Tulokset osoittivat myös, että tarkkailijamallin käyttö vaikutti heikentävän ylläpidettävyyttä, kun taas staattisella tyypityksellä tai riippuvuusinjektion käytöllä ei havaittu olevan siihen merkittävää vaikutusta. The use of JavaScript frameworks makes the clientside web application development process easier and improves software maintainability. However, choosing the right framework for the task at hand is challenging for the programmer due to the rapid evolvement of technology. This design science research process compares different features, such as static typing, dependency injection, observer pattern, and component partition used in some of the most popular JavaScript frameworks (AngularJS, Angular 5, and React) and how they affect different maintainability attributes, particularly on modifiability and stability. In this study, simple time tracking software systems were created with each chosen JavaScript frameworks. These software systems were further developed in six additional updates. All software versions were analyzed in SonarCloud-service by using the following software metrics: source lines of code, cyclomatic complexity and cognitive complexity. Commit-impact analysis was used for measuring how the chosen feature correlates with the maintainability attributes during the development process. Study shows that the way how component partition is implemented in React increases application size but not its complexity. Results also indicate that the use of observer pattern might decrease maintainability whereas dependency injection or the use of static typing did not have a significant impact on the maintainability attributes measured in this study.
first_indexed 2024-09-11T08:52:41Z
format Pro gradu
free_online_boolean 1
fullrecord [{"key": "dc.contributor.advisor", "value": "Lappalainen, Vesa", "language": "", "element": "contributor", "qualifier": "advisor", "schema": "dc"}, {"key": "dc.contributor.advisor", "value": "Lakanen, Antti-Jussi", "language": "", "element": "contributor", "qualifier": "advisor", "schema": "dc"}, {"key": "dc.contributor.advisor", "value": "Itkonen, Jonne", "language": "", "element": "contributor", "qualifier": "advisor", "schema": "dc"}, {"key": "dc.contributor.author", "value": "Tarvainen, Seppo", "language": "", "element": "contributor", "qualifier": "author", "schema": "dc"}, {"key": "dc.date.accessioned", "value": "2018-05-25T11:28:47Z", "language": null, "element": "date", "qualifier": "accessioned", "schema": "dc"}, {"key": "dc.date.available", "value": "2018-05-25T11:28:47Z", "language": null, "element": "date", "qualifier": "available", "schema": "dc"}, {"key": "dc.date.issued", "value": "2018", "language": "", "element": "date", "qualifier": "issued", "schema": "dc"}, {"key": "dc.identifier.uri", "value": "https://jyx.jyu.fi/handle/123456789/58128", "language": null, "element": "identifier", "qualifier": "uri", "schema": "dc"}, {"key": "dc.description.abstract", "value": "JavaScript-sovelluskehysten k\u00e4ytt\u00f6 helpottaa asiakaspuolen sovelluskehityst\u00e4 ja parantaa sovelluksen yll\u00e4pidett\u00e4vyytt\u00e4. Oikean ty\u00f6kalun valitseminen on ohjelmoijalle kuitenkin haastava teht\u00e4v\u00e4 teknologioiden nopean kehittymisen vuoksi. Suunnittelutieteellisen tutkimuksen avulla selvitettiin suosittujen sovelluskehysten (AngularJS, Angular 5 ja React) eri ominaisuuksien, kuten staattisen tyypityksen, riippuvuusinjektion ja tarkkailijamallin k\u00e4yt\u00f6n sek\u00e4 komponentteihin osituksen vaikutusta kahteen yll\u00e4pidett\u00e4vyyden attribuuttiin: stabiilisuuteen ja muokattavuuteen. Tutkielmassa toteutettiin valituilla sovelluskehyksill\u00e4 ty\u00f6ajanseurantasovellukset, joita kehitettiin edelleen kuudessa versiop\u00e4ivityksess\u00e4. T\u00e4m\u00e4n j\u00e4lkeen SonarCloud-palvelussa selvitettiin sovellusten rivim\u00e4\u00e4r\u00e4 sek\u00e4 syklomaattinen ja kognitiivinen kompleksisuus. Mittaustulosten kautta tutkittiin valittujen ominaisuuksien vaikutusta yll\u00e4pidett\u00e4vyyden attribuutteihin muutosvaikutusanalyysin avulla. React-sovelluksissa k\u00e4ytetty tapa osittaa ohjelma komponentteihin kasvatti merkitt\u00e4v\u00e4sti sovellusten rivim\u00e4\u00e4r\u00e4\u00e4, mutta ei niiden kompleksisuusarvoja. Tulokset osoittivat my\u00f6s, ett\u00e4 tarkkailijamallin k\u00e4ytt\u00f6 vaikutti heikent\u00e4v\u00e4n yll\u00e4pidett\u00e4vyytt\u00e4, kun taas staattisella tyypityksell\u00e4 tai riippuvuusinjektion k\u00e4yt\u00f6ll\u00e4 ei havaittu olevan siihen merkitt\u00e4v\u00e4\u00e4 vaikutusta.", "language": "fi", "element": "description", "qualifier": "abstract", "schema": "dc"}, {"key": "dc.description.abstract", "value": "The use of JavaScript frameworks makes the clientside web application development process easier and improves software maintainability. However, choosing the right framework for the task at hand is challenging for the programmer due to the rapid evolvement of technology. This design science research process compares different features, such as static typing, dependency injection, observer pattern, and component partition used in some of the most popular JavaScript frameworks (AngularJS, Angular 5, and React) and how they affect different maintainability attributes, particularly on modifiability and stability. In this study, simple time tracking software systems were created with each chosen JavaScript frameworks. These software systems were further developed in six additional updates. All software versions were analyzed in SonarCloud-service by using the following software metrics: source lines of code, cyclomatic complexity and cognitive complexity. Commit-impact analysis was used for measuring how the chosen feature correlates with the maintainability attributes during the development process. Study shows that the way how component partition is implemented in React increases application size but not its complexity. Results also indicate that the use of observer pattern might decrease maintainability whereas dependency injection or the use of static typing did not have a significant impact on the maintainability attributes measured in this study.", "language": "en", "element": "description", "qualifier": "abstract", "schema": "dc"}, {"key": "dc.description.provenance", "value": "Submitted by Miia Hakanen (mihakane@jyu.fi) on 2018-05-25T11:28:47Z\nNo. of bitstreams: 0", "language": "en", "element": "description", "qualifier": "provenance", "schema": "dc"}, {"key": "dc.description.provenance", "value": "Made available in DSpace on 2018-05-25T11:28:47Z (GMT). No. of bitstreams: 0\n Previous issue date: 2018", "language": "en", "element": "description", "qualifier": "provenance", "schema": "dc"}, {"key": "dc.format.extent", "value": "131", "language": "", "element": "format", "qualifier": "extent", "schema": "dc"}, {"key": "dc.format.mimetype", "value": "application/pdf", "language": null, "element": "format", "qualifier": "mimetype", "schema": "dc"}, {"key": "dc.language.iso", "value": "fin", "language": null, "element": "language", "qualifier": "iso", "schema": "dc"}, {"key": "dc.rights", "value": "In Copyright", "language": "en", "element": "rights", "qualifier": null, "schema": "dc"}, {"key": "dc.subject.other", "value": "web-sovellus", "language": "", "element": "subject", "qualifier": "other", "schema": "dc"}, {"key": "dc.subject.other", "value": "sovelluskehys", "language": "", "element": "subject", "qualifier": "other", "schema": "dc"}, {"key": "dc.subject.other", "value": "suunnittelutieteellinen tutkimus", "language": "", "element": "subject", "qualifier": "other", "schema": "dc"}, {"key": "dc.title", "value": "JavaScript-sovelluskehyksilla\u0308 toteutettujen asiakassovellusten ylla\u0308pidetta\u0308vyyden vertailu", "language": "", "element": "title", "qualifier": null, "schema": "dc"}, {"key": "dc.type", "value": "master thesis", "language": null, "element": "type", "qualifier": null, "schema": "dc"}, {"key": "dc.identifier.urn", "value": "URN:NBN:fi:jyu-201805252791", "language": "", "element": "identifier", "qualifier": "urn", "schema": "dc"}, {"key": "dc.type.ontasot", "value": "Pro gradu -tutkielma", "language": "fi", "element": "type", "qualifier": "ontasot", "schema": "dc"}, {"key": "dc.type.ontasot", "value": "Master\u2019s thesis", "language": "en", "element": "type", "qualifier": "ontasot", "schema": "dc"}, {"key": "dc.contributor.faculty", "value": "Informaatioteknologian tiedekunta", "language": "fi", "element": "contributor", "qualifier": "faculty", "schema": "dc"}, {"key": "dc.contributor.faculty", "value": "Faculty of Information Technology", "language": "en", "element": "contributor", "qualifier": "faculty", "schema": "dc"}, {"key": "dc.contributor.department", "value": "Informaatioteknologia", "language": "fi", "element": "contributor", "qualifier": "department", "schema": "dc"}, {"key": "dc.contributor.department", "value": "Information Technology", "language": "en", "element": "contributor", "qualifier": "department", "schema": "dc"}, {"key": "dc.contributor.organization", "value": "Jyv\u00e4skyl\u00e4n yliopisto", "language": "fi", "element": "contributor", "qualifier": "organization", "schema": "dc"}, {"key": "dc.contributor.organization", "value": "University of Jyv\u00e4skyl\u00e4", "language": "en", "element": "contributor", "qualifier": "organization", "schema": "dc"}, {"key": "dc.subject.discipline", "value": "Tietotekniikka", "language": "fi", "element": "subject", "qualifier": "discipline", "schema": "dc"}, {"key": "dc.subject.discipline", "value": "Mathematical Information Technology", "language": "en", "element": "subject", "qualifier": "discipline", "schema": "dc"}, {"key": "yvv.contractresearch.funding", "value": "0", "language": "", "element": "contractresearch", "qualifier": "funding", "schema": "yvv"}, {"key": "dc.type.coar", "value": "http://purl.org/coar/resource_type/c_bdcc", "language": null, "element": "type", "qualifier": "coar", "schema": "dc"}, {"key": "dc.rights.accesslevel", "value": "openAccess", "language": null, "element": "rights", "qualifier": "accesslevel", "schema": "dc"}, {"key": "dc.type.publication", "value": "masterThesis", "language": null, "element": "type", "qualifier": "publication", "schema": "dc"}, {"key": "dc.subject.oppiainekoodi", "value": "602", "language": "", "element": "subject", "qualifier": "oppiainekoodi", "schema": "dc"}, {"key": "dc.subject.yso", "value": "sovelluskehykset", "language": null, "element": "subject", "qualifier": "yso", "schema": "dc"}, {"key": "dc.subject.yso", "value": "JavaScript", "language": null, "element": "subject", "qualifier": "yso", "schema": "dc"}, {"key": "dc.subject.yso", "value": "sovellukset (tietotekniikka)", "language": null, "element": "subject", "qualifier": "yso", "schema": "dc"}, {"key": "dc.format.content", "value": "fulltext", "language": null, "element": "format", "qualifier": "content", "schema": "dc"}, {"key": "dc.rights.url", "value": "https://rightsstatements.org/page/InC/1.0/", "language": null, "element": "rights", "qualifier": "url", "schema": "dc"}, {"key": "dc.type.okm", "value": "G2", "language": null, "element": "type", "qualifier": "okm", "schema": "dc"}]
id jyx.123456789_58128
language fin
last_indexed 2025-03-31T20:03:31Z
main_date 2018-01-01T00:00:00Z
main_date_str 2018
online_boolean 1
online_urls_str_mv {"url":"https:\/\/jyx.jyu.fi\/bitstreams\/423670c3-0725-4cbd-8f36-4b7fa49d9204\/download","text":"URN:NBN:fi:jyu-201805252791.pdf","source":"jyx","mediaType":"application\/pdf"}
publishDate 2018
record_format qdc
source_str_mv jyx
spellingShingle Tarvainen, Seppo JavaScript-sovelluskehyksillä toteutettujen asiakassovellusten ylläpidettävyyden vertailu web-sovellus sovelluskehys suunnittelutieteellinen tutkimus Tietotekniikka Mathematical Information Technology 602 sovelluskehykset JavaScript sovellukset (tietotekniikka)
title JavaScript-sovelluskehyksillä toteutettujen asiakassovellusten ylläpidettävyyden vertailu
title_full JavaScript-sovelluskehyksillä toteutettujen asiakassovellusten ylläpidettävyyden vertailu
title_fullStr JavaScript-sovelluskehyksillä toteutettujen asiakassovellusten ylläpidettävyyden vertailu JavaScript-sovelluskehyksillä toteutettujen asiakassovellusten ylläpidettävyyden vertailu
title_full_unstemmed JavaScript-sovelluskehyksillä toteutettujen asiakassovellusten ylläpidettävyyden vertailu JavaScript-sovelluskehyksillä toteutettujen asiakassovellusten ylläpidettävyyden vertailu
title_short JavaScript-sovelluskehyksillä toteutettujen asiakassovellusten ylläpidettävyyden vertailu
title_sort javascript sovelluskehyksilla toteutettujen asiakassovellusten ylla pidetta vyyden vertailu
title_txtP JavaScript-sovelluskehyksillä toteutettujen asiakassovellusten ylläpidettävyyden vertailu
topic web-sovellus sovelluskehys suunnittelutieteellinen tutkimus Tietotekniikka Mathematical Information Technology 602 sovelluskehykset JavaScript sovellukset (tietotekniikka)
topic_facet 602 JavaScript Mathematical Information Technology Tietotekniikka sovellukset (tietotekniikka) sovelluskehykset sovelluskehys suunnittelutieteellinen tutkimus web-sovellus
url https://jyx.jyu.fi/handle/123456789/58128 http://www.urn.fi/URN:NBN:fi:jyu-201805252791
work_keys_str_mv AT tarvainenseppo javascriptsovelluskehyksillatoteutettujenasiakassovellustenyllapidettavyydenverta AT tarvainenseppo javascriptsovelluskehyksillätoteutettujenasiakassovellustenylläpidettävyydenverta