Designing and developing portable large-scale JavaScript web applications within the Experiment Dashboard framework

Abstract

Improvements in web browser performance and web standards compliance, as well as the availability of comprehensive JavaScript libraries, provides an opportunity to develop functionally rich yet intuitive web applications that allow users to access, render and analyse data in novel ways. However, the development of such large-scale JavaScript web applications presents new challenges, in particular with regard to code sustainability and team-based work. We present an approach that meets the challenges of large-scale JavaScript web application design and development, including client-side model-view-controller architecture, design patterns, and JavaScript libraries. Furthermore, we show how the approach leads naturally to the encapsulation of the data source as a web API, allowing applications to be easily ported to new data sources. The Experiment Dashboard framework is used for the development of applications for monitoring the distributed computing activities of virtual organisations on the Worldwide LHC Computing Grid. We demonstrate the benefits of the approach for large-scale JavaScript web applications in this context by examining the design of several Experiment Dashboard applications for data processing, data transfer and site status monitoring, and by showing how they have been ported for different virtual organisations and technologies.

A Process Model for Dashboard Onboarding

“…This model introduces the onboarding loop as an equally important counterpart to the dashboard usage loop (see Figure 1). We based the onboarding loop's internal structures on the MVC software design pattern [ADK * 12]. Our choice to model the onboarding loop in a similar way was motivated not only by aesthetic considerations but also by the actionability requirement.…”

“…Dashboards can be described as a collection of typically linked visualizations of a dataset that are controlled by a user through a set of interactions. To formalize this description, we make use of the MVC software design pattern [ADK * 12], which allows us to break the dashboard down into three conceptual building blocks (see left part of Figure 2): (i) the underlying data model, (ii) the dashboard's visual components, and (iii) the control elements or interactions. Typically, dashboards do not reveal the underlying data model and logic to the end users, but let them manipulate the data model indirectly through interactions.…”

Accelerated Mobile Pages from JavaScript as Accelerator Tool for Web Service on E-Commerce in the E-Business

“…One of the strategies used is to automate the existing tasks in E-commerce by utilizing web service facilities, which will significantly save time [8]. Javascript language that is neglected in web programming has evolved into a technology that becomes the backbone of web services with multiplatform technology [9]. Accelerated mobile pages (AMP) is a javaScript-based program, which allows the website to open faster almost without any delay.…”